Merge pull request #71 from premieroctet/fix/optimistic-update

fix: optimistic update

src/actions/delete-invitation.ts

@@ -2,7 +2,7 @@
 import db from '@/lib/db';
 import * as Sentry from '@sentry/nextjs';
 import { checkAuthAction, getErrorMessage } from './utils';
-import { revalidateTag } from 'next/cache';
+import { revalidatePath } from 'next/cache';
 
 interface DeleteInvitationResult {
   error?: {
@@ -32,6 +32,7 @@ export default async function deleteInvitation(
       },
     });
 
+    revalidatePath('/teams/[teamSlug]/settings');
     return { data: { invitationId } };
   } catch (err: any) {
     Sentry.captureException(err);

src/actions/generate-api-key.ts

@@ -2,7 +2,6 @@
 import db from '@/lib/db';
 import * as Sentry from '@sentry/nextjs';
 import jwt from 'jsonwebtoken';
-import { revalidateTag } from 'next/cache';
 
 interface APIKeyGenerationResult {
   error?: {

src/actions/update-team-info.ts

@@ -1,7 +1,6 @@
 'use server';
 import db from '@/lib/db';
 import * as Sentry from '@sentry/nextjs';
-import { revalidateTag } from 'next/cache';
 import { checkAuthAction, checkTeamAction, getErrorMessage } from './utils';
 import { Team } from '@prisma/client';
 

src/components/teams/settings-tabs/invitations/InvitationList.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import useCustomToast from '@/hooks/useCustomToast';
-import { useTransition, useOptimistic } from 'react';
+import { useTransition } from 'react';
 import { TeamInvitation } from '@/lib/queries';
 import message from '@/messages/en';
 import InvitationItem from './InvitationItem';
@@ -14,15 +14,9 @@ type Props = {
 const InvitationList = ({ invitations }: Props) => {
   const { successToast, errorToast } = useCustomToast();
   const [isPending, startTransition] = useTransition();
-  const [optiInvitations, removeOptiInvitation] = useOptimistic(
-    invitations || [],
-    (state, deleteId: string) =>
-      [...state].filter((invitation) => invitation?.id !== deleteId)
-  );
 
   const handleDeleteInvitation = async (invitation: TeamInvitation) => {
     startTransition(async () => {
-      removeOptiInvitation(invitation?.id);
       const { error } = await deleteInvitation(invitation.id);
       if (error) {
         errorToast(error.message);
@@ -35,7 +29,7 @@ const InvitationList = ({ invitations }: Props) => {
 
   return (
     <div className="flex flex-col gap-2 pt-4">
-      {optiInvitations.map((invitation: TeamInvitation) => (
+      {invitations.map((invitation: TeamInvitation) => (
         <InvitationItem
           key={invitation.id}
           invitation={invitation}