improve tab nav

src/app/lib/get.ts

@@ -13,6 +13,14 @@ export async function getStoriesWithGenres() {
 
 	)
 }
+export async function getStoriesWithGenresAndSubs() {
+	return prisma.story.findMany({
+		include: {
+			genres: true,
+			subs: true
+		}
+	})
+}
 
 export async function getPubs() {
 	return prisma.pub.findMany()

src/app/publication/columns.tsx

@@ -18,11 +18,13 @@ import { PubsWithGenres } from "./page"
 import { DialogClose } from "@radix-ui/react-dialog"
 import { actions } from "app/ui/tables/actions"
 import { TextInputCell } from "app/ui/inputs/textInput"
+import { selectCol } from "app/ui/tables/selectColumn"
 
 
 const columnHelper = createColumnHelper<PubsWithGenres>()
 
 export const columns: ColumnDef<PubsWithGenres>[] = [
+  selectCol,
   {
     accessorKey: "title",
     header: ({ column }) => {

src/app/ui/inputs/textInput.tsx

@@ -26,6 +26,9 @@ export const TextInputCell = (props: CellContext<any, any>) => {
     initialValue = value
     handleClose()
   }
+  function handleOpen() {
+    setIsActive(true)
+  }
   function handleClose() {
     setValue(initialValue)
     setIsActive(false)
@@ -40,6 +43,12 @@ export const TextInputCell = (props: CellContext<any, any>) => {
   return (<div
     onDoubleClick={() => setIsActive(prev => !prev)}
     className="w-full h-fit flex items-center justify-center"
+    tabIndex={0}
+    onKeyDown={e => {
+      if (e.code === "Enter" && !isActive) {
+        setIsActive(true)
+      }
+    }}
   >
     {isActive ?
       <Input

src/app/ui/tables/contextMenu.tsx

@@ -22,21 +22,9 @@ export default function FormContextMenu({ table, row }: ComponentProps<"div"> &
           </>
           : ""
         }
+
         {
-          selectedRows.length <= 1 ?
+          selectedRows.length > 0 ?
-            <ContextMenuSub>
-              <ContextMenuSubTrigger>Edit</ContextMenuSubTrigger>
-              <ContextMenuSubContent>
-                {Object.keys(row.original).map(e => {
-                  if (e !== "id") {
-                    return <ContextMenuItem>{letterCase(e)}</ContextMenuItem>
-                  }
-                })}
-              </ContextMenuSubContent>
-            </ContextMenuSub> : ""
-        }
-        {
-          selectedRows ?
             <ContextMenuItem onClick={() => { table.resetRowSelection() }}>Deselect</ContextMenuItem>
             : ""
         }

src/app/ui/tables/selectColumn.tsx

@@ -22,7 +22,9 @@ export const selectCol = {
         <Checkbox
           checked={props.row.getIsSelected()}
           onCheckedChange={props.row.toggleSelected}
-          aria-label="select/deselect row" />
+          aria-label="select/deselect row"
+        />
+
       </div>
     )
   }