most of home page done

ssr/buildHome.ts

@@ -8,8 +8,8 @@ interface Plan {
 
 const makePlanButtons = (planId: string, deleted: boolean) =>
   deleted
-    ? `<button>restore</button><button>perm delete</button>`
+    ? `<button onclick="doAction('undelete','${planId}')">restore</button><button onclick="doAction('perm-delete','${planId}')">perm delete</button>`
-    : `<button>open</button><button>share</button><button>rename</button><button>move</button><button>delete</button>`;
+    : `<button>open</button><button>share</button><button onclick="doAction('rename','${planId}')">rename</button><button onclick="doAction('move','${planId}')">move</button><button onclick="doAction('delete','${planId}')">delete</button>`;
 
 const makePlanItem = (plan: Plan, deleted: boolean) => `<li>${plan.folder}${plan.folder && '/'}${plan.name} - ${makePlanButtons(plan.id, deleted)}</li>`;
 
@@ -17,7 +17,7 @@ export default async (userId: string, userName: string) => {
   let failed = false;
 
   const plans: Plan[] = await dbClient
-    .query('SELECT id, name, folder FROM plans WHERE ownerId = ? AND deleted = 0 GROUP BY folder,name,id ORDER BY folder,name DESC', [userId])
+    .query('SELECT id, name, folder FROM plans WHERE ownerId = ? AND deleted = 0 GROUP BY folder,name,id ORDER BY folder ASC,name ASC', [userId])
     .catch((e) => {
       console.error(e);
       failed = true;
@@ -25,13 +25,31 @@ export default async (userId: string, userName: string) => {
   if (failed) return "Couldn't read DB.";
 
   const deletedPlans: Plan[] = await dbClient
-    .query('SELECT id, name, folder FROM plans WHERE ownerId = ? AND deleted = 1 GROUP BY folder,name,id ORDER BY folder,name DESC', [userId])
+    .query('SELECT id, name, folder FROM plans WHERE ownerId = ? AND deleted = 1 GROUP BY folder,name,id ORDER BY folder ASC,name ASC', [userId])
     .catch(() => {
       failed = true;
     });
   if (failed) return "Couldn't read DB.";
 
   return `<div>
+<script>
+const actionMethod = new Map([['rename','PUT'],['move','PUT'],['undelete','PUT'],['delete','DELETE'],['perm-delete','DELETE']]);
+function doAction(action,planId){
+let newName='';
+if(action==='rename'||action==='move'){newName=prompt(\`Please provide a new \${action==='rename'?'plan':'folder'} name:\`);if(!newName){return;}}
+let userName=localStorage.getItem('name');
+if(!userName){userName=prompt('Please enter your username:');if(!userName){return;}}
+const userPIN=prompt('Please enter your PIN:');
+fetch(\`/api/\${action}/\${planId}\`,{method:actionMethod.get(action),body:JSON.stringify({name:userName,pin:userPIN,folder:newName,planName:newName})})
+.catch((e)=>{e.text().then((text)=>{alert(text);});})
+.then((r) => {
+if(r.status===200){localStorage.setItem('name',userName);r.text().then((text)=>{alert(text);location.reload();});}
+else{r.text().then((text)=>{alert(text);});}
+});
+}
+</script>
+<p>This is a very basic management page.  Please excuse the number of alert/prompts that will come up when you click on things as it was the quickest way to build it out.</p>
+<p>Please note: anything modifying data will require you to enter your PIN again as both the web view you are looking at and server behind it are completely stateless for simplicity.</p>
 <h3>${userName}'s Plans:</h3>
 <ul>
 ${plans.map((plan) => makePlanItem(plan, false)).join('')}