fix: 🐛 Corrige arquitetura de cache dos canais de notificação

prefeitura-rio · Nov 22, 2024 · 511b6cd · 511b6cd
1 parent 1f5e9cc
commit 511b6cd
Show file tree

Hide file tree

Showing 4 changed files with 44 additions and 81 deletions.
diff --git a/src/app/(app)/page.tsx b/src/app/(app)/page.tsx
@@ -9,12 +9,6 @@ export default async function App() {
       <Button asChild className="w-40">
         <Link href={'/vision-ai'}>Vision AI</Link>
       </Button>
-      <Button asChild className="w-40" disabled>
-        <Link href={'/vision-ai'}>Gestão de Acesso</Link>
-      </Button>
-      <Button asChild className="w-40" disabled>
-        <Link href={'/vision-ai'}>Feed e Notificações</Link>
-      </Button>
     </div>
   )
 }
diff --git a/src/app/(app)/vision-ai/components/channels-manager/components/channels-table.tsx b/src/app/(app)/vision-ai/components/channels-manager/components/channels-table.tsx
@@ -31,6 +31,7 @@ import { deleteNotificationChannel } from '@/http/notification-channel/delete-no
 import { updateNotificationChannel } from '@/http/notification-channel/update-notification-channel'
 import { queryClient } from '@/lib/react-query'
 import { cn } from '@/lib/utils'
+import type { NotificationChannel } from '@/models/entities'
 
 export function ChannelsTable() {
   const { data: channels } = useNotificationChannels()
@@ -51,11 +52,18 @@ export function ChannelsTable() {
     setIsLoading(true)
 
     createNotificationChannel(name)
-      .then(() => {
-        queryClient.invalidateQueries({
-          queryKey: ['notification-channels'],
-        })
+      .then((newChannel) => {
         setChannelName('')
+        const cached = queryClient.getQueryData<NotificationChannel[]>([
+          'notification-channels',
+        ])
+
+        if (!cached) return
+
+        queryClient.setQueryData<NotificationChannel[]>(
+          ['notification-channels'],
+          [...cached, newChannel],
+        )
       })
       .catch(() => {
         toast.error('Erro ao criar canal. Tente novamente.')
@@ -74,11 +82,23 @@ export function ChannelsTable() {
 
     setIsLoading(true)
     updateNotificationChannel(id, name)
-      .then(() => {
-        setChannelName('')
-        queryClient.invalidateQueries({
-          queryKey: ['notification-channels'],
-        })
+      .then((updatedChannel) => {
+        const cached = queryClient.getQueryData<NotificationChannel[]>([
+          'notification-channels',
+        ])
+
+        if (!cached) return
+
+        queryClient.setQueryData<NotificationChannel[]>(
+          ['notification-channels'],
+          cached.map((cachedChannel) =>
+            cachedChannel.id === updatedChannel.id
+              ? updatedChannel
+              : cachedChannel,
+          ),
+        )
+
+        setEdittingChannel(null)
       })
       .catch(() => {
         toast.error('Erro ao editar canal. Tente novamente.')
@@ -93,10 +113,17 @@ export function ChannelsTable() {
     setIsLoading(true)
     await deleteNotificationChannel(id)
       .then(() => {
-        queryClient.invalidateQueries({
-          queryKey: ['notification-channels'],
-        })
         setIsDeleteAlertOpen(false)
+        const cached = queryClient.getQueryData<NotificationChannel[]>([
+          'notification-channels',
+        ])
+
+        if (!cached) return
+
+        queryClient.setQueryData<NotificationChannel[]>(
+          ['notification-channels'],
+          cached.filter((cachedChannel) => cachedChannel.id !== id),
+        )
       })
       .catch(() => {
         toast.error('Erro ao excluir canal. Tente novamente.')
@@ -225,13 +252,16 @@ export function ChannelsTable() {
                           }
                           className={cn(
                             'relative',
-                            isLoading && 'text-destructive',
+                            isLoading &&
+                              'text-destructive flex items-center justify-center',
                           )}
                           disabled={isLoading}
                         >
                           Continuar
                           {isLoading && (
-                            <Spinner className="absolute-centered" />
+                            <div className="absolute-centered">
+                              <Spinner className="" />
+                            </div>
                           )}
                         </Button>
                       </AlertDialogFooter>

diff --git a/src/app/(app)/vision-ai/project/[id]/actions.ts b/src/app/(app)/vision-ai/project/[id]/actions.ts
diff --git a/src/app/(app)/vision-ai/project/[id]/page.tsx b/src/app/(app)/vision-ai/project/[id]/page.tsx
@@ -97,9 +97,6 @@ export default function ProjectDetails() {
     resolver: zodResolver(projectFormSchema),
   })
 
-  console.log('model', watch('model'))
-  console.log('notificationChannelId', watch('notificationChannelId'))
-
   useEffect(() => {
     async function handleRedirect() {
       await setToastDataCookie({
@@ -111,7 +108,6 @@ export default function ProjectDetails() {
     }
 
     if (project && channels && cameras) {
-      console.log('project', project)
       const channel = channels.find(
         (channel) => channel.id === project.discord_id,
       )