ux: session ID input validation

When creating a new session, validate that it meets the following conditions:

 - must start with an alphabetical
 - can be composed of alphanumerics with hyphens
 - can be length 1 or longer
 - cannot begin or end with a hyphen

pkg/interface/webterm/Tabs.tsx

@@ -3,29 +3,28 @@ import api from './api';
 import React from 'react';
 import useTermState from './state';
 import { Tab } from './Tab';
+import { SESSION_ID_REGEX } from './constants';
 
 export const Tabs = () => {
   const { sessions, names } = useTermState();
 
   const onAddClick = () => {
     const name = prompt('please entew a session name uwu');
-    if (!name) {
+    if (!name || !SESSION_ID_REGEX.test(name) || names.includes(name)) {
+      console.log('invalid session name:', name);
       return;
     }
-    //TODO  name must be @ta
-    api.poke(pokeTask(name, { open: { term: 'hood', apps: [{ who: '~'+(window as any).ship, app: 'dojo' }] } }));
+    api.poke(pokeTask(name, { open: { term: 'hood', apps: [{ who: '~' + (window as any).ship, app: 'dojo' }] } }));
     useTermState.getState().set(state => {
       state.names = [name, ...state.names].sort();
       state.selected = name;
       state.sessions[name] = null;
     });
-
-
   }
 
   return (
     <div className="tabs">
-      { names.map((n, i) => {
+      {names.map((n, i) => {
         return (
           <Tab session={sessions[n]} name={n} key={i} />
         );

pkg/interface/webterm/constants.ts

@@ -1 +1,11 @@
 export const DEFAULT_SESSION = '';
+
+/**
+ * Session ID validity:
+ * 
+ * - must start with an alphabetical
+ * - can be composed of alphanumerics with hyphens
+ * - can be length 1 or longer
+ * - cannot begin or end with a hyphen
+ */
+export const SESSION_ID_REGEX = /(^[a-z]{1}[a-z\d\-]*[a-z\d]{1}$)|(^[a-z]{1}$)/;