From 9950814ca6af063719cd5755e2f47fe18b43ba76 Mon Sep 17 00:00:00 2001
From: andrzej <andrzejjamesstepien@gmail.com>
Date: Wed, 24 Jul 2024 22:41:46 +0200
Subject: [PATCH] improve title styling

---
 prisma/dev.db                          | Bin 69632 -> 69632 bytes
 src/app/publication/columns.tsx        |   7 ++--
 src/app/publication/page.tsx           |   2 +-
 src/app/submission/columns.tsx         |   5 +--
 src/app/submission/edit.tsx            |   2 +-
 src/app/tailwind.css                   |   4 ---
 src/app/ui/forms/sub.tsx               |   3 +-
 src/app/ui/tables/actions.tsx          |  45 -------------------------
 src/app/ui/tables/inputs/textInput.tsx |   4 ++-
 src/app/ui/titleContainer.tsx          |  11 ++++++
 10 files changed, 23 insertions(+), 60 deletions(-)
 delete mode 100644 src/app/ui/tables/actions.tsx
 create mode 100644 src/app/ui/titleContainer.tsx

diff --git a/prisma/dev.db b/prisma/dev.db
index 9c6c0b904d2f766d9ec87accbeaeb592346b6509..124ecb9298d9b0ef2e6dbe8c62990d67798d16e4 100644
GIT binary patch
delta 911
zcma)5O-NKx6u#&E-TVIL_?Hd&9N&zJfh1FlaG@ZCiHb?os)aw)pbK$?vIvVD2|{Qw
zHqfjhgP?_h*`p+|+(c5-V#**P#6=XOrC_#53Oeu2!fhNl-@E60=iKj{#~q(m#;28Z
z1vF1N$DnzxZ?GFGGq1a&U}rYEYpu{<e2z2N=$ls@p9y7_dOkGZI*Zjup>^nD;=Fsp
zZF5YORn@_{M5(2+eN`}$G;I2?VPq&d63M*ojVg?>a&NOY96vY)xQNg2F}1yqcQB2U
zcpLNh27luOuHi@giQn-Hj(H8~F63&p3?Mt1iMwZxOA=EevJR3OqoC@jQ3A<PT#7lW
zLkFeSz!$6(2LM0eHqK&>y1vJCe2Nb+i#PBR4tTNYRuo(Tzi)LWIXl=cNmWc!bZQm}
z;;Iu1P;#O{*l`1>E3t8fX_#a91HV$=UDBGvM|<W)Tc)scg;juL615CuA8e3>UkE}q
z{Ao0WlVXEb5&~5aa8QJ*_``5TrW99o|DY+t`?FYF#CLHAH}R%dmcN1$X}-1Ae<-FB
z#fb*qHE@}9EijsP1K;9H{EQ1^4+C4qWzuyWuMsIs!iorsd}V}!q=gE*(2T;&njQ>m
zaNH)EDl8HxNT69rb0tV~InXWa;G_uyR|}ij#doxmE&N7*(%Um)do_J&JWISVNmyki
zBw&?UBIH*J+aE+T0<Zg??*Bzui@YXGKf;y3`xmQPKomA#Vw}GMbH_{=O(Jhh>RY1a
zNjc1MMekvkvpEi<`%`wM&VZ$gQ#RCgC5PRP{$V%Xn7wB}SvC=Z8sk*|1-E0Af`|R!
z(U6rg4+JGPl~iWyZAgX9Fq>ikg)ZWM+LT+Jj_^xt1`+M_XoBt-a*t$B8qhf3WI&rl
R&qBVMZ84yIK5s!>{s)1>y!HS9

delta 805
zcma)2O-K}B82-L*zHh#nac3XRaoKd#-D)WaY!mxA2>sD7h#oq1NIeJ(feQ=LMacCM
zMh9)dg&<lX=wKi^lyu2k;?F@eFp3h1g0u|E4rM{#H;eZec;9*FectD121<OO#E0u>
zdc;3R)0179c3M}MYfn<Au-Tr9U?ch$C(BPzl^%~4X0N}Jgpj7gNm?kKs&(s`AgTTI
zQZ|>%<_dG2N$y#K1Y4c)^r3!&89c`n#_<RbFpMGmz!!YPD3&mfUl_!DtfD_?8g7GR
zJYm?B6$T$(yI?TUU{K1Kh^Z!gQKKiHdkWzTUkyCv;038hh9HCQn81SKdxH%;!($Y2
z8#l2W>?@sz#Y}Fi<3u4lkvU_qM#-sWZV0>ZW98Ye31Pk$wu5_I6;fiE;J5Pp6`!z%
z*I34Ukn9@6NXa`ArG`zoRE8X3YD1O~su`Bx+N<P-T1mn5U~(G#nW?IjcNN_>wgPXd
zA52-gx7MAC=`+73tez9fE^66LEUI81@D?jrDa&@a9hFMfBB4n~hSs@dhFvL_qevdE
zrBNPDCe#nG%`){W!47`n8$K)QcUTQ7yQVPG5jh*NEp5S(x>{yf!$gwncWLNqG8N7?
zT{%mHd`T;|D|(z(x84~-9Py_yIw^TYob?qKB<&lus8<__<fGL#p)_BWcd2i-WqT8C
z-MK`%r8wqLuXw|v2W<WEN?&i{XmLGCPsAgHn70U_c~_mVt9?D;vV3ve*#$SZ6xSVv
uR<X=G|BK$M&|*j1(cHe=C2u~a?KDoeI`ksr?h|sqc-o<tr<Wo$ZTtg^->CTj

diff --git a/src/app/publication/columns.tsx b/src/app/publication/columns.tsx
index 144282c..2962191 100644
--- a/src/app/publication/columns.tsx
+++ b/src/app/publication/columns.tsx
@@ -8,6 +8,7 @@ import { TextInputCell } from "app/ui/tables/inputs/textInput"
 import { selectCol } from "app/ui/tables/selectColumn"
 import NumberInputCell from "app/ui/tables/inputs/numberInput"
 import { formSchema } from "app/ui/forms/pub"
+import GenrePickerInputCell from "app/ui/tables/inputs/genrePickerInput"
 
 
 const columnHelper = createColumnHelper<PubsWithGenres>()
@@ -39,11 +40,7 @@ export const columns: ColumnDef<PubsWithGenres>[] = [
   },
 
   columnHelper.accessor("genres", {
-    cell: props => {
-      const genres = props.getValue()
-        .map(e => <Badge>{e.name}</Badge>)
-      return genres
-    },
+    cell: GenrePickerInputCell,
     filterFn: "arrIncludes"
     //TODO - write custom filter function, to account for an array of objects
   }),
diff --git a/src/app/publication/page.tsx b/src/app/publication/page.tsx
index 4162619..56dfc55 100644
--- a/src/app/publication/page.tsx
+++ b/src/app/publication/page.tsx
@@ -13,7 +13,7 @@ export default async function Page() {
   const pubs = await getPubsWithGenres()
   return (
     <div className="container mx-auto">
-      <DataTable data={pubs} columns={columns} tableName="pub">
+      <DataTable data={pubs} columns={columns} tableName="pubs" genres={genres}>
         <CreatePubDialog genres={genres} />
       </DataTable>
 
diff --git a/src/app/submission/columns.tsx b/src/app/submission/columns.tsx
index fb1dd37..c80c6d8 100644
--- a/src/app/submission/columns.tsx
+++ b/src/app/submission/columns.tsx
@@ -4,6 +4,7 @@ import { ArrowUpDown } from "lucide-react"
 import { Button } from "@/components/ui/button"
 import { SubComplete } from "./page"
 import { selectCol } from "app/ui/tables/selectColumn"
+import TitleContainer from "app/ui/titleContainer"
 
 
 
@@ -18,7 +19,7 @@ export const columns: ColumnDef<SubComplete>[] = [
     },
     id: "story",
     header: "Story",
-    cell: (props: CellContext<any, any>) => (<p className="w-full text-left">{props.getValue()}</p>)
+    cell: (props: CellContext<any, any>) => (<TitleContainer>{props.getValue()}</TitleContainer>)
   },
   {
     accessorFn: row => {
@@ -29,7 +30,7 @@ export const columns: ColumnDef<SubComplete>[] = [
     },
     id: "pub",
     header: "Publication",
-    cell: (props: CellContext<any, any>) => (<p className="w-full text-left">{props.getValue()}</p>)
+    cell: (props: CellContext<any, any>) => (<TitleContainer>{props.getValue()}</TitleContainer>)
   },
   {
     accessorFn: row => new Date(row.submitted),
diff --git a/src/app/submission/edit.tsx b/src/app/submission/edit.tsx
index c1b5750..2ae4c96 100644
--- a/src/app/submission/edit.tsx
+++ b/src/app/submission/edit.tsx
@@ -16,7 +16,7 @@ export default function EditSubmissionDialog({ stories, pubs, responses, default
         <DialogTitle>Edit Submission</DialogTitle>
         <DialogDescription>Change response status, edit dates etc</DialogDescription>
       </DialogHeader>
-      <SubmissionForm createSub={createSub} pubs={pubs} responses={responses} stories={stories} defaults={defaults} />
+      <SubmissionForm pubs={pubs} responses={responses} stories={stories} defaults={defaults} />
       <DialogFooter>
         <DialogClose asChild>
         </DialogClose>
diff --git a/src/app/tailwind.css b/src/app/tailwind.css
index c0fc71c..bfe7073 100644
--- a/src/app/tailwind.css
+++ b/src/app/tailwind.css
@@ -1092,10 +1092,6 @@ body {
   justify-content: space-between;
 }
 
-.justify-around {
-  justify-content: space-around;
-}
-
 .gap-1 {
   gap: 0.25rem;
 }
diff --git a/src/app/ui/forms/sub.tsx b/src/app/ui/forms/sub.tsx
index 5472f89..444a980 100644
--- a/src/app/ui/forms/sub.tsx
+++ b/src/app/ui/forms/sub.tsx
@@ -33,6 +33,7 @@ import {
 } from "@/components/ui/select"
 import { useState } from "react"
 import { editSubmission } from "app/lib/edit"
+import { createSub } from "app/lib/create"
 
 export const formSchema = z.object({
 	id: z.number().optional(),
@@ -76,7 +77,7 @@ export const formSchema = z.object({
 export type SubForm = z.infer<typeof formSchema>
 
 
-export default function SubmissionForm({ stories, pubs, responses, createSub, defaults }) {
+export default function SubmissionForm({ stories, pubs, responses, defaults }) {
 	const form = useForm<z.infer<typeof formSchema>>({
 		resolver: zodResolver(formSchema),
 		defaultValues: {
diff --git a/src/app/ui/tables/actions.tsx b/src/app/ui/tables/actions.tsx
deleted file mode 100644
index 4ee5e80..0000000
--- a/src/app/ui/tables/actions.tsx
+++ /dev/null
@@ -1,45 +0,0 @@
-import { Dialog, DialogTrigger, DialogClose, DialogDescription, DialogContent, DialogTitle, DialogHeader, DialogFooter } from "@/components/ui/dialog"
-import Link from "next/link"
-import { Trash2, Search, Pencil } from "lucide-react"
-import { Button } from "@/components/ui/button"
-
-export function actions({ pathname, deleteFn }: { pathname: string, deleteFn: (id: number) => void }) {
-  return {
-    id: "actions",
-    // header: "Actions",
-    cell: ({ row }) => {
-      return <div className="flex items-center justify-around">
-        {!(pathname === "/submission") ?
-          <Link href={`${pathname}/${row.original.id}`}><Button variant="ghost"><Search /></Button></Link>
-          : ""
-        }
-
-        <Link href={`${pathname}/edit/${row.original.id}`}><Button variant="ghost"><Pencil /></Button></Link>
-
-        <Dialog>
-          <DialogTrigger asChild>
-            <Button variant="ghost"><Trash2 color="red" /></Button>
-          </DialogTrigger>
-          <DialogContent>
-            <DialogHeader>
-              <DialogTitle>Are you sure?</DialogTitle>
-              <DialogDescription>
-                Deleting a {pathname.slice(1)} cannot be undone!
-              </DialogDescription>
-            </DialogHeader>
-            <DialogFooter>
-              <DialogClose asChild>
-                <Button variant="destructive"
-                  onClick={() => {
-                    deleteFn(row.original.id)
-                  }}>Yes, delete it!
-                </Button>
-              </DialogClose>
-            </DialogFooter>
-          </DialogContent>
-        </Dialog>
-      </div>
-    }
-  }
-}
-
diff --git a/src/app/ui/tables/inputs/textInput.tsx b/src/app/ui/tables/inputs/textInput.tsx
index 7a5afd3..cc35c45 100644
--- a/src/app/ui/tables/inputs/textInput.tsx
+++ b/src/app/ui/tables/inputs/textInput.tsx
@@ -8,6 +8,7 @@ import { useForm } from "react-hook-form";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { toast } from "@/components/ui/use-toast";
 import { Form, FormControl, FormField, FormItem, FormMessage } from "@/components/ui/form";
+import TitleContainer from "app/ui/titleContainer";
 
 export function TextInputCell(props: CellContext<any, any>) {
   const [isActive, setIsActive] = useState(false)
@@ -82,6 +83,7 @@ export function TextInputCell(props: CellContext<any, any>) {
                   <FormControl
                   >
                     <Input
+                      className="w-fit"
                       type="text"
                       autoFocus={true}
                       {...field}
@@ -94,7 +96,7 @@ export function TextInputCell(props: CellContext<any, any>) {
 
           </form>
         </Form>
-        : <p>{props.cell.getValue()}</p>
+        : <TitleContainer>{props.cell.getValue()}</TitleContainer>
       }
     </div >
   )
diff --git a/src/app/ui/titleContainer.tsx b/src/app/ui/titleContainer.tsx
new file mode 100644
index 0000000..edee6ff
--- /dev/null
+++ b/src/app/ui/titleContainer.tsx
@@ -0,0 +1,11 @@
+import { ComponentProps } from "react";
+
+export default function itleContainer({ children }: ComponentProps<"div">) {
+  let classes = "w-full text-left m-auto"
+  console.table(children)
+  if (children == "RECORD DELETED") {
+    console.log("BINGO")
+    classes = classes + " text-destructive font-bold"
+  }
+  return <span className="h-10 flex align-center"><p className={classes}>{children}</p></span>
+}