feat: migrate nextjs to rr7

2025-11-15 17:21:41 +10:00 · 2025-01-02 15:33:37 +11:00
parent 9183f668d3
commit 75d7336763
1021 changed files with 60930 additions and 40839 deletions
--- a/packages/ui/primitives/document-flow/field-items-advanced-settings/checkbox-field.tsx
+++ b/packages/ui/primitives/document-flow/field-items-advanced-settings/checkbox-field.tsx
@ -1,9 +1,8 @@
-'use client';
-
 import { useEffect, useState } from 'react';

-import { Trans, msg } from '@lingui/macro';
+import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
+import { Trans } from '@lingui/react/macro';
 import { ChevronDown, ChevronUp, Trash } from 'lucide-react';

 import { validateCheckboxField } from '@documenso/lib/advanced-fields-validation/validate-checkbox';
@ -126,6 +125,18 @@ export const CheckboxFieldAdvancedSettings = ({

  return (
    <div className="flex flex-col gap-4">
+      <div className="mb-2">
+        <Label>
+          <Trans>Label</Trans>
+        </Label>
+        <Input
+          id="label"
+          className="bg-background mt-2"
+          placeholder={_(msg`Field label`)}
+          value={fieldState.label}
+          onChange={(e) => handleFieldChange('label', e.target.value)}
+        />
+      </div>
      <div className="flex flex-row items-center gap-x-4">
        <div className="flex w-2/3 flex-col">
          <Label>
--- a/packages/ui/primitives/document-flow/field-items-advanced-settings/date-field.tsx
+++ b/packages/ui/primitives/document-flow/field-items-advanced-settings/date-field.tsx
@ -1,10 +1,18 @@
-import { Trans, msg } from '@lingui/macro';
+import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
+import { Trans } from '@lingui/react/macro';

 import { validateFields as validateDateFields } from '@documenso/lib/advanced-fields-validation/validate-fields';
 import { type TDateFieldMeta as DateFieldMeta } from '@documenso/lib/types/field-meta';
 import { Input } from '@documenso/ui/primitives/input';
 import { Label } from '@documenso/ui/primitives/label';
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from '@documenso/ui/primitives/select';

 type DateFieldAdvancedSettingsProps = {
  fieldState: DateFieldMeta;
@ -66,6 +74,27 @@ export const DateFieldAdvancedSettings = ({
          max={96}
        />
      </div>
+
+      <div>
+        <Label>
+          <Trans>Text Align</Trans>
+        </Label>
+
+        <Select
+          value={fieldState.textAlign}
+          onValueChange={(value) => handleInput('textAlign', value)}
+        >
+          <SelectTrigger className="bg-background mt-2">
+            <SelectValue placeholder="Select text align" />
+          </SelectTrigger>
+
+          <SelectContent>
+            <SelectItem value="left">Left</SelectItem>
+            <SelectItem value="center">Center</SelectItem>
+            <SelectItem value="right">Right</SelectItem>
+          </SelectContent>
+        </Select>
+      </div>
    </div>
  );
 };
--- a/packages/ui/primitives/document-flow/field-items-advanced-settings/dropdown-field.tsx
+++ b/packages/ui/primitives/document-flow/field-items-advanced-settings/dropdown-field.tsx
@ -1,9 +1,8 @@
-'use client';
-
 import { useEffect, useState } from 'react';

-import { Trans, msg } from '@lingui/macro';
+import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
+import { Trans } from '@lingui/react/macro';
 import { ChevronDown, ChevronUp, Trash } from 'lucide-react';

 import { validateDropdownField } from '@documenso/lib/advanced-fields-validation/validate-dropdown';
@ -105,8 +104,12 @@ export const DropdownFieldAdvancedSettings = ({
          <Trans>Select default option</Trans>
        </Label>
        <Select
-          defaultValue={defaultValue}
+          value={defaultValue}
          onValueChange={(val) => {
+            if (!val) {
+              return;
+            }
+
            setDefaultValue(val);
            handleFieldChange('defaultValue', val);
          }}
@ -172,7 +175,7 @@ export const DropdownFieldAdvancedSettings = ({
              />
              <button
                type="button"
-                className="col-span-1 mt-auto inline-flex h-10 w-10 items-center  text-slate-500 hover:opacity-80 disabled:cursor-not-allowed disabled:opacity-50"
+                className="col-span-1 mt-auto inline-flex h-10 w-10 items-center text-slate-500 hover:opacity-80 disabled:cursor-not-allowed disabled:opacity-50"
                onClick={() => removeValue(index)}
              >
                <Trash className="h-5 w-5" />
--- a/packages/ui/primitives/document-flow/field-items-advanced-settings/email-field.tsx
+++ b/packages/ui/primitives/document-flow/field-items-advanced-settings/email-field.tsx
@ -1,10 +1,18 @@
-import { Trans, msg } from '@lingui/macro';
+import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
+import { Trans } from '@lingui/react/macro';

 import { validateFields as validateEmailFields } from '@documenso/lib/advanced-fields-validation/validate-fields';
 import { type TEmailFieldMeta as EmailFieldMeta } from '@documenso/lib/types/field-meta';
 import { Input } from '@documenso/ui/primitives/input';
 import { Label } from '@documenso/ui/primitives/label';
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from '@documenso/ui/primitives/select';

 type EmailFieldAdvancedSettingsProps = {
  fieldState: EmailFieldMeta;
@ -48,6 +56,27 @@ export const EmailFieldAdvancedSettings = ({
          max={96}
        />
      </div>
+
+      <div>
+        <Label>
+          <Trans>Text Align</Trans>
+        </Label>
+
+        <Select
+          value={fieldState.textAlign}
+          onValueChange={(value) => handleInput('textAlign', value)}
+        >
+          <SelectTrigger className="bg-background mt-2">
+            <SelectValue placeholder="Select text align" />
+          </SelectTrigger>
+
+          <SelectContent>
+            <SelectItem value="left">Left</SelectItem>
+            <SelectItem value="center">Center</SelectItem>
+            <SelectItem value="right">Right</SelectItem>
+          </SelectContent>
+        </Select>
+      </div>
    </div>
  );
 };
--- a/packages/ui/primitives/document-flow/field-items-advanced-settings/initials-field.tsx
+++ b/packages/ui/primitives/document-flow/field-items-advanced-settings/initials-field.tsx
@ -1,11 +1,14 @@
-import { Trans, msg } from '@lingui/macro';
+import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
+import { Trans } from '@lingui/react/macro';

 import { validateFields as validateInitialsFields } from '@documenso/lib/advanced-fields-validation/validate-fields';
 import { type TInitialsFieldMeta as InitialsFieldMeta } from '@documenso/lib/types/field-meta';
 import { Input } from '@documenso/ui/primitives/input';
 import { Label } from '@documenso/ui/primitives/label';

+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '../../select';
+
 type InitialsFieldAdvancedSettingsProps = {
  fieldState: InitialsFieldMeta;
  handleFieldChange: (key: keyof InitialsFieldMeta, value: string | boolean) => void;
@ -48,6 +51,27 @@ export const InitialsFieldAdvancedSettings = ({
          max={96}
        />
      </div>
+
+      <div>
+        <Label>
+          <Trans>Text Align</Trans>
+        </Label>
+
+        <Select
+          value={fieldState.textAlign}
+          onValueChange={(value) => handleInput('textAlign', value)}
+        >
+          <SelectTrigger className="bg-background mt-2">
+            <SelectValue placeholder="Select text align" />
+          </SelectTrigger>
+
+          <SelectContent>
+            <SelectItem value="left">Left</SelectItem>
+            <SelectItem value="center">Center</SelectItem>
+            <SelectItem value="right">Right</SelectItem>
+          </SelectContent>
+        </Select>
+      </div>
    </div>
  );
 };
--- a/packages/ui/primitives/document-flow/field-items-advanced-settings/name-field.tsx
+++ b/packages/ui/primitives/document-flow/field-items-advanced-settings/name-field.tsx
@ -1,10 +1,18 @@
-import { Trans, msg } from '@lingui/macro';
+import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
+import { Trans } from '@lingui/react/macro';

 import { validateFields as validateNameFields } from '@documenso/lib/advanced-fields-validation/validate-fields';
 import { type TNameFieldMeta as NameFieldMeta } from '@documenso/lib/types/field-meta';
 import { Input } from '@documenso/ui/primitives/input';
 import { Label } from '@documenso/ui/primitives/label';
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from '@documenso/ui/primitives/select';

 type NameFieldAdvancedSettingsProps = {
  fieldState: NameFieldMeta;
@ -48,6 +56,27 @@ export const NameFieldAdvancedSettings = ({
          max={96}
        />
      </div>
+
+      <div>
+        <Label>
+          <Trans>Text Align</Trans>
+        </Label>
+
+        <Select
+          value={fieldState.textAlign}
+          onValueChange={(value) => handleInput('textAlign', value)}
+        >
+          <SelectTrigger className="bg-background mt-2">
+            <SelectValue placeholder="Select text align" />
+          </SelectTrigger>
+
+          <SelectContent>
+            <SelectItem value="left">Left</SelectItem>
+            <SelectItem value="center">Center</SelectItem>
+            <SelectItem value="right">Right</SelectItem>
+          </SelectContent>
+        </Select>
+      </div>
    </div>
  );
 };
--- a/packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx
+++ b/packages/ui/primitives/document-flow/field-items-advanced-settings/number-field.tsx
@ -1,9 +1,8 @@
-'use client';
-
 import { useState } from 'react';

-import { Trans, msg } from '@lingui/macro';
+import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
+import { Trans } from '@lingui/react/macro';
 import { ChevronDown, ChevronUp } from 'lucide-react';

 import { validateNumberField } from '@documenso/lib/advanced-fields-validation/validate-number';
@ -38,12 +37,12 @@ export const NumberFieldAdvancedSettings = ({
  const [showValidation, setShowValidation] = useState(false);

  const handleInput = (field: keyof NumberFieldMeta, value: string | boolean) => {
-    const userValue = field === 'value' ? value : fieldState.value ?? 0;
+    const userValue = field === 'value' ? value : (fieldState.value ?? 0);
    const userMinValue = field === 'minValue' ? Number(value) : Number(fieldState.minValue ?? 0);
    const userMaxValue = field === 'maxValue' ? Number(value) : Number(fieldState.maxValue ?? 0);
    const readOnly = field === 'readOnly' ? Boolean(value) : Boolean(fieldState.readOnly);
    const required = field === 'required' ? Boolean(value) : Boolean(fieldState.required);
-    const numberFormat = field === 'numberFormat' ? String(value) : fieldState.numberFormat ?? '';
+    const numberFormat = field === 'numberFormat' ? String(value) : (fieldState.numberFormat ?? '');
    const fontSize = field === 'fontSize' ? Number(value) : Number(fieldState.fontSize ?? 14);

    const valueErrors = validateNumberField(String(userValue), {
@ -135,6 +134,27 @@ export const NumberFieldAdvancedSettings = ({
        />
      </div>

+      <div>
+        <Label>
+          <Trans>Text Align</Trans>
+        </Label>
+
+        <Select
+          value={fieldState.textAlign}
+          onValueChange={(value) => handleInput('textAlign', value)}
+        >
+          <SelectTrigger className="bg-background mt-2">
+            <SelectValue placeholder="Select text align" />
+          </SelectTrigger>
+
+          <SelectContent>
+            <SelectItem value="left">Left</SelectItem>
+            <SelectItem value="center">Center</SelectItem>
+            <SelectItem value="right">Right</SelectItem>
+          </SelectContent>
+        </Select>
+      </div>
+
      <div className="mt-2 flex flex-col gap-4">
        <div className="flex flex-row items-center gap-2">
          <Switch
--- a/packages/ui/primitives/document-flow/field-items-advanced-settings/radio-field.tsx
+++ b/packages/ui/primitives/document-flow/field-items-advanced-settings/radio-field.tsx
@ -1,8 +1,8 @@
-'use client';
-
 import { useEffect, useState } from 'react';

-import { Trans } from '@lingui/macro';
+import { msg } from '@lingui/core/macro';
+import { useLingui } from '@lingui/react';
+import { Trans } from '@lingui/react/macro';
 import { ChevronDown, ChevronUp, Trash } from 'lucide-react';

 import { validateRadioField } from '@documenso/lib/advanced-fields-validation/validate-radio';
@ -27,6 +27,8 @@ export const RadioFieldAdvancedSettings = ({
  handleFieldChange,
  handleErrors,
 }: RadioFieldAdvancedSettingsProps) => {
+  const { _ } = useLingui();
+
  const [showValidation, setShowValidation] = useState(false);
  const [values, setValues] = useState(
    fieldState.values ?? [{ id: 1, checked: false, value: 'Default value' }],
@ -102,6 +104,18 @@ export const RadioFieldAdvancedSettings = ({
  return (
    <div className="flex flex-col gap-4">
      <div className="flex flex-col gap-4">
+        <div>
+          <Label>
+            <Trans>Label</Trans>
+          </Label>
+          <Input
+            id="label"
+            className="bg-background mt-2"
+            placeholder={_(msg`Field label`)}
+            value={fieldState.label}
+            onChange={(e) => handleFieldChange('label', e.target.value)}
+          />
+        </div>
        <div className="flex flex-row items-center gap-2">
          <Switch
            className="bg-background"
--- a/packages/ui/primitives/document-flow/field-items-advanced-settings/text-field.tsx
+++ b/packages/ui/primitives/document-flow/field-items-advanced-settings/text-field.tsx
@ -1,10 +1,18 @@
-import { Trans, msg } from '@lingui/macro';
+import { msg } from '@lingui/core/macro';
 import { useLingui } from '@lingui/react';
+import { Trans } from '@lingui/react/macro';

 import { validateTextField } from '@documenso/lib/advanced-fields-validation/validate-text';
 import { type TTextFieldMeta as TextFieldMeta } from '@documenso/lib/types/field-meta';
 import { Input } from '@documenso/ui/primitives/input';
 import { Label } from '@documenso/ui/primitives/label';
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue,
+} from '@documenso/ui/primitives/select';
 import { Switch } from '@documenso/ui/primitives/switch';
 import { Textarea } from '@documenso/ui/primitives/textarea';

@ -22,7 +30,7 @@ export const TextFieldAdvancedSettings = ({
  const { _ } = useLingui();

  const handleInput = (field: keyof TextFieldMeta, value: string | boolean) => {
-    const text = field === 'text' ? String(value) : fieldState.text ?? '';
+    const text = field === 'text' ? String(value) : (fieldState.text ?? '');
    const limit =
      field === 'characterLimit' ? Number(value) : Number(fieldState.characterLimit ?? 0);
    const fontSize = field === 'fontSize' ? Number(value) : Number(fieldState.fontSize ?? 14);
@ -112,6 +120,33 @@ export const TextFieldAdvancedSettings = ({
        />
      </div>

+      <div>
+        <Label>
+          <Trans>Text Align</Trans>
+        </Label>
+
+        <Select
+          value={fieldState.textAlign}
+          onValueChange={(value) => {
+            if (!value) {
+              return;
+            }
+
+            handleInput('textAlign', value);
+          }}
+        >
+          <SelectTrigger className="bg-background mt-2">
+            <SelectValue placeholder="Select text align" />
+          </SelectTrigger>
+
+          <SelectContent>
+            <SelectItem value="left">Left</SelectItem>
+            <SelectItem value="center">Center</SelectItem>
+            <SelectItem value="right">Right</SelectItem>
+          </SelectContent>
+        </Select>
+      </div>
+
      <div className="mt-4 flex flex-col gap-4">
        <div className="flex flex-row items-center gap-2">
          <Switch