fix: correct some workflow problems

app/components/Settings/Profiles/ProfilesTable.tsx

@@ -10,7 +10,7 @@ import {
   Typography
 } from '@mui/material';
 import { nanoid } from 'nanoid';
-import { Dispatch, useEffect, useState } from 'react';
+import { Dispatch, useCallback, useEffect, useState } from 'react';
 import { useFormState } from 'react-dom';
 import { Profiles } from '../../../../data/types';
 import { CreateProfileAction } from './actions/CreateProfileAction';
@@ -51,6 +51,11 @@ export default function ProfilesTable({
     fetchProfiles();
   }, [formState, refreshKey]);
 
+  const handleDelete = useCallback(async () => {
+    setRefreshKey((prevKey) => prevKey + 1);
+    setSelectedProfile(undefined);
+  }, [setSelectedProfile]);
+
   return (
     <Stack
       sx={{
@@ -78,6 +83,7 @@ export default function ProfilesTable({
             <TableHead>
               <TableRow sx={{ '& th': { textAlign: 'center' } }}>
                 <TableCell>Name</TableCell>
+                <TableCell>Creation date</TableCell>
                 <TableCell>Delete</TableCell>
               </TableRow>
             </TableHead>
@@ -89,7 +95,7 @@ export default function ProfilesTable({
                     profile={profile}
                     selected={selectedProfile}
                     setSelected={setSelectedProfile}
-                    onDelete={() => setRefreshKey((prevKey) => prevKey + 1)}
+                    onDelete={handleDelete}
                   />
                 ))}
             </TableBody>

app/components/Settings/Profiles/ProfilesTableRow.tsx

@@ -55,13 +55,17 @@ export default function ProfilesTableRow({
   };
 
   return (
-    <TableRow key={profile.id}>
-      <TableCell
-        align="center"
-        onClick={handleClick}
-        onDoubleClick={handleDoubleClick}
-        sx={{ bgcolor: profile.id === selected ? 'lightblue' : 'inherit' }}
-      >
+    <TableRow
+      sx={{
+        '& td': {
+          textAlign: 'center',
+          bgcolor: profile.id === selected ? 'lightblue' : 'inherit'
+        }
+      }}
+      onClick={handleClick}
+      key={profile.id}
+    >
+      <TableCell onDoubleClick={handleDoubleClick}>
         {isEditing ? (
           <TextField
             value={name}
@@ -73,7 +77,8 @@ export default function ProfilesTableRow({
           name
         )}
       </TableCell>
-      <TableCell align="center">
+      <TableCell>{new Date(profile.createdAt).toLocaleString()}</TableCell>
+      <TableCell>
         <Button onClick={handleDelete}>Delete</Button>
       </TableCell>
     </TableRow>

app/components/Settings/Tags/TagsTable.tsx

@@ -40,6 +40,8 @@ export default function TagsTable({ selectedProfile }: TagsTableProps) {
         } catch (error) {
           console.error("Couldn't fetch tags.");
         }
+      } else {
+        setTags([]);
       }
     };
 
@@ -82,6 +84,7 @@ export default function TagsTable({ selectedProfile }: TagsTableProps) {
             <TableHead>
               <TableRow sx={{ '& th': { textAlign: 'center' } }}>
                 <TableCell>Name</TableCell>
+                <TableCell>Creation date</TableCell>
                 <TableCell>Delete</TableCell>
               </TableRow>
             </TableHead>

app/components/Settings/Tags/TagsTableRow.tsx

@@ -57,8 +57,11 @@ export default function TagsTableRow({ tag, onDelete }: TagsTableRowProps) {
           name
         )}
       </TableCell>
+      <TableCell>{new Date(tag.createdAt).toLocaleString()}</TableCell>
       <TableCell>
-        <Button onClick={handleDelete}>Delete</Button>
+        <Button onClick={handleDelete} disabled={tag.Items > 0}>
+          Delete
+        </Button>
       </TableCell>
     </TableRow>
   );

app/components/Settings/Tags/actions/TagsAction.ts

@@ -2,7 +2,6 @@
 
 import { z } from 'zod';
 import { initializeUser } from '../../../../../data/initializeUser';
-import { Profiles } from '../../../../../data/types';
 import prisma from '../../../../../prisma/prisma';
 
 interface TagsActionProps {
@@ -19,7 +18,7 @@ export async function TagsAction({ selectedProfile }: TagsActionProps) {
   const user = await initializeUser();
 
   try {
-    const profiles = await prisma.tag.findMany({
+    const tags = await prisma.tag.findMany({
       where: {
         Profile: {
           User: {
@@ -28,12 +27,22 @@ export async function TagsAction({ selectedProfile }: TagsActionProps) {
           id: selectedProfile
         }
       },
+      include: {
+        Items: {
+          select: {
+            id: true
+          }
+        }
+      },
       orderBy: {
         createdAt: 'desc'
       }
     });
 
-    return profiles as Profiles;
+    return tags.map((tag) => ({
+      ...tag,
+      Items: tag.Items.length
+    }));
   } catch (error) {
     throw new Error('Failed to find tags');
   }