fix: wip

apps/remix/app/components/dialogs/team-email-add-dialog.tsx

@@ -7,6 +7,7 @@ import { Trans } from '@lingui/react/macro';
 import type * as DialogPrimitive from '@radix-ui/react-dialog';
 import { Plus } from 'lucide-react';
 import { useForm } from 'react-hook-form';
+import { useRevalidator } from 'react-router';
 import type { z } from 'zod';
 
 import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
@@ -50,6 +51,7 @@ export const TeamEmailAddDialog = ({ teamId, trigger, ...props }: TeamEmailAddDi
 
   const { _ } = useLingui();
   const { toast } = useToast();
+  const { revalidate } = useRevalidator();
 
   const form = useForm<TCreateTeamEmailFormSchema>({
     resolver: zodResolver(ZCreateTeamEmailFormSchema),
@@ -76,7 +78,7 @@ export const TeamEmailAddDialog = ({ teamId, trigger, ...props }: TeamEmailAddDi
         duration: 5000,
       });
 
-      // router.refresh(); // Todo
+      await revalidate();
 
       setOpen(false);
     } catch (err) {

apps/remix/app/components/dialogs/team-email-delete-dialog.tsx

@@ -4,6 +4,7 @@ import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import type { Prisma } from '@prisma/client';
+import { useRevalidator } from 'react-router';
 
 import { formatAvatarUrl } from '@documenso/lib/utils/avatars';
 import { extractInitials } from '@documenso/lib/utils/recipient-formatter';
@@ -44,6 +45,7 @@ export const TeamEmailDeleteDialog = ({ trigger, teamName, team }: TeamEmailDele
 
   const { _ } = useLingui();
   const { toast } = useToast();
+  const { revalidate } = useRevalidator();
 
   const { mutateAsync: deleteTeamEmail, isPending: isDeletingTeamEmail } =
     trpc.team.deleteTeamEmail.useMutation({
@@ -92,7 +94,7 @@ export const TeamEmailDeleteDialog = ({ trigger, teamName, team }: TeamEmailDele
       await deleteTeamEmailVerification({ teamId: team.id });
     }
 
-    // router.refresh(); // Todo
+    await revalidate();
   };
 
   return (

apps/remix/app/components/dialogs/team-email-update-dialog.tsx

@@ -7,6 +7,7 @@ import { Trans } from '@lingui/react/macro';
 import type { TeamEmail } from '@prisma/client';
 import type * as DialogPrimitive from '@radix-ui/react-dialog';
 import { useForm } from 'react-hook-form';
+import { useRevalidator } from 'react-router';
 import { z } from 'zod';
 
 import { trpc } from '@documenso/trpc/react';
@@ -51,6 +52,7 @@ export const TeamEmailUpdateDialog = ({
 
   const { _ } = useLingui();
   const { toast } = useToast();
+  const { revalidate } = useRevalidator();
 
   const form = useForm<TUpdateTeamEmailFormSchema>({
     resolver: zodResolver(ZUpdateTeamEmailFormSchema),
@@ -76,7 +78,7 @@ export const TeamEmailUpdateDialog = ({
         duration: 5000,
       });
 
-      // router.refresh(); // Todo
+      await revalidate();
 
       setOpen(false);
     } catch (err) {

apps/remix/app/components/dialogs/team-member-invite-dialog.tsx

@@ -46,9 +46,9 @@ import {
 import { Tabs, TabsContent, TabsList, TabsTrigger } from '@documenso/ui/primitives/tabs';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 
+import { useCurrentTeam } from '~/providers/team';
+
 export type TeamMemberInviteDialogProps = {
-  currentUserTeamRole: TeamMemberRole;
-  teamId: number;
   trigger?: React.ReactNode;
 } & Omit<DialogPrimitive.DialogProps, 'children'>;
 
@@ -95,12 +95,7 @@ const ZImportTeamMemberSchema = z.array(
   }),
 );
 
-export const TeamMemberInviteDialog = ({
-  currentUserTeamRole,
-  teamId,
-  trigger,
-  ...props
-}: TeamMemberInviteDialogProps) => {
+export const TeamMemberInviteDialog = ({ trigger, ...props }: TeamMemberInviteDialogProps) => {
   const [open, setOpen] = useState(false);
   const fileInputRef = useRef<HTMLInputElement>(null);
   const [invitationType, setInvitationType] = useState<TabTypes>('INDIVIDUAL');
@@ -108,6 +103,8 @@ export const TeamMemberInviteDialog = ({
   const { _ } = useLingui();
   const { toast } = useToast();
 
+  const team = useCurrentTeam();
+
   const form = useForm<TInviteTeamMembersFormSchema>({
     resolver: zodResolver(ZInviteTeamMembersFormSchema),
     defaultValues: {
@@ -141,7 +138,7 @@ export const TeamMemberInviteDialog = ({
   const onFormSubmit = async ({ invitations }: TInviteTeamMembersFormSchema) => {
     try {
       await createTeamMemberInvites({
-        teamId,
+        teamId: team.id,
         invitations,
       });
 
@@ -203,7 +200,7 @@ export const TeamMemberInviteDialog = ({
 
           setInvitationType('INDIVIDUAL');
         } catch (err) {
-          console.error(err.message);
+          console.error(err);
 
           toast({
             title: _(msg`Something went wrong`),
@@ -324,11 +321,13 @@ export const TeamMemberInviteDialog = ({
                                   </SelectTrigger>
 
                                   <SelectContent position="popper">
-                                    {TEAM_MEMBER_ROLE_HIERARCHY[currentUserTeamRole].map((role) => (
-                                      <SelectItem key={role} value={role}>
-                                        {_(TEAM_MEMBER_ROLE_MAP[role]) ?? role}
-                                      </SelectItem>
-                                    ))}
+                                    {TEAM_MEMBER_ROLE_HIERARCHY[team.currentTeamMember.role].map(
+                                      (role) => (
+                                        <SelectItem key={role} value={role}>
+                                          {_(TEAM_MEMBER_ROLE_MAP[role]) ?? role}
+                                        </SelectItem>
+                                      ),
+                                    )}
                                   </SelectContent>
                                 </Select>
                               </FormControl>

apps/remix/app/components/dialogs/team-transfer-dialog.tsx

@@ -6,6 +6,7 @@ import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import { Loader } from 'lucide-react';
 import { useForm } from 'react-hook-form';
+import { useRevalidator } from 'react-router';
 import { z } from 'zod';
 
 import { IS_BILLING_ENABLED } from '@documenso/lib/constants/app';
@@ -56,6 +57,7 @@ export const TeamTransferDialog = ({
 
   const { _ } = useLingui();
   const { toast } = useToast();
+  const { revalidate } = useRevalidator();
 
   const { mutateAsync: requestTeamOwnershipTransfer } =
     trpc.team.requestTeamOwnershipTransfer.useMutation();
@@ -98,7 +100,7 @@ export const TeamTransferDialog = ({
         clearPaymentMethods,
       });
 
-      // router.refresh(); // Todo
+      await revalidate();
 
       toast({
         title: _(msg`Success`),

apps/remix/app/components/dialogs/template-direct-link-dialog.tsx

@@ -10,7 +10,7 @@ import {
   type TemplateDirectLink,
 } from '@prisma/client';
 import { CircleDotIcon, CircleIcon, ClipboardCopyIcon, InfoIcon, LoaderIcon } from 'lucide-react';
-import { Link } from 'react-router';
+import { Link, useRevalidator } from 'react-router';
 import { P, match } from 'ts-pattern';
 
 import { useLimits } from '@documenso/ee/server-only/limits/provider/client';
@@ -64,6 +64,7 @@ export const TemplateDirectLinkDialog = ({
   const { toast } = useToast();
   const { quota, remaining } = useLimits();
   const { _ } = useLingui();
+  const { revalidate } = useRevalidator();
 
   const [, copy] = useCopyToClipboard();
 
@@ -84,7 +85,9 @@ export const TemplateDirectLinkDialog = ({
     isPending: isCreatingTemplateDirectLink,
     reset: resetCreateTemplateDirectLink,
   } = trpcReact.template.createTemplateDirectLink.useMutation({
-    onSuccess: (data) => {
+    onSuccess: async (data) => {
+      await revalidate();
+
       setToken(data.token);
       setIsEnabled(data.enabled);
       setCurrentStep('MANAGE');
@@ -102,7 +105,9 @@ export const TemplateDirectLinkDialog = ({
 
   const { mutateAsync: toggleTemplateDirectLink, isPending: isTogglingTemplateAccess } =
     trpcReact.template.toggleTemplateDirectLink.useMutation({
-      onSuccess: (data) => {
+      onSuccess: async (data) => {
+        await revalidate();
+
         const enabledDescription = msg`Direct link signing has been enabled`;
         const disabledDescription = msg`Direct link signing has been disabled`;
 
@@ -125,7 +130,9 @@ export const TemplateDirectLinkDialog = ({
 
   const { mutateAsync: deleteTemplateDirectLink, isPending: isDeletingTemplateDirectLink } =
     trpcReact.template.deleteTemplateDirectLink.useMutation({
-      onSuccess: () => {
+      onSuccess: async () => {
+        await revalidate();
+
         onOpenChange(false);
         setToken(null);
 

apps/remix/app/components/forms/2fa/disable-authenticator-app-dialog.tsx

@@ -6,6 +6,7 @@ import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import { flushSync } from 'react-dom';
 import { useForm } from 'react-hook-form';
+import { useRevalidator } from 'react-router';
 import { z } from 'zod';
 
 import { trpc } from '@documenso/trpc/react';
@@ -41,6 +42,7 @@ export type TDisable2FAForm = z.infer<typeof ZDisable2FAForm>;
 export const DisableAuthenticatorAppDialog = () => {
   const { _ } = useLingui();
   const { toast } = useToast();
+  const { revalidate } = useRevalidator();
 
   const [isOpen, setIsOpen] = useState(false);
   const [twoFactorDisableMethod, setTwoFactorDisableMethod] = useState<'totp' | 'backup'>('totp');
@@ -92,8 +94,7 @@ export const DisableAuthenticatorAppDialog = () => {
         onCloseTwoFactorDisableDialog();
       });
 
-      // Todo
-      // router.refresh();
+      await revalidate();
     } catch (_err) {
       toast({
         title: _(msg`Unable to disable two-factor authentication`),

apps/remix/app/components/forms/2fa/enable-authenticator-app-dialog.tsx

@@ -5,6 +5,7 @@ import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import { useForm } from 'react-hook-form';
+import { useRevalidator } from 'react-router';
 import { renderSVG } from 'uqr';
 import { z } from 'zod';
 
@@ -47,6 +48,7 @@ export type EnableAuthenticatorAppDialogProps = {
 export const EnableAuthenticatorAppDialog = ({ onSuccess }: EnableAuthenticatorAppDialogProps) => {
   const { _ } = useLingui();
   const { toast } = useToast();
+  const { revalidate } = useRevalidator();
 
   const [isOpen, setIsOpen] = useState(false);
   const [recoveryCodes, setRecoveryCodes] = useState<string[] | null>(null);
@@ -128,8 +130,7 @@ export const EnableAuthenticatorAppDialog = ({ onSuccess }: EnableAuthenticatorA
 
     if (!isOpen && recoveryCodes && recoveryCodes.length > 0) {
       setRecoveryCodes(null);
-      // Todo
-      // router.refresh();
+      void revalidate();
     }
 
     // eslint-disable-next-line react-hooks/exhaustive-deps

apps/remix/app/components/forms/profile.tsx

@@ -3,6 +3,7 @@ import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import { useForm } from 'react-hook-form';
+import { useRevalidator } from 'react-router';
 import { z } from 'zod';
 
 import { useSession } from '@documenso/lib/client-only/providers/session';
@@ -42,6 +43,7 @@ export const ProfileForm = ({ className }: ProfileFormProps) => {
   const { _ } = useLingui();
   const { toast } = useToast();
   const { user } = useSession();
+  const { revalidate } = useRevalidator();
 
   const form = useForm<TProfileFormSchema>({
     values: {
@@ -68,7 +70,7 @@ export const ProfileForm = ({ className }: ProfileFormProps) => {
         duration: 5000,
       });
 
-      // router.refresh(); // Todo
+      await revalidate();
     } catch (err) {
       toast({
         title: _(msg`An unknown error occurred`),

apps/remix/app/components/forms/signup.tsx

@@ -168,7 +168,6 @@ export const SignUpForm = ({
   };
 
   const onNextClick = async () => {
-    console.log('hello-world');
     const valid = await form.trigger(['name', 'email', 'password', 'signature']);
 
     if (valid) {

apps/remix/app/components/forms/team-update-form.tsx

@@ -73,7 +73,7 @@ export const TeamUpdateForm = ({ teamId, teamName, teamUrl }: UpdateTeamDialogPr
       });
 
       if (url !== teamUrl) {
-        await navigate(`${NEXT_PUBLIC_WEBAPP_URL()}/t/${url}/settings`);
+        await navigate(`/t/${url}/settings`);
       }
     } catch (err) {
       const error = AppError.parseError(err);

apps/remix/app/components/general/document-signing/document-signing-auto-sign.tsx

@@ -1,4 +1,4 @@
-import { useState, useTransition } from 'react';
+import { useState } from 'react';
 
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
@@ -6,6 +6,7 @@ import { Plural, Trans } from '@lingui/react/macro';
 import type { Field, Recipient } from '@prisma/client';
 import { FieldType } from '@prisma/client';
 import { useForm } from 'react-hook-form';
+import { useRevalidator } from 'react-router';
 import { P, match } from 'ts-pattern';
 
 import { unsafe_useEffectOnce } from '@documenso/lib/client-only/hooks/use-effect-once';
@@ -60,12 +61,12 @@ export type DocumentSigningAutoSignProps = {
 export const DocumentSigningAutoSign = ({ recipient, fields }: DocumentSigningAutoSignProps) => {
   const { _ } = useLingui();
   const { toast } = useToast();
+  const { revalidate } = useRevalidator();
 
   const { email, fullName } = useRequiredDocumentSigningContext();
   const { derivedRecipientActionAuth } = useRequiredDocumentSigningAuthContext();
 
   const [open, setOpen] = useState(false);
-  const [isPending, startTransition] = useTransition();
 
   const form = useForm();
 
@@ -153,12 +154,7 @@ export const DocumentSigningAutoSign = ({ recipient, fields }: DocumentSigningAu
       });
     }
 
-    startTransition(() => {
-      // Todo
-      // router.refresh();
-
-      setOpen(false);
-    });
+    await revalidate();
   };
 
   unsafe_useEffectOnce(() => {
@@ -219,7 +215,7 @@ export const DocumentSigningAutoSign = ({ recipient, fields }: DocumentSigningAu
               <Button
                 type="submit"
                 className="min-w-[6rem]"
-                loading={form.formState.isSubmitting || isPending}
+                loading={form.formState.isSubmitting}
                 disabled={!autoSignableFields.length}
               >
                 <Trans>Sign</Trans>

apps/remix/app/components/general/document-signing/document-signing-checkbox-field.tsx

@@ -1,9 +1,10 @@
-import { useEffect, useMemo, useState, useTransition } from 'react';
+import { useEffect, useMemo, useState } from 'react';
 
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import type { Recipient } from '@prisma/client';
 import { Loader } from 'lucide-react';
+import { useRevalidator } from 'react-router';
 
 import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
 import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
@@ -40,8 +41,8 @@ export const DocumentSigningCheckboxField = ({
 }: DocumentSigningCheckboxFieldProps) => {
   const { _ } = useLingui();
   const { toast } = useToast();
+  const { revalidate } = useRevalidator();
 
-  const [isPending, startTransition] = useTransition();
   const { executeActionAuthProcedure } = useRequiredDocumentSigningAuthContext();
 
   const parsedFieldMeta = ZCheckboxFieldMeta.parse(field.fieldMeta);
@@ -84,7 +85,7 @@ export const DocumentSigningCheckboxField = ({
     isPending: isRemoveSignedFieldWithTokenLoading,
   } = trpc.field.removeSignedFieldWithToken.useMutation(DO_NOT_INVALIDATE_QUERY_ON_MUTATION);
 
-  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading || isPending;
+  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading;
   const shouldAutoSignField =
     (!field.inserted && checkedValues.length > 0 && isLengthConditionMet) ||
     (!field.inserted && isReadOnly && isLengthConditionMet);
@@ -105,8 +106,7 @@ export const DocumentSigningCheckboxField = ({
         await signFieldWithToken(payload);
       }
 
-      // Todo
-      // startTransition(() => router.refresh());
+      await revalidate();
     } catch (err) {
       const error = AppError.parseError(err);
 
@@ -141,8 +141,7 @@ export const DocumentSigningCheckboxField = ({
         setCheckedValues([]);
       }
 
-      // Todo
-      // startTransition(() => router.refresh());
+      await revalidate();
     } catch (err) {
       console.error(err);
 
@@ -214,9 +213,7 @@ export const DocumentSigningCheckboxField = ({
       });
     } finally {
       setCheckedValues(updatedValues);
-
-      // Todo
-      // startTransition(() => router.refresh());
+      await revalidate();
     }
   };
 

apps/remix/app/components/general/document-signing/document-signing-date-field.tsx

@@ -1,10 +1,9 @@
-import { useTransition } from 'react';
-
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import type { Recipient } from '@prisma/client';
 import { Loader } from 'lucide-react';
+import { useRevalidator } from 'react-router';
 
 import {
   DEFAULT_DOCUMENT_DATE_FORMAT,
@@ -43,8 +42,7 @@ export const DocumentSigningDateField = ({
 }: DocumentSigningDateFieldProps) => {
   const { _ } = useLingui();
   const { toast } = useToast();
-
-  const [isPending, startTransition] = useTransition();
+  const { revalidate } = useRevalidator();
 
   const { mutateAsync: signFieldWithToken, isPending: isSignFieldWithTokenLoading } =
     trpc.field.signFieldWithToken.useMutation(DO_NOT_INVALIDATE_QUERY_ON_MUTATION);
@@ -54,14 +52,14 @@ export const DocumentSigningDateField = ({
     isPending: isRemoveSignedFieldWithTokenLoading,
   } = trpc.field.removeSignedFieldWithToken.useMutation(DO_NOT_INVALIDATE_QUERY_ON_MUTATION);
 
-  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading || isPending;
+  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading;
 
   const localDateString = convertToLocalSystemFormat(field.customText, dateFormat, timezone);
 
   const isDifferentTime = field.inserted && localDateString !== field.customText;
 
   const tooltipText = _(
-    msg`"${field.customText}" will appear on the document as it has a timezone of "${timezone}".`,
+    msg`"${field.customText}" will appear on the document as it has a timezone of "${timezone || ''}".`,
   );
 
   const onSign = async (authOptions?: TRecipientActionAuth) => {
@@ -80,8 +78,7 @@ export const DocumentSigningDateField = ({
 
       await signFieldWithToken(payload);
 
-      // Todo
-      // startTransition(() => router.refresh());
+      await revalidate();
     } catch (err) {
       const error = AppError.parseError(err);
 
@@ -113,8 +110,7 @@ export const DocumentSigningDateField = ({
 
       await removeSignedFieldWithToken(payload);
 
-      // Todo
-      // startTransition(() => router.refresh());
+      await revalidate();
     } catch (err) {
       console.error(err);
 

apps/remix/app/components/general/document-signing/document-signing-dropdown-field.tsx

@@ -1,9 +1,10 @@
-import { useEffect, useState, useTransition } from 'react';
+import { useEffect, useState } from 'react';
 
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import type { Recipient } from '@prisma/client';
 import { Loader } from 'lucide-react';
+import { useRevalidator } from 'react-router';
 
 import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
 import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
@@ -43,8 +44,7 @@ export const DocumentSigningDropdownField = ({
 }: DocumentSigningDropdownFieldProps) => {
   const { _ } = useLingui();
   const { toast } = useToast();
-
-  const [isPending, startTransition] = useTransition();
+  const { revalidate } = useRevalidator();
 
   const { executeActionAuthProcedure } = useRequiredDocumentSigningAuthContext();
 
@@ -61,7 +61,7 @@ export const DocumentSigningDropdownField = ({
     isPending: isRemoveSignedFieldWithTokenLoading,
   } = trpc.field.removeSignedFieldWithToken.useMutation(DO_NOT_INVALIDATE_QUERY_ON_MUTATION);
 
-  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading || isPending;
+  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading;
   const shouldAutoSignField =
     (!field.inserted && localChoice) || (!field.inserted && isReadOnly && defaultValue);
 
@@ -87,8 +87,7 @@ export const DocumentSigningDropdownField = ({
 
       setLocalChoice('');
 
-      // Todo
-      // startTransition(() => router.refresh());
+      await revalidate();
     } catch (err) {
       const error = AppError.parseError(err);
 
@@ -126,8 +125,7 @@ export const DocumentSigningDropdownField = ({
 
       setLocalChoice('');
 
-      // Todo
-      // startTransition(() => router.refresh());
+      await revalidate();
     } catch (err) {
       console.error(err);
 

apps/remix/app/components/general/document-signing/document-signing-email-field.tsx

@@ -1,10 +1,9 @@
-import { useTransition } from 'react';
-
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import type { Recipient } from '@prisma/client';
 import { Loader } from 'lucide-react';
+import { useRevalidator } from 'react-router';
 
 import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
 import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
@@ -35,11 +34,10 @@ export const DocumentSigningEmailField = ({
 }: DocumentSigningEmailFieldProps) => {
   const { _ } = useLingui();
   const { toast } = useToast();
+  const { revalidate } = useRevalidator();
 
   const { email: providedEmail } = useRequiredDocumentSigningContext();
 
-  const [isPending, startTransition] = useTransition();
-
   const { mutateAsync: signFieldWithToken, isPending: isSignFieldWithTokenLoading } =
     trpc.field.signFieldWithToken.useMutation(DO_NOT_INVALIDATE_QUERY_ON_MUTATION);
 
@@ -48,7 +46,7 @@ export const DocumentSigningEmailField = ({
     isPending: isRemoveSignedFieldWithTokenLoading,
   } = trpc.field.removeSignedFieldWithToken.useMutation(DO_NOT_INVALIDATE_QUERY_ON_MUTATION);
 
-  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading || isPending;
+  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading;
 
   const onSign = async (authOptions?: TRecipientActionAuth) => {
     try {
@@ -69,8 +67,7 @@ export const DocumentSigningEmailField = ({
 
       await signFieldWithToken(payload);
 
-      // Todo
-      // startTransition(() => router.refresh());
+      await revalidate();
     } catch (err) {
       const error = AppError.parseError(err);
 
@@ -102,8 +99,7 @@ export const DocumentSigningEmailField = ({
 
       await removeSignedFieldWithToken(payload);
 
-      // Todo
-      // startTransition(() => router.refresh());
+      await revalidate();
     } catch (err) {
       console.error(err);
 

apps/remix/app/components/general/document-signing/document-signing-form.tsx

@@ -107,7 +107,11 @@ export const DocumentSigningForm = ({
       timestamp: new Date().toISOString(),
     });
 
-    await navigate(redirectUrl ? redirectUrl : `/sign/${recipient.token}/complete`);
+    if (redirectUrl) {
+      window.location.href = redirectUrl;
+    } else {
+      await navigate(`/sign/${recipient.token}/complete`);
+    }
   };
 
   return (

apps/remix/app/components/general/document-signing/document-signing-initials-field.tsx

@@ -1,10 +1,9 @@
-import { useTransition } from 'react';
-
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import type { Recipient } from '@prisma/client';
 import { Loader } from 'lucide-react';
+import { useRevalidator } from 'react-router';
 
 import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
 import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
@@ -36,12 +35,11 @@ export const DocumentSigningInitialsField = ({
 }: DocumentSigningInitialsFieldProps) => {
   const { toast } = useToast();
   const { _ } = useLingui();
+  const { revalidate } = useRevalidator();
 
   const { fullName } = useRequiredDocumentSigningContext();
   const initials = extractInitials(fullName);
 
-  const [isPending, startTransition] = useTransition();
-
   const { mutateAsync: signFieldWithToken, isPending: isSignFieldWithTokenLoading } =
     trpc.field.signFieldWithToken.useMutation(DO_NOT_INVALIDATE_QUERY_ON_MUTATION);
 
@@ -50,7 +48,7 @@ export const DocumentSigningInitialsField = ({
     isPending: isRemoveSignedFieldWithTokenLoading,
   } = trpc.field.removeSignedFieldWithToken.useMutation(DO_NOT_INVALIDATE_QUERY_ON_MUTATION);
 
-  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading || isPending;
+  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading;
 
   const onSign = async (authOptions?: TRecipientActionAuth) => {
     try {
@@ -71,8 +69,7 @@ export const DocumentSigningInitialsField = ({
 
       await signFieldWithToken(payload);
 
-      // Tod
-      // startTransition(() => router.refresh());
+      await revalidate();
     } catch (err) {
       const error = AppError.parseError(err);
 
@@ -104,7 +101,7 @@ export const DocumentSigningInitialsField = ({
 
       await removeSignedFieldWithToken(payload);
 
-      // startTransition(() => router.refresh());
+      await revalidate();
     } catch (err) {
       console.error(err);
 

apps/remix/app/components/general/document-signing/document-signing-name-field.tsx

@@ -1,10 +1,11 @@
-import { useState, useTransition } from 'react';
+import { useState } from 'react';
 
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import { type Recipient } from '@prisma/client';
 import { Loader } from 'lucide-react';
+import { useRevalidator } from 'react-router';
 
 import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
 import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
@@ -40,14 +41,13 @@ export const DocumentSigningNameField = ({
 }: DocumentSigningNameFieldProps) => {
   const { _ } = useLingui();
   const { toast } = useToast();
+  const { revalidate } = useRevalidator();
 
   const { fullName: providedFullName, setFullName: setProvidedFullName } =
     useRequiredDocumentSigningContext();
 
   const { executeActionAuthProcedure } = useRequiredDocumentSigningAuthContext();
 
-  const [isPending, startTransition] = useTransition();
-
   const { mutateAsync: signFieldWithToken, isPending: isSignFieldWithTokenLoading } =
     trpc.field.signFieldWithToken.useMutation(DO_NOT_INVALIDATE_QUERY_ON_MUTATION);
 
@@ -56,7 +56,7 @@ export const DocumentSigningNameField = ({
     isPending: isRemoveSignedFieldWithTokenLoading,
   } = trpc.field.removeSignedFieldWithToken.useMutation(DO_NOT_INVALIDATE_QUERY_ON_MUTATION);
 
-  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading || isPending;
+  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading;
 
   const [showFullNameModal, setShowFullNameModal] = useState(false);
   const [localFullName, setLocalFullName] = useState('');
@@ -107,7 +107,7 @@ export const DocumentSigningNameField = ({
 
       await signFieldWithToken(payload);
 
-      // startTransition(() => router.refresh());
+      await revalidate();
     } catch (err) {
       const error = AppError.parseError(err);
 
@@ -139,7 +139,7 @@ export const DocumentSigningNameField = ({
 
       await removeSignedFieldWithToken(payload);
 
-      // startTransition(() => router.refresh());
+      await revalidate();
     } catch (err) {
       console.error(err);
 

apps/remix/app/components/general/document-signing/document-signing-number-field.tsx

@@ -1,10 +1,11 @@
-import { useEffect, useState, useTransition } from 'react';
+import { useEffect, useState } from 'react';
 
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import type { Recipient } from '@prisma/client';
 import { Hash, Loader } from 'lucide-react';
+import { useRevalidator } from 'react-router';
 
 import { validateNumberField } from '@documenso/lib/advanced-fields-validation/validate-number';
 import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
@@ -49,8 +50,8 @@ export const DocumentSigningNumberField = ({
 }: DocumentSigningNumberFieldProps) => {
   const { _ } = useLingui();
   const { toast } = useToast();
+  const { revalidate } = useRevalidator();
 
-  const [isPending, startTransition] = useTransition();
   const [showRadioModal, setShowRadioModal] = useState(false);
 
   const parsedFieldMeta = field.fieldMeta ? ZNumberFieldMeta.parse(field.fieldMeta) : null;
@@ -80,7 +81,7 @@ export const DocumentSigningNumberField = ({
     isPending: isRemoveSignedFieldWithTokenLoading,
   } = trpc.field.removeSignedFieldWithToken.useMutation(DO_NOT_INVALIDATE_QUERY_ON_MUTATION);
 
-  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading || isPending;
+  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading;
 
   const handleNumberChange = (e: React.ChangeEvent<HTMLInputElement>) => {
     const text = e.target.value;
@@ -136,8 +137,7 @@ export const DocumentSigningNumberField = ({
 
       setLocalNumber('');
 
-      // Todo
-      // startTransition(() => router.refresh());
+      await revalidate();
     } catch (err) {
       const error = AppError.parseError(err);
 
@@ -188,8 +188,7 @@ export const DocumentSigningNumberField = ({
 
       setLocalNumber(parsedFieldMeta?.value ? String(parsedFieldMeta?.value) : '');
 
-      // Todo
-      // startTransition(() => router.refresh());
+      await revalidate();
     } catch (err) {
       console.error(err);
 

apps/remix/app/components/general/document-signing/document-signing-radio-field.tsx

@@ -1,9 +1,10 @@
-import { useEffect, useState, useTransition } from 'react';
+import { useEffect, useState } from 'react';
 
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import type { Recipient } from '@prisma/client';
 import { Loader } from 'lucide-react';
+import { useRevalidator } from 'react-router';
 
 import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
 import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
@@ -37,8 +38,7 @@ export const DocumentSigningRadioField = ({
 }: DocumentSigningRadioFieldProps) => {
   const { _ } = useLingui();
   const { toast } = useToast();
-
-  const [isPending, startTransition] = useTransition();
+  const { revalidate } = useRevalidator();
 
   const parsedFieldMeta = ZRadioFieldMeta.parse(field.fieldMeta);
   const values = parsedFieldMeta.values?.map((item) => ({
@@ -60,7 +60,7 @@ export const DocumentSigningRadioField = ({
     isPending: isRemoveSignedFieldWithTokenLoading,
   } = trpc.field.removeSignedFieldWithToken.useMutation(DO_NOT_INVALIDATE_QUERY_ON_MUTATION);
 
-  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading || isPending;
+  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading;
   const shouldAutoSignField =
     (!field.inserted && selectedOption) ||
     (!field.inserted && defaultValue) ||
@@ -88,8 +88,7 @@ export const DocumentSigningRadioField = ({
 
       setSelectedOption('');
 
-      // Todo
-      // startTransition(() => router.refresh());
+      await revalidate();
     } catch (err) {
       const error = AppError.parseError(err);
 
@@ -122,8 +121,7 @@ export const DocumentSigningRadioField = ({
 
       setSelectedOption('');
 
-      // Todo
-      // startTransition(() => router.refresh());
+      await revalidate();
     } catch (err) {
       console.error(err);
 

apps/remix/app/components/general/document-signing/document-signing-signature-field.tsx

@@ -1,10 +1,11 @@
-import { useLayoutEffect, useMemo, useRef, useState, useTransition } from 'react';
+import { useLayoutEffect, useMemo, useRef, useState } from 'react';
 
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import { type Recipient } from '@prisma/client';
 import { Loader } from 'lucide-react';
+import { useRevalidator } from 'react-router';
 
 import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
 import { AppError, AppErrorCode } from '@documenso/lib/errors/app-error';
@@ -45,6 +46,7 @@ export const DocumentSigningSignatureField = ({
 }: DocumentSigningSignatureFieldProps) => {
   const { _ } = useLingui();
   const { toast } = useToast();
+  const { revalidate } = useRevalidator();
 
   const signatureRef = useRef<HTMLParagraphElement>(null);
   const containerRef = useRef<HTMLDivElement>(null);
@@ -59,8 +61,6 @@ export const DocumentSigningSignatureField = ({
 
   const { executeActionAuthProcedure } = useRequiredDocumentSigningAuthContext();
 
-  const [isPending, startTransition] = useTransition();
-
   const { mutateAsync: signFieldWithToken, isPending: isSignFieldWithTokenLoading } =
     trpc.field.signFieldWithToken.useMutation(DO_NOT_INVALIDATE_QUERY_ON_MUTATION);
 
@@ -71,7 +71,7 @@ export const DocumentSigningSignatureField = ({
 
   const { signature } = field;
 
-  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading || isPending;
+  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading;
 
   const [showSignatureModal, setShowSignatureModal] = useState(false);
   const [localSignature, setLocalSignature] = useState<string | null>(null);
@@ -143,13 +143,11 @@ export const DocumentSigningSignatureField = ({
 
       if (onSignField) {
         await onSignField(payload);
-        return;
+      } else {
+        await signFieldWithToken(payload);
       }
 
-      await signFieldWithToken(payload);
-
-      // Todo
-      // startTransition(() => router.refresh());
+      await revalidate();
     } catch (err) {
       const error = AppError.parseError(err);
 
@@ -177,12 +175,11 @@ export const DocumentSigningSignatureField = ({
       if (onUnsignField) {
         await onUnsignField(payload);
         return;
+      } else {
+        await removeSignedFieldWithToken(payload);
       }
 
-      await removeSignedFieldWithToken(payload);
-
-      // Todo
-      // startTransition(() => router.refresh());
+      await revalidate();
     } catch (err) {
       console.error(err);
 

apps/remix/app/components/general/document-signing/document-signing-text-field.tsx

@@ -1,10 +1,11 @@
-import { useEffect, useState, useTransition } from 'react';
+import { useEffect, useState } from 'react';
 
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Plural, Trans } from '@lingui/react/macro';
 import type { Recipient } from '@prisma/client';
 import { Loader, Type } from 'lucide-react';
+import { useRevalidator } from 'react-router';
 
 import { validateTextField } from '@documenso/lib/advanced-fields-validation/validate-text';
 import { DO_NOT_INVALIDATE_QUERY_ON_MUTATION } from '@documenso/lib/constants/trpc';
@@ -41,6 +42,7 @@ export const DocumentSigningTextField = ({
 }: DocumentSigningTextFieldProps) => {
   const { _ } = useLingui();
   const { toast } = useToast();
+  const { revalidate } = useRevalidator();
 
   const initialErrors: Record<string, string[]> = {
     required: [],
@@ -52,8 +54,6 @@ export const DocumentSigningTextField = ({
 
   const { executeActionAuthProcedure } = useRequiredDocumentSigningAuthContext();
 
-  const [isPending, startTransition] = useTransition();
-
   const { mutateAsync: signFieldWithToken, isPending: isSignFieldWithTokenLoading } =
     trpc.field.signFieldWithToken.useMutation(DO_NOT_INVALIDATE_QUERY_ON_MUTATION);
 
@@ -64,7 +64,7 @@ export const DocumentSigningTextField = ({
 
   const parsedFieldMeta = field.fieldMeta ? ZTextFieldMeta.parse(field.fieldMeta) : null;
 
-  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading || isPending;
+  const isLoading = isSignFieldWithTokenLoading || isRemoveSignedFieldWithTokenLoading;
   const shouldAutoSignField =
     (!field.inserted && parsedFieldMeta?.text) ||
     (!field.inserted && parsedFieldMeta?.text && parsedFieldMeta?.readOnly);
@@ -153,8 +153,7 @@ export const DocumentSigningTextField = ({
 
       setLocalCustomText('');
 
-      // Todo
-      // startTransition(() => router.refresh());
+      await revalidate();
     } catch (err) {
       const error = AppError.parseError(err);
 
@@ -188,8 +187,7 @@ export const DocumentSigningTextField = ({
 
       setLocalCustomText(parsedFieldMeta?.text ?? '');
 
-      // Todo
-      // startTransition(() => router.refresh());
+      await revalidate();
     } catch (err) {
       console.error(err);
 

apps/remix/app/components/general/document/document-search.tsx

@@ -2,7 +2,7 @@ import { useCallback, useEffect, useState } from 'react';
 
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
-import { useNavigate, useSearchParams } from 'react-router';
+import { useSearchParams } from 'react-router';
 
 import { useDebouncedValue } from '@documenso/lib/client-only/hooks/use-debounced-value';
 import { Input } from '@documenso/ui/primitives/input';
@@ -10,8 +10,7 @@ import { Input } from '@documenso/ui/primitives/input';
 export const DocumentSearch = ({ initialValue = '' }: { initialValue?: string }) => {
   const { _ } = useLingui();
 
-  const navigate = useNavigate();
-  const [searchParams] = useSearchParams();
+  const [searchParams, setSearchParams] = useSearchParams();
 
   const [searchTerm, setSearchTerm] = useState(initialValue);
   const debouncedSearchTerm = useDebouncedValue(searchTerm, 500);
@@ -20,12 +19,12 @@ export const DocumentSearch = ({ initialValue = '' }: { initialValue?: string })
     (term: string) => {
       const params = new URLSearchParams(searchParams?.toString() ?? '');
       if (term) {
-        params.set('search', term);
+        params.set('query', term);
       } else {
-        params.delete('search');
+        params.delete('query');
       }
 
-      void navigate(`?${params.toString()}`);
+      setSearchParams(params);
     },
     [searchParams],
   );

apps/remix/app/components/general/teams/team-transfer-status.tsx

@@ -3,6 +3,7 @@ import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import type { TeamMemberRole, TeamTransferVerification } from '@prisma/client';
 import { AnimatePresence } from 'framer-motion';
+import { useRevalidator } from 'react-router';
 
 import { canExecuteTeamAction } from '@documenso/lib/utils/teams';
 import { isTokenExpired } from '@documenso/lib/utils/token-verification';
@@ -28,12 +29,13 @@ export const TeamTransferStatus = ({
 }: TeamTransferStatusProps) => {
   const { _ } = useLingui();
   const { toast } = useToast();
+  const { revalidate } = useRevalidator();
 
   const isExpired = transferVerification && isTokenExpired(transferVerification.expiresAt);
 
   const { mutateAsync: deleteTeamTransferRequest, isPending } =
     trpc.team.deleteTeamTransferRequest.useMutation({
-      onSuccess: () => {
+      onSuccess: async () => {
         if (!isExpired) {
           toast({
             title: _(msg`Success`),
@@ -42,8 +44,7 @@ export const TeamTransferStatus = ({
           });
         }
 
-        // todo?
-        // router.refresh();
+        await revalidate();
       },
       onError: () => {
         toast({

apps/remix/app/components/tables/admin-document-recipient-item-table.tsx

@@ -5,6 +5,7 @@ import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import { type Field, type Recipient, type Signature, SigningStatus } from '@prisma/client';
 import { useForm } from 'react-hook-form';
+import { useRevalidator } from 'react-router';
 import { z } from 'zod';
 
 import { trpc } from '@documenso/trpc/react';
@@ -42,6 +43,7 @@ export type RecipientItemProps = {
 export const AdminDocumentRecipientItemTable = ({ recipient }: RecipientItemProps) => {
   const { _ } = useLingui();
   const { toast } = useToast();
+  const { revalidate } = useRevalidator();
 
   const form = useForm<TAdminUpdateRecipientFormSchema>({
     defaultValues: {
@@ -109,8 +111,7 @@ export const AdminDocumentRecipientItemTable = ({ recipient }: RecipientItemProp
         description: _(msg`The recipient has been updated successfully`),
       });
 
-      // todo
-      // router.refresh();
+      await revalidate();
     } catch (error) {
       toast({
         title: _(msg`Failed to update recipient`),

apps/remix/app/components/tables/user-settings-teams-page-table.tsx

@@ -4,7 +4,6 @@ import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import { Link, useSearchParams } from 'react-router';
-import { useNavigate } from 'react-router';
 import { useLocation } from 'react-router';
 
 import { useDebouncedValue } from '@documenso/lib/client-only/hooks/use-debounced-value';
@@ -18,8 +17,7 @@ import { UserSettingsPendingTeamsDataTable } from './user-settings-pending-teams
 export const UserSettingsTeamsPageDataTable = () => {
   const { _ } = useLingui();
 
-  const [searchParams] = useSearchParams();
-  const navigate = useNavigate();
+  const [searchParams, setSearchParams] = useSearchParams();
   const { pathname } = useLocation();
 
   const [searchQuery, setSearchQuery] = useState(() => searchParams?.get('query') ?? '');
@@ -39,10 +37,6 @@ export const UserSettingsTeamsPageDataTable = () => {
    * Handle debouncing the search query.
    */
   useEffect(() => {
-    if (!pathname) {
-      return;
-    }
-
     const params = new URLSearchParams(searchParams?.toString());
 
     params.set('query', debouncedSearchQuery);
@@ -51,8 +45,8 @@ export const UserSettingsTeamsPageDataTable = () => {
       params.delete('query');
     }
 
-    void navigate(`${pathname}?${params.toString()}`);
-  }, [debouncedSearchQuery, pathname, navigate, searchParams]);
+    setSearchParams(params);
+  }, [debouncedSearchQuery, pathname, searchParams]);
 
   return (
     <div>

apps/remix/app/routes/_authenticated+/admin+/site-settings.tsx

@@ -3,6 +3,7 @@ import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import { useForm } from 'react-hook-form';
+import { useRevalidator } from 'react-router';
 import type { z } from 'zod';
 
 import { getSiteSettings } from '@documenso/lib/server-only/site-settings/get-site-settings';
@@ -47,6 +48,7 @@ export default function AdminBannerPage({ loaderData }: Route.ComponentProps) {
 
   const { toast } = useToast();
   const { _ } = useLingui();
+  const { revalidate } = useRevalidator();
 
   const form = useForm<TBannerFormSchema>({
     resolver: zodResolver(ZBannerFormSchema),
@@ -80,8 +82,7 @@ export default function AdminBannerPage({ loaderData }: Route.ComponentProps) {
         duration: 5000,
       });
 
-      // Todo
-      // router.refresh();
+      await revalidate();
     } catch (err) {
       toast({
         title: _(msg`An unknown error occurred`),

apps/remix/app/routes/_authenticated+/admin+/users.$id.tsx

@@ -3,6 +3,7 @@ import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import { useForm } from 'react-hook-form';
+import { useRevalidator } from 'react-router';
 import type { z } from 'zod';
 
 import { trpc } from '@documenso/trpc/react';
@@ -32,6 +33,7 @@ type TUserFormSchema = z.infer<typeof ZUserFormSchema>;
 export default function UserPage({ params }: { params: { id: number } }) {
   const { _ } = useLingui();
   const { toast } = useToast();
+  const { revalidate } = useRevalidator();
 
   const { data: user } = trpc.profile.getUser.useQuery(
     {
@@ -64,8 +66,7 @@ export default function UserPage({ params }: { params: { id: number } }) {
         roles,
       });
 
-      // Todo
-      // router.refresh();
+      await revalidate();
 
       toast({
         title: _(msg`Profile updated`),

apps/remix/app/routes/_authenticated+/documents+/_index.tsx

@@ -3,8 +3,10 @@ import { useEffect, useMemo, useState } from 'react';
 import { Trans } from '@lingui/react/macro';
 import { useSearchParams } from 'react-router';
 import { Link } from 'react-router';
+import { z } from 'zod';
 
 import { formatAvatarUrl } from '@documenso/lib/utils/avatars';
+import { parseToIntegerArray } from '@documenso/lib/utils/params';
 import { formatDocumentsPath } from '@documenso/lib/utils/teams';
 import { ExtendedDocumentStatus } from '@documenso/prisma/types/extended-document-status';
 import { trpc } from '@documenso/trpc/react';
@@ -33,8 +35,9 @@ const ZSearchParamsSchema = ZFindDocumentsInternalRequestSchema.pick({
   period: true,
   page: true,
   perPage: true,
-  senderIds: true,
   query: true,
+}).extend({
+  senderIds: z.string().transform(parseToIntegerArray).optional().catch([]),
 });
 
 export default function DocumentsPage() {
@@ -59,7 +62,7 @@ export default function DocumentsPage() {
     ...findDocumentSearchParams,
   });
 
-  const getTabHref = (value: typeof status) => {
+  const getTabHref = (value: keyof typeof ExtendedDocumentStatus) => {
     const params = new URLSearchParams(searchParams);
 
     params.set('status', value);

apps/remix/app/routes/_authenticated+/settings+/webhooks+/$id.tsx

@@ -4,7 +4,7 @@ import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import { Loader } from 'lucide-react';
 import { useForm } from 'react-hook-form';
-import { useParams } from 'react-router';
+import { useParams, useRevalidator } from 'react-router';
 import type { z } from 'zod';
 
 import { trpc } from '@documenso/trpc/react';
@@ -36,6 +36,7 @@ export default function WebhookPage() {
 
   const { _ } = useLingui();
   const { toast } = useToast();
+  const { revalidate } = useRevalidator();
 
   const webhookId = params.id || '';
 
@@ -71,8 +72,7 @@ export default function WebhookPage() {
         duration: 5000,
       });
 
-      // Todo
-      // router.refresh();
+      await revalidate();
     } catch (err) {
       toast({
         title: _(msg`Failed to update webhook`),

apps/remix/app/routes/_authenticated+/t.$teamUrl+/settings+/members.tsx

@@ -3,7 +3,7 @@ import { useEffect, useState } from 'react';
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
-import { Link, useLocation, useNavigate, useSearchParams } from 'react-router';
+import { Link, useLocation, useSearchParams } from 'react-router';
 
 import { useDebouncedValue } from '@documenso/lib/client-only/hooks/use-debounced-value';
 import { Input } from '@documenso/ui/primitives/input';
@@ -13,15 +13,11 @@ import { TeamMemberInviteDialog } from '~/components/dialogs/team-member-invite-
 import { SettingsHeader } from '~/components/general/settings-header';
 import { TeamSettingsMemberInvitesTable } from '~/components/tables/team-settings-member-invites-table';
 import { TeamSettingsMembersDataTable } from '~/components/tables/team-settings-members-table';
-import { useCurrentTeam } from '~/providers/team';
 
 export default function TeamsSettingsMembersPage() {
   const { _ } = useLingui();
 
-  const team = useCurrentTeam();
-
-  const [searchParams] = useSearchParams();
-  const navigate = useNavigate();
+  const [searchParams, setSearchParams] = useSearchParams();
   const { pathname } = useLocation();
 
   const [searchQuery, setSearchQuery] = useState(() => searchParams?.get('query') ?? '');
@@ -34,10 +30,6 @@ export default function TeamsSettingsMembersPage() {
    * Handle debouncing the search query.
    */
   useEffect(() => {
-    if (!pathname) {
-      return;
-    }
-
     const params = new URLSearchParams(searchParams?.toString());
 
     params.set('query', debouncedSearchQuery);
@@ -46,8 +38,13 @@ export default function TeamsSettingsMembersPage() {
       params.delete('query');
     }
 
-    void navigate(`${pathname}?${params.toString()}`);
-  }, [debouncedSearchQuery, pathname, navigate, searchParams]);
+    // If nothing  to change then do nothing.
+    if (params.toString() === searchParams?.toString()) {
+      return;
+    }
+
+    setSearchParams(params);
+  }, [debouncedSearchQuery, pathname, searchParams]);
 
   return (
     <div>
@@ -55,10 +52,7 @@ export default function TeamsSettingsMembersPage() {
         title={_(msg`Members`)}
         subtitle={_(msg`Manage the members or invite new members.`)}
       >
-        <TeamMemberInviteDialog
-          teamId={team.id}
-          currentUserTeamRole={team.currentTeamMember.role}
-        />
+        <TeamMemberInviteDialog />
       </SettingsHeader>
 
       <div>

apps/remix/app/routes/_authenticated+/t.$teamUrl+/settings+/webhooks.$id.tsx

@@ -4,6 +4,7 @@ import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
 import { Loader } from 'lucide-react';
 import { useForm } from 'react-hook-form';
+import { useRevalidator } from 'react-router';
 import type { z } from 'zod';
 
 import { trpc } from '@documenso/trpc/react';
@@ -36,6 +37,7 @@ type TEditWebhookFormSchema = z.infer<typeof ZEditWebhookFormSchema>;
 export default function WebhookPage({ params }: Route.ComponentProps) {
   const { _ } = useLingui();
   const { toast } = useToast();
+  const { revalidate } = useRevalidator();
 
   const team = useCurrentTeam();
 
@@ -73,8 +75,7 @@ export default function WebhookPage({ params }: Route.ComponentProps) {
         duration: 5000,
       });
 
-      // Todo
-      // router.refresh();
+      await revalidate();
     } catch (err) {
       toast({
         title: _(msg`Failed to update webhook`),

apps/remix/app/routes/_recipient+/d.$token+/_index.tsx

@@ -48,7 +48,7 @@ export async function loader({ params }: Route.LoaderArgs) {
 
   // Ensure typesafety when we add more options.
   const isAccessAuthValid = match(derivedRecipientAccessAuth)
-    .with(DocumentAccessAuth.ACCOUNT, () => session?.user !== null)
+    .with(DocumentAccessAuth.ACCOUNT, () => Boolean(session?.user))
     .with(null, () => true)
     .exhaustive();
 

apps/remix/app/routes/_recipient+/sign.$token+/complete.tsx

@@ -1,9 +1,11 @@
+import { useEffect } from 'react';
+
 import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
 import { Trans } from '@lingui/react/macro';
-import { DocumentStatus, FieldType, RecipientRole } from '@prisma/client';
+import { type Document, DocumentStatus, FieldType, RecipientRole } from '@prisma/client';
 import { CheckCircle2, Clock8, FileSearch } from 'lucide-react';
-import { Link } from 'react-router';
+import { Link, useRevalidator } from 'react-router';
 import { getOptionalLoaderSession } from 'server/utils/get-loader-session';
 import { match } from 'ts-pattern';
 
@@ -254,35 +256,32 @@ export default function CompletedSigningPage({ loaderData }: Route.ComponentProp
         </div>
       </div>
 
-      {/* Todo */}
-      {/* Todo */}
-      {/* <PollUntilDocumentCompleted document={document} /> */}
+      <PollUntilDocumentCompleted document={document} />
     </div>
   );
 }
 
-// Todo: Refresh on focus? Was in a layout w it before.
-// Todo:
-// export type PollUntilDocumentCompletedProps = {
-//   document: Pick<Document, 'id' | 'status' | 'deletedAt'>;
-// };
+export type PollUntilDocumentCompletedProps = {
+  document: Pick<Document, 'id' | 'status' | 'deletedAt'>;
+};
 
-// export const PollUntilDocumentCompleted = ({ document }: PollUntilDocumentCompletedProps) => {
-//   const router = useRouter();
+export const PollUntilDocumentCompleted = ({ document }: PollUntilDocumentCompletedProps) => {
+  const { revalidate } = useRevalidator();
 
-//   useEffect(() => {
-//     if (document.status === DocumentStatus.COMPLETED) {
-//       return;
-//     }
+  useEffect(() => {
+    if (document.status === DocumentStatus.COMPLETED) {
+      return;
+    }
 
-//     const interval = setInterval(() => {
-//       if (window.document.hasFocus()) {
-//         router.refresh();
-//       }
-//     }, 5000);
+    const interval = setInterval(() => {
+      if (window.document.hasFocus()) {
+        void revalidate();
+      }
+    }, 5000);
 
-//     return () => clearInterval(interval);
-//   }, [router, document.status]);
+    return () => clearInterval(interval);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [document.status]);
 
-//   return <></>;
-// };
+  return <></>;
+};

apps/remix/app/routes/_unauthenticated+/verify-email.$token.tsx

@@ -8,7 +8,7 @@ import { Link, redirect, useNavigate } from 'react-router';
 import { match } from 'ts-pattern';
 
 import { authClient } from '@documenso/auth/client';
-import { EMAIL_VERIFICATION_STATE } from '@documenso/lib/server-only/user/verify-email';
+import { EMAIL_VERIFICATION_STATE } from '@documenso/lib/constants/email';
 import { Button } from '@documenso/ui/primitives/button';
 import { useToast } from '@documenso/ui/primitives/use-toast';
 

apps/remix/package.json

@@ -85,6 +85,7 @@
     "@types/formidable": "^2.0.6",
     "@types/luxon": "^3.3.1",
     "@types/node": "^20",
+    "@types/papaparse": "^5.3.15",
     "@types/react": "^18",
     "@types/react-dom": "^18",
     "@types/ua-parser-js": "^0.7.39",

apps/remix/server/context.ts

@@ -53,7 +53,7 @@ export const appContext = async (c: Context, next: Next) => {
 
     const result = await Promise.all([
       getTeams({ userId: session.user.id }),
-      teamUrl ? getTeamByUrl({ userId: session.user.id, teamUrl }) : null,
+      teamUrl ? getTeamByUrl({ userId: session.user.id, teamUrl }).catch(() => null) : null,
     ]);
 
     teams = result[0];

apps/remix/server/router.ts

@@ -24,8 +24,10 @@ export interface HonoEnv {
 
 const app = new Hono<HonoEnv>();
 
+/**
+ * Attach session and context to requests.
+ */
 app.use(contextStorage());
-
 app.use(appContext);
 
 // App middleware.

apps/remix/vite.config.ts

@@ -37,12 +37,18 @@ export default defineConfig({
   ],
   ssr: {
     noExternal: ['react-dropzone', 'plausible-tracker', 'pdfjs-dist'],
-    external: ['@node-rs/bcrypt', '@prisma/client'],
+    external: ['@node-rs/bcrypt', '@node-rs/bcrypt-wasm32-wasi', '@prisma/client'],
   },
   optimizeDeps: {
     entries: ['./app/**/*', '../../packages/ui/**/*', '../../packages/lib/**/*'],
     include: ['prop-types', 'file-selector', 'attr-accept'],
-    exclude: ['node_modules', '@node-rs/bcrypt', '@documenso/pdf-sign', 'sharp'],
+    exclude: [
+      'node_modules',
+      '@node-rs/bcrypt',
+      '@node-rs/bcrypt-wasm32-wasi',
+      '@documenso/pdf-sign',
+      'sharp',
+    ],
   },
   resolve: {
     alias: {