@greatapps/common 1.1.676 → 1.1.678
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/account/ConfigurationsMyAccountModal.mjs +8 -6
- package/dist/components/account/ConfigurationsMyAccountModal.mjs.map +1 -1
- package/dist/components/account/ConfirmDeleteAccountModal.mjs +20 -19
- package/dist/components/account/ConfirmDeleteAccountModal.mjs.map +1 -1
- package/dist/components/account/ConfirmGlobalPreferencesModal.mjs +10 -11
- package/dist/components/account/ConfirmGlobalPreferencesModal.mjs.map +1 -1
- package/dist/components/account/DeleteAccountModal.mjs +34 -28
- package/dist/components/account/DeleteAccountModal.mjs.map +1 -1
- package/dist/components/account/DisableTwoFactorAuthModal.mjs +7 -5
- package/dist/components/account/DisableTwoFactorAuthModal.mjs.map +1 -1
- package/dist/components/account/IsntPossibleDeleteAccountModal.mjs +8 -9
- package/dist/components/account/IsntPossibleDeleteAccountModal.mjs.map +1 -1
- package/dist/components/account/TwoFactorAuthModal.mjs +22 -23
- package/dist/components/account/TwoFactorAuthModal.mjs.map +1 -1
- package/dist/components/account/constants.mjs +4 -4
- package/dist/components/account/constants.mjs.map +1 -1
- package/dist/components/account/hooks/useChangeEmailForm.mjs +5 -3
- package/dist/components/account/hooks/useChangeEmailForm.mjs.map +1 -1
- package/dist/components/account/hooks/useChangePasswordForm.mjs +26 -3
- package/dist/components/account/hooks/useChangePasswordForm.mjs.map +1 -1
- package/dist/components/account/hooks/useChangePhoneForm.mjs +18 -9
- package/dist/components/account/hooks/useChangePhoneForm.mjs.map +1 -1
- package/dist/components/account/hooks/useDisableTwoFactorAuthForm.mjs +26 -3
- package/dist/components/account/hooks/useDisableTwoFactorAuthForm.mjs.map +1 -1
- package/dist/components/account/hooks/useOtpVerification.mjs +19 -3
- package/dist/components/account/hooks/useOtpVerification.mjs.map +1 -1
- package/dist/components/account/hooks/useTwoFactorAuthForm.mjs +27 -4
- package/dist/components/account/hooks/useTwoFactorAuthForm.mjs.map +1 -1
- package/dist/components/account/sections/ChangeEmailModal.mjs +25 -28
- package/dist/components/account/sections/ChangeEmailModal.mjs.map +1 -1
- package/dist/components/account/sections/ChangePasswordSection.mjs +8 -6
- package/dist/components/account/sections/ChangePasswordSection.mjs.map +1 -1
- package/dist/components/account/sections/ChangePhoneModal.mjs +24 -27
- package/dist/components/account/sections/ChangePhoneModal.mjs.map +1 -1
- package/dist/components/account/sections/MyProfileSection.mjs +37 -22
- package/dist/components/account/sections/MyProfileSection.mjs.map +1 -1
- package/dist/components/account/sections/PreferencesSection.mjs +48 -24
- package/dist/components/account/sections/PreferencesSection.mjs.map +1 -1
- package/dist/components/account/sections/SecuritySection.mjs +11 -9
- package/dist/components/account/sections/SecuritySection.mjs.map +1 -1
- package/dist/components/account/sections/TokenSection.mjs +24 -8
- package/dist/components/account/sections/TokenSection.mjs.map +1 -1
- package/dist/components/layouts/NavBar.mjs +5 -3
- package/dist/components/layouts/NavBar.mjs.map +1 -1
- package/dist/components/layouts/NotificationsPopover.mjs +5 -3
- package/dist/components/layouts/NotificationsPopover.mjs.map +1 -1
- package/dist/components/layouts/ProfilePopover.mjs +6 -4
- package/dist/components/layouts/ProfilePopover.mjs.map +1 -1
- package/dist/components/layouts/UsersSelectorPopover.mjs +9 -7
- package/dist/components/layouts/UsersSelectorPopover.mjs.map +1 -1
- package/dist/components/modals/BuyCreditsModal.mjs +17 -18
- package/dist/components/modals/BuyCreditsModal.mjs.map +1 -1
- package/dist/components/modals/CreditsDisabledModal.mjs +6 -4
- package/dist/components/modals/CreditsDisabledModal.mjs.map +1 -1
- package/dist/components/modals/PaidPlanRequiredModal.mjs +5 -3
- package/dist/components/modals/PaidPlanRequiredModal.mjs.map +1 -1
- package/dist/components/modals/cards/AddCardModal.mjs +64 -46
- package/dist/components/modals/cards/AddCardModal.mjs.map +1 -1
- package/dist/components/modals/cards/CannotDeleteCardModal.mjs +9 -7
- package/dist/components/modals/cards/CannotDeleteCardModal.mjs.map +1 -1
- package/dist/components/modals/cards/CardFormFields.mjs +65 -51
- package/dist/components/modals/cards/CardFormFields.mjs.map +1 -1
- package/dist/components/modals/cards/DeleteCardModal.mjs +10 -8
- package/dist/components/modals/cards/DeleteCardModal.mjs.map +1 -1
- package/dist/components/navigation/CancelledSubscriptionBanner.mjs +4 -2
- package/dist/components/navigation/CancelledSubscriptionBanner.mjs.map +1 -1
- package/dist/components/navigation/OverdueInvoiceBanner.mjs +4 -2
- package/dist/components/navigation/OverdueInvoiceBanner.mjs.map +1 -1
- package/dist/components/navigation/PendingCancellationBanner.mjs +4 -6
- package/dist/components/navigation/PendingCancellationBanner.mjs.map +1 -1
- package/dist/components/navigation/ProjectSelectorPopover.mjs +8 -6
- package/dist/components/navigation/ProjectSelectorPopover.mjs.map +1 -1
- package/dist/components/navigation/UpcomingInvoiceBanner.mjs +4 -6
- package/dist/components/navigation/UpcomingInvoiceBanner.mjs.map +1 -1
- package/dist/components/navigation/subcomponents/BottomLinks.mjs +5 -3
- package/dist/components/navigation/subcomponents/BottomLinks.mjs.map +1 -1
- package/dist/components/navigation/subcomponents/CreditsCard.mjs +3 -1
- package/dist/components/navigation/subcomponents/CreditsCard.mjs.map +1 -1
- package/dist/components/navigation/subcomponents/PlanCard.mjs +3 -1
- package/dist/components/navigation/subcomponents/PlanCard.mjs.map +1 -1
- package/dist/components/navigation/subcomponents/ProjectSelector.mjs +5 -3
- package/dist/components/navigation/subcomponents/ProjectSelector.mjs.map +1 -1
- package/dist/components/pages/NotFoundPage.mjs +5 -3
- package/dist/components/pages/NotFoundPage.mjs.map +1 -1
- package/dist/components/pages/notifications/Notifications.mjs +13 -10
- package/dist/components/pages/notifications/Notifications.mjs.map +1 -1
- package/dist/components/ui/buttons/CopyButton.mjs +9 -5
- package/dist/components/ui/buttons/CopyButton.mjs.map +1 -1
- package/dist/components/ui/data-display/CardItem.mjs +7 -5
- package/dist/components/ui/data-display/CardItem.mjs.map +1 -1
- package/dist/components/ui/data-display/PaymentInfoCard.mjs +10 -8
- package/dist/components/ui/data-display/PaymentInfoCard.mjs.map +1 -1
- package/dist/components/ui/feedback/CircularProgress.mjs.map +1 -1
- package/dist/components/ui/feedback/DefaultCircularProgress.mjs +3 -1
- package/dist/components/ui/feedback/DefaultCircularProgress.mjs.map +1 -1
- package/dist/components/ui/form/ComboboxField.mjs +11 -6
- package/dist/components/ui/form/ComboboxField.mjs.map +1 -1
- package/dist/components/ui/form/DatePicker.mjs +5 -2
- package/dist/components/ui/form/DatePicker.mjs.map +1 -1
- package/dist/components/ui/form/DateRangePicker.mjs +5 -2
- package/dist/components/ui/form/DateRangePicker.mjs.map +1 -1
- package/dist/components/ui/form/PhoneInput.mjs +5 -3
- package/dist/components/ui/form/PhoneInput.mjs.map +1 -1
- package/dist/components/ui/form/SelectField.mjs +6 -3
- package/dist/components/ui/form/SelectField.mjs.map +1 -1
- package/dist/components/widgets/ImageUpload/ImageCropModal.mjs +11 -18
- package/dist/components/widgets/ImageUpload/ImageCropModal.mjs.map +1 -1
- package/dist/components/widgets/ImageUpload/ImageTooSmallModal.mjs +6 -15
- package/dist/components/widgets/ImageUpload/ImageTooSmallModal.mjs.map +1 -1
- package/dist/i18n/config.mjs +13 -0
- package/dist/i18n/config.mjs.map +1 -0
- package/dist/i18n/country-language.mjs +74 -0
- package/dist/i18n/country-language.mjs.map +1 -0
- package/dist/i18n/messages/en-us.mjs +495 -0
- package/dist/i18n/messages/en-us.mjs.map +1 -0
- package/dist/i18n/messages/es-es.mjs +495 -0
- package/dist/i18n/messages/es-es.mjs.map +1 -0
- package/dist/i18n/messages/index.mjs +16 -0
- package/dist/i18n/messages/index.mjs.map +1 -0
- package/dist/i18n/messages/pt-br.mjs +508 -0
- package/dist/i18n/messages/pt-br.mjs.map +1 -0
- package/dist/i18n/normalize.mjs +12 -0
- package/dist/i18n/normalize.mjs.map +1 -0
- package/dist/i18n/resolve-locale.mjs +42 -0
- package/dist/i18n/resolve-locale.mjs.map +1 -0
- package/dist/i18n.mjs +14 -0
- package/dist/i18n.mjs.map +1 -0
- package/dist/index.mjs +19 -3
- package/dist/index.mjs.map +1 -1
- package/dist/modules/accounts/hooks/use-currency-formatter.hook.mjs +20 -0
- package/dist/modules/accounts/hooks/use-currency-formatter.hook.mjs.map +1 -0
- package/dist/modules/cards/hooks/handle-delete-card.hook.mjs +2 -1
- package/dist/modules/cards/hooks/handle-delete-card.hook.mjs.map +1 -1
- package/dist/modules/images/utils/validate-image.mjs +8 -8
- package/dist/modules/images/utils/validate-image.mjs.map +1 -1
- package/dist/modules/plans/handlers/list-plans.handler.mjs +1 -1
- package/dist/modules/plans/handlers/list-plans.handler.mjs.map +1 -1
- package/dist/modules/plans/hooks/list-plans.hook.mjs +2 -2
- package/dist/modules/plans/hooks/list-plans.hook.mjs.map +1 -1
- package/dist/modules/plans/services/plans.service.mjs +1 -1
- package/dist/modules/plans/services/plans.service.mjs.map +1 -1
- package/dist/modules/plans/types/plan.type.mjs +9 -2
- package/dist/modules/plans/types/plan.type.mjs.map +1 -1
- package/dist/modules/plans/utils/map-api-plan-to-ui.mjs +66 -34
- package/dist/modules/plans/utils/map-api-plan-to-ui.mjs.map +1 -1
- package/dist/modules/projects/services/projects.service.mjs +9 -0
- package/dist/modules/projects/services/projects.service.mjs.map +1 -1
- package/dist/modules/subscriptions/utils/periodicity.mjs +20 -14
- package/dist/modules/subscriptions/utils/periodicity.mjs.map +1 -1
- package/dist/providers/auth.provider.mjs +9 -1
- package/dist/providers/auth.provider.mjs.map +1 -1
- package/dist/server.mjs +2 -0
- package/dist/server.mjs.map +1 -1
- package/dist/utils/format/currency.mjs +32 -4
- package/dist/utils/format/currency.mjs.map +1 -1
- package/dist/utils/intl/cookie-domain.mjs +17 -0
- package/dist/utils/intl/cookie-domain.mjs.map +1 -0
- package/dist/utils/intl/locale-cookie.mjs +13 -0
- package/dist/utils/intl/locale-cookie.mjs.map +1 -0
- package/dist/utils/intl/locales.mjs +3 -2
- package/dist/utils/intl/locales.mjs.map +1 -1
- package/package.json +7 -1
- package/src/components/account/ConfigurationsMyAccountModal.tsx +10 -6
- package/src/components/account/ConfirmDeleteAccountModal.tsx +22 -13
- package/src/components/account/ConfirmGlobalPreferencesModal.tsx +12 -10
- package/src/components/account/DeleteAccountModal.tsx +34 -24
- package/src/components/account/DisableTwoFactorAuthModal.tsx +11 -6
- package/src/components/account/IsntPossibleDeleteAccountModal.tsx +8 -6
- package/src/components/account/TwoFactorAuthModal.tsx +33 -29
- package/src/components/account/constants.ts +8 -5
- package/src/components/account/hooks/useChangeEmailForm.tsx +5 -3
- package/src/components/account/hooks/useChangePasswordForm.tsx +20 -6
- package/src/components/account/hooks/useChangePhoneForm.tsx +16 -10
- package/src/components/account/hooks/useDisableTwoFactorAuthForm.tsx +20 -6
- package/src/components/account/hooks/useOtpVerification.tsx +16 -4
- package/src/components/account/hooks/useTwoFactorAuthForm.tsx +21 -7
- package/src/components/account/sections/ChangeEmailModal.tsx +35 -21
- package/src/components/account/sections/ChangePasswordSection.tsx +10 -6
- package/src/components/account/sections/ChangePhoneModal.tsx +50 -22
- package/src/components/account/sections/MyProfileSection.tsx +37 -23
- package/src/components/account/sections/PreferencesSection.tsx +52 -25
- package/src/components/account/sections/SecuritySection.tsx +19 -10
- package/src/components/account/sections/TokenSection.tsx +22 -10
- package/src/components/layouts/NavBar.tsx +5 -3
- package/src/components/layouts/NotificationsPopover.tsx +5 -3
- package/src/components/layouts/ProfilePopover.tsx +6 -4
- package/src/components/layouts/UsersSelectorPopover.tsx +9 -7
- package/src/components/modals/BuyCreditsModal.tsx +18 -16
- package/src/components/modals/CreditsDisabledModal.tsx +6 -6
- package/src/components/modals/PaidPlanRequiredModal.tsx +5 -3
- package/src/components/modals/cards/AddCardModal.tsx +89 -62
- package/src/components/modals/cards/CannotDeleteCardModal.tsx +9 -8
- package/src/components/modals/cards/CardFormFields.tsx +93 -75
- package/src/components/modals/cards/DeleteCardModal.tsx +10 -8
- package/src/components/navigation/CancelledSubscriptionBanner.tsx +4 -2
- package/src/components/navigation/OverdueInvoiceBanner.tsx +4 -2
- package/src/components/navigation/PendingCancellationBanner.tsx +4 -2
- package/src/components/navigation/ProjectSelectorPopover.tsx +8 -6
- package/src/components/navigation/UpcomingInvoiceBanner.tsx +4 -2
- package/src/components/navigation/subcomponents/BottomLinks.tsx +5 -3
- package/src/components/navigation/subcomponents/CreditsCard.tsx +3 -1
- package/src/components/navigation/subcomponents/PlanCard.tsx +3 -1
- package/src/components/navigation/subcomponents/ProjectSelector.tsx +5 -3
- package/src/components/pages/NotFoundPage.tsx +5 -3
- package/src/components/pages/notifications/Notifications.tsx +13 -10
- package/src/components/ui/buttons/CopyButton.tsx +10 -5
- package/src/components/ui/data-display/CardItem.tsx +7 -5
- package/src/components/ui/data-display/PaymentInfoCard.tsx +10 -8
- package/src/components/ui/feedback/CircularProgress.tsx +4 -0
- package/src/components/ui/feedback/DefaultCircularProgress.tsx +3 -1
- package/src/components/ui/form/ComboboxField.tsx +11 -6
- package/src/components/ui/form/DatePicker.tsx +5 -2
- package/src/components/ui/form/DateRangePicker.tsx +5 -2
- package/src/components/ui/form/PhoneInput.tsx +5 -3
- package/src/components/ui/form/SelectField.tsx +6 -3
- package/src/components/widgets/ImageUpload/ImageCropModal.tsx +19 -11
- package/src/components/widgets/ImageUpload/ImageTooSmallModal.tsx +6 -5
- package/src/i18n/config.ts +17 -0
- package/src/i18n/country-language.ts +60 -0
- package/src/i18n/messages/en-us.ts +515 -0
- package/src/i18n/messages/es-es.ts +516 -0
- package/src/i18n/messages/index.ts +24 -0
- package/src/i18n/messages/pt-br.ts +539 -0
- package/src/i18n/normalize.ts +15 -0
- package/src/i18n/resolve-locale.ts +77 -0
- package/src/i18n.ts +10 -0
- package/src/index.ts +13 -2
- package/src/modules/accounts/hooks/use-currency-formatter.hook.tsx +32 -0
- package/src/modules/cards/hooks/handle-delete-card.hook.ts +8 -3
- package/src/modules/images/utils/validate-image.ts +23 -8
- package/src/modules/plans/handlers/list-plans.handler.ts +1 -1
- package/src/modules/plans/hooks/list-plans.hook.ts +2 -2
- package/src/modules/plans/services/plans.service.ts +1 -1
- package/src/modules/plans/types/plan.type.ts +9 -1
- package/src/modules/plans/utils/map-api-plan-to-ui.ts +115 -46
- package/src/modules/projects/services/projects.service.ts +12 -0
- package/src/modules/subscriptions/utils/periodicity.ts +29 -12
- package/src/providers/auth.provider.tsx +13 -1
- package/src/server.ts +2 -0
- package/src/utils/format/currency.ts +62 -7
- package/src/utils/intl/cookie-domain.ts +29 -0
- package/src/utils/intl/locale-cookie.ts +18 -0
- package/src/utils/intl/locales.ts +3 -2
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { IconAlertTriangle, IconBrandGoogleFilled } from "@tabler/icons-react";
|
|
4
|
+
import { useTranslations } from "next-intl";
|
|
4
5
|
import { toast } from "sonner";
|
|
5
6
|
import { useQueryClient } from "@tanstack/react-query";
|
|
6
7
|
import { useAuth } from "../../../providers/auth.provider";
|
|
@@ -10,6 +11,7 @@ import { Toast } from "../../ui/feedback/Toast";
|
|
|
10
11
|
function SecuritySection({
|
|
11
12
|
onDeleteAccount
|
|
12
13
|
}) {
|
|
14
|
+
const translate = useTranslations();
|
|
13
15
|
const { user } = useAuth();
|
|
14
16
|
const queryClient = useQueryClient();
|
|
15
17
|
const { mutateAsync: unlinkGoogle, isPending: isUnlinking } = useUnlinkGoogle();
|
|
@@ -20,17 +22,17 @@ function SecuritySection({
|
|
|
20
22
|
toast.custom((t) => /* @__PURE__ */ jsx(Toast, { variant: "success", message: result.message, toastId: t }));
|
|
21
23
|
queryClient.invalidateQueries({ queryKey: USER_QUERY_KEY });
|
|
22
24
|
} catch (error) {
|
|
23
|
-
const message = error instanceof Error ? error.message : "
|
|
24
|
-
toast.custom((
|
|
25
|
+
const message = error instanceof Error ? error.message : translate("common.account.security.unlinkError");
|
|
26
|
+
toast.custom((toastId) => /* @__PURE__ */ jsx(Toast, { variant: "error", message, toastId }));
|
|
25
27
|
}
|
|
26
28
|
};
|
|
27
29
|
return /* @__PURE__ */ jsxs("div", { className: "h-full overflow-y-auto overscroll-contain px-4 pb-20 lg:p-5 lg:pt-5 flex flex-col gap-5 lg:gap-6 lg:pb-31 lg:overscroll-auto", children: [
|
|
28
|
-
/* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-950 hidden lg:block", children: "
|
|
30
|
+
/* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-950 hidden lg:block", children: translate("common.account.security.title") }),
|
|
29
31
|
hasGoogleLinked && /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center lg:items-start gap-4", children: [
|
|
30
32
|
/* @__PURE__ */ jsx("div", { className: "size-10 rounded-lg bg-blue-50 flex items-center justify-center", children: /* @__PURE__ */ jsx(IconBrandGoogleFilled, { size: 20, className: "text-blue-500" }) }),
|
|
31
33
|
/* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
|
|
32
|
-
/* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-950", children: "
|
|
33
|
-
/* @__PURE__ */ jsx("span", { className: "paragraph-small-regular text-gray-600", children:
|
|
34
|
+
/* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-950", children: translate("common.account.security.googleLinkedTitle") }),
|
|
35
|
+
/* @__PURE__ */ jsx("span", { className: "paragraph-small-regular text-gray-600", children: translate("common.account.security.googleLinkedDescription") })
|
|
34
36
|
] }),
|
|
35
37
|
/* @__PURE__ */ jsx(
|
|
36
38
|
"button",
|
|
@@ -39,15 +41,15 @@ function SecuritySection({
|
|
|
39
41
|
disabled: isUnlinking,
|
|
40
42
|
className: "paragraph-small-semibold text-zinc-700 bg-zinc-100 rounded-lg px-3 py-2 cursor-pointer hover:bg-zinc-200 transition-colors w-fit disabled:opacity-50 disabled:cursor-not-allowed",
|
|
41
43
|
onClick: handleUnlinkGoogle,
|
|
42
|
-
children: isUnlinking ? "
|
|
44
|
+
children: isUnlinking ? translate("common.account.security.unlinking") : translate("common.account.security.unlinkGoogle")
|
|
43
45
|
}
|
|
44
46
|
)
|
|
45
47
|
] }),
|
|
46
48
|
/* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center lg:items-start gap-4", children: [
|
|
47
49
|
/* @__PURE__ */ jsx("div", { className: "size-10 rounded-lg bg-red-50 flex items-center justify-center", children: /* @__PURE__ */ jsx(IconAlertTriangle, { size: 20, className: "text-red-500" }) }),
|
|
48
50
|
/* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-2", children: [
|
|
49
|
-
/* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-950", children: "
|
|
50
|
-
/* @__PURE__ */ jsx("span", { className: "paragraph-small-regular text-gray-600", children: "
|
|
51
|
+
/* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-950", children: translate("common.account.deleteAccount.title") }),
|
|
52
|
+
/* @__PURE__ */ jsx("span", { className: "paragraph-small-regular text-gray-600", children: translate("common.account.security.deleteAccountDescription") })
|
|
51
53
|
] }),
|
|
52
54
|
onDeleteAccount && /* @__PURE__ */ jsx(
|
|
53
55
|
"button",
|
|
@@ -55,7 +57,7 @@ function SecuritySection({
|
|
|
55
57
|
type: "button",
|
|
56
58
|
className: "paragraph-small-semibold text-red-600 bg-red-50 rounded-lg px-3 py-2 cursor-pointer hover:bg-red-100 transition-colors w-fit",
|
|
57
59
|
onClick: onDeleteAccount,
|
|
58
|
-
children: "
|
|
60
|
+
children: translate("common.account.security.deleteMyAccount")
|
|
59
61
|
}
|
|
60
62
|
)
|
|
61
63
|
] })
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/account/sections/SecuritySection.tsx"],"sourcesContent":["'use client';\n\nimport { IconAlertTriangle, IconBrandGoogleFilled } from '@tabler/icons-react';\nimport { toast } from 'sonner';\nimport { useQueryClient } from '@tanstack/react-query';\nimport { useAuth } from '../../../providers/auth.provider';\nimport { AccountSectionType } from '../../../enums/AccountSectionType';\nimport { useUnlinkGoogle } from '../../../modules/auth/hooks/unlink-google.hook';\nimport { USER_QUERY_KEY } from '../../../modules/auth/hooks/useUserQuery';\nimport { Toast } from '../../ui/feedback/Toast';\n\ninterface SecuritySectionProps {\n setActiveSection: (section: AccountSectionType) => void;\n onClose: () => void;\n onDeleteAccount?: () => void;\n}\n\nexport function SecuritySection({\n onDeleteAccount,\n}: SecuritySectionProps) {\n const { user } = useAuth();\n const queryClient = useQueryClient();\n const { mutateAsync: unlinkGoogle, isPending: isUnlinking } = useUnlinkGoogle();\n const hasGoogleLinked = !!user?.google_sub;\n\n const handleUnlinkGoogle = async () => {\n try {\n const result = await unlinkGoogle();\n toast.custom((t) => (\n <Toast variant=\"success\" message={result.message} toastId={t} />\n ));\n queryClient.invalidateQueries({ queryKey: USER_QUERY_KEY });\n } catch (error) {\n const message =\n error instanceof Error ? error.message : '
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/account/sections/SecuritySection.tsx"],"sourcesContent":["'use client';\n\nimport { IconAlertTriangle, IconBrandGoogleFilled } from '@tabler/icons-react';\nimport { useTranslations } from 'next-intl';\nimport { toast } from 'sonner';\nimport { useQueryClient } from '@tanstack/react-query';\nimport { useAuth } from '../../../providers/auth.provider';\nimport { AccountSectionType } from '../../../enums/AccountSectionType';\nimport { useUnlinkGoogle } from '../../../modules/auth/hooks/unlink-google.hook';\nimport { USER_QUERY_KEY } from '../../../modules/auth/hooks/useUserQuery';\nimport { Toast } from '../../ui/feedback/Toast';\n\ninterface SecuritySectionProps {\n setActiveSection: (section: AccountSectionType) => void;\n onClose: () => void;\n onDeleteAccount?: () => void;\n}\n\nexport function SecuritySection({\n onDeleteAccount,\n}: SecuritySectionProps) {\n const translate = useTranslations();\n const { user } = useAuth();\n const queryClient = useQueryClient();\n const { mutateAsync: unlinkGoogle, isPending: isUnlinking } = useUnlinkGoogle();\n const hasGoogleLinked = !!user?.google_sub;\n\n const handleUnlinkGoogle = async () => {\n try {\n const result = await unlinkGoogle();\n toast.custom((t) => (\n <Toast variant=\"success\" message={result.message} toastId={t} />\n ));\n queryClient.invalidateQueries({ queryKey: USER_QUERY_KEY });\n } catch (error) {\n const message =\n error instanceof Error ? error.message : translate('common.account.security.unlinkError');\n toast.custom((toastId) => <Toast variant=\"error\" message={message} toastId={toastId} />);\n }\n };\n\n return (\n <div className=\"h-full overflow-y-auto overscroll-contain px-4 pb-20 lg:p-5 lg:pt-5 flex flex-col gap-5 lg:gap-6 lg:pb-31 lg:overscroll-auto\">\n <span className=\"paragraph-medium-semibold text-gray-950 hidden lg:block\">\n {translate('common.account.security.title')}\n </span>\n\n {hasGoogleLinked && (\n <div className=\"flex flex-col items-center lg:items-start gap-4\">\n <div className=\"size-10 rounded-lg bg-blue-50 flex items-center justify-center\">\n <IconBrandGoogleFilled size={20} className=\"text-blue-500\" />\n </div>\n\n <div className=\"flex flex-col gap-2\">\n <span className=\"paragraph-medium-semibold text-gray-950\">\n {translate('common.account.security.googleLinkedTitle')}\n </span>\n <span className=\"paragraph-small-regular text-gray-600\">\n {translate('common.account.security.googleLinkedDescription')}\n </span>\n </div>\n\n <button\n type=\"button\"\n disabled={isUnlinking}\n className=\"paragraph-small-semibold text-zinc-700 bg-zinc-100 rounded-lg px-3 py-2 cursor-pointer hover:bg-zinc-200 transition-colors w-fit disabled:opacity-50 disabled:cursor-not-allowed\"\n onClick={handleUnlinkGoogle}\n >\n {isUnlinking\n ? translate('common.account.security.unlinking')\n : translate('common.account.security.unlinkGoogle')}\n </button>\n </div>\n )}\n\n <div className=\"flex flex-col items-center lg:items-start gap-4\">\n <div className=\"size-10 rounded-lg bg-red-50 flex items-center justify-center\">\n <IconAlertTriangle size={20} className=\"text-red-500\" />\n </div>\n\n <div className=\"flex flex-col gap-2\">\n <span className=\"paragraph-medium-semibold text-gray-950\">\n {translate('common.account.deleteAccount.title')}\n </span>\n <span className=\"paragraph-small-regular text-gray-600\">\n {translate('common.account.security.deleteAccountDescription')}\n </span>\n </div>\n\n {onDeleteAccount && (\n <button\n type=\"button\"\n className=\"paragraph-small-semibold text-red-600 bg-red-50 rounded-lg px-3 py-2 cursor-pointer hover:bg-red-100 transition-colors w-fit\"\n onClick={onDeleteAccount}\n >\n {translate('common.account.security.deleteMyAccount')}\n </button>\n )}\n </div>\n </div>\n );\n}\n"],"mappings":";AA+BQ,cAsBE,YAtBF;AA7BR,SAAS,mBAAmB,6BAA6B;AACzD,SAAS,uBAAuB;AAChC,SAAS,aAAa;AACtB,SAAS,sBAAsB;AAC/B,SAAS,eAAe;AAExB,SAAS,uBAAuB;AAChC,SAAS,sBAAsB;AAC/B,SAAS,aAAa;AAQf,SAAS,gBAAgB;AAAA,EAC9B;AACF,GAAyB;AACvB,QAAM,YAAY,gBAAgB;AAClC,QAAM,EAAE,KAAK,IAAI,QAAQ;AACzB,QAAM,cAAc,eAAe;AACnC,QAAM,EAAE,aAAa,cAAc,WAAW,YAAY,IAAI,gBAAgB;AAC9E,QAAM,kBAAkB,CAAC,CAAC,MAAM;AAEhC,QAAM,qBAAqB,YAAY;AACrC,QAAI;AACF,YAAM,SAAS,MAAM,aAAa;AAClC,YAAM,OAAO,CAAC,MACZ,oBAAC,SAAM,SAAQ,WAAU,SAAS,OAAO,SAAS,SAAS,GAAG,CAC/D;AACD,kBAAY,kBAAkB,EAAE,UAAU,eAAe,CAAC;AAAA,IAC5D,SAAS,OAAO;AACd,YAAM,UACJ,iBAAiB,QAAQ,MAAM,UAAU,UAAU,qCAAqC;AAC1F,YAAM,OAAO,CAAC,YAAY,oBAAC,SAAM,SAAQ,SAAQ,SAAkB,SAAkB,CAAE;AAAA,IACzF;AAAA,EACF;AAEA,SACE,qBAAC,SAAI,WAAU,gIACb;AAAA,wBAAC,UAAK,WAAU,2DACb,oBAAU,+BAA+B,GAC5C;AAAA,IAEC,mBACC,qBAAC,SAAI,WAAU,mDACb;AAAA,0BAAC,SAAI,WAAU,kEACb,8BAAC,yBAAsB,MAAM,IAAI,WAAU,iBAAgB,GAC7D;AAAA,MAEA,qBAAC,SAAI,WAAU,uBACb;AAAA,4BAAC,UAAK,WAAU,2CACb,oBAAU,2CAA2C,GACxD;AAAA,QACA,oBAAC,UAAK,WAAU,yCACb,oBAAU,iDAAiD,GAC9D;AAAA,SACF;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,UAAU;AAAA,UACV,WAAU;AAAA,UACV,SAAS;AAAA,UAER,wBACG,UAAU,mCAAmC,IAC7C,UAAU,sCAAsC;AAAA;AAAA,MACtD;AAAA,OACF;AAAA,IAGF,qBAAC,SAAI,WAAU,mDACb;AAAA,0BAAC,SAAI,WAAU,iEACb,8BAAC,qBAAkB,MAAM,IAAI,WAAU,gBAAe,GACxD;AAAA,MAEA,qBAAC,SAAI,WAAU,uBACb;AAAA,4BAAC,UAAK,WAAU,2CACb,oBAAU,oCAAoC,GACjD;AAAA,QACA,oBAAC,UAAK,WAAU,yCACb,oBAAU,kDAAkD,GAC/D;AAAA,SACF;AAAA,MAEC,mBACC;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,WAAU;AAAA,UACV,SAAS;AAAA,UAER,oBAAU,yCAAyC;AAAA;AAAA,MACtD;AAAA,OAEJ;AAAA,KACF;AAEJ;","names":[]}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { IconCheck, IconCopy, IconInfoCircle } from "@tabler/icons-react";
|
|
4
|
+
import { useTranslations } from "next-intl";
|
|
4
5
|
import { toast } from "sonner";
|
|
5
6
|
import { Toast } from "../../ui/feedback/Toast";
|
|
6
7
|
import { Button } from "../../ui/buttons/Button";
|
|
@@ -9,25 +10,40 @@ import useCopyToClipboard from "../../../hooks/copy-to-clipboard.hook";
|
|
|
9
10
|
import { useAccountToken } from "../../../modules/accounts/hooks/use-account-token.hook";
|
|
10
11
|
import { useIsDefaultWhitelabel } from "../../../providers/whitelabel.provider";
|
|
11
12
|
function TokenSection() {
|
|
13
|
+
const translate = useTranslations();
|
|
12
14
|
const { data: token = "", isLoading } = useAccountToken();
|
|
13
15
|
const isDefaultWl = useIsDefaultWhitelabel();
|
|
14
16
|
const { isCopied, copy } = useCopyToClipboard({
|
|
15
17
|
onSuccess: () => {
|
|
16
|
-
toast.custom((
|
|
18
|
+
toast.custom((toastId) => /* @__PURE__ */ jsx(
|
|
19
|
+
Toast,
|
|
20
|
+
{
|
|
21
|
+
variant: "success",
|
|
22
|
+
message: translate("common.account.token.copySuccess"),
|
|
23
|
+
toastId
|
|
24
|
+
}
|
|
25
|
+
));
|
|
17
26
|
},
|
|
18
27
|
onError: () => {
|
|
19
|
-
toast.custom((
|
|
28
|
+
toast.custom((toastId) => /* @__PURE__ */ jsx(
|
|
29
|
+
Toast,
|
|
30
|
+
{
|
|
31
|
+
variant: "error",
|
|
32
|
+
message: translate("common.account.token.copyError"),
|
|
33
|
+
toastId
|
|
34
|
+
}
|
|
35
|
+
));
|
|
20
36
|
}
|
|
21
37
|
});
|
|
22
38
|
return /* @__PURE__ */ jsxs("div", { className: "h-full overflow-y-auto overscroll-contain px-4 pb-20 lg:p-5 lg:pt-5 flex flex-col gap-5 lg:gap-6 lg:pb-31 lg:overscroll-auto", children: [
|
|
23
|
-
/* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-950", children: "
|
|
39
|
+
/* @__PURE__ */ jsx("span", { className: "paragraph-medium-semibold text-gray-950", children: translate("common.account.token.title") }),
|
|
24
40
|
/* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-3", children: [
|
|
25
41
|
/* @__PURE__ */ jsxs("div", { className: "flex items-end gap-3", children: [
|
|
26
42
|
/* @__PURE__ */ jsx(
|
|
27
43
|
FormField,
|
|
28
44
|
{
|
|
29
|
-
label: "
|
|
30
|
-
value: isLoading ? "
|
|
45
|
+
label: translate("common.account.token.label"),
|
|
46
|
+
value: isLoading ? translate("common.actions.loading") : token,
|
|
31
47
|
disabled: true,
|
|
32
48
|
readOnly: true,
|
|
33
49
|
classnameContainer: "bg-gray-50 cursor-default opacity-100!",
|
|
@@ -44,14 +60,14 @@ function TokenSection() {
|
|
|
44
60
|
disabled: isLoading || !token,
|
|
45
61
|
children: [
|
|
46
62
|
isCopied ? /* @__PURE__ */ jsx(IconCheck, { size: 16 }) : /* @__PURE__ */ jsx(IconCopy, { size: 16 }),
|
|
47
|
-
isCopied ? "
|
|
63
|
+
isCopied ? translate("common.actions.copied") : translate("common.actions.copy")
|
|
48
64
|
]
|
|
49
65
|
}
|
|
50
66
|
)
|
|
51
67
|
] }),
|
|
52
68
|
/* @__PURE__ */ jsxs("div", { className: `flex items-center gap-3 p-4 rounded-lg ${isDefaultWl ? "bg-cyan-50" : "bg-zinc-50"}`, children: [
|
|
53
69
|
/* @__PURE__ */ jsx(IconInfoCircle, { className: "size-4 text-zinc-950 shrink-0" }),
|
|
54
|
-
/* @__PURE__ */ jsx("span", { className: "paragraph-small-regular text-zinc-950 max-w-[420px]", children: "
|
|
70
|
+
/* @__PURE__ */ jsx("span", { className: "paragraph-small-regular text-zinc-950 max-w-[420px]", children: translate("common.account.token.info") })
|
|
55
71
|
] }),
|
|
56
72
|
/* @__PURE__ */ jsx(
|
|
57
73
|
"a",
|
|
@@ -60,7 +76,7 @@ function TokenSection() {
|
|
|
60
76
|
target: "_blank",
|
|
61
77
|
rel: "noopener noreferrer",
|
|
62
78
|
className: "paragraph-small-medium text-gray-500 underline hover:text-gray-700 transition-colors w-fit",
|
|
63
|
-
children: "
|
|
79
|
+
children: translate("common.account.token.docsLink")
|
|
64
80
|
}
|
|
65
81
|
)
|
|
66
82
|
] })
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/account/sections/TokenSection.tsx"],"sourcesContent":["'use client';\n\nimport { IconCheck, IconCopy, IconInfoCircle } from '@tabler/icons-react';\nimport { toast } from 'sonner';\nimport { Toast } from '../../ui/feedback/Toast';\nimport { Button } from '../../ui/buttons/Button';\nimport { FormField } from '../../ui/form/FormField';\nimport useCopyToClipboard from '../../../hooks/copy-to-clipboard.hook';\nimport { useAccountToken } from '../../../modules/accounts/hooks/use-account-token.hook';\nimport { useIsDefaultWhitelabel } from '../../../providers/whitelabel.provider';\n\nexport function TokenSection() {\n const { data: token = '', isLoading } = useAccountToken();\n const isDefaultWl = useIsDefaultWhitelabel();\n\n const { isCopied, copy } = useCopyToClipboard({\n onSuccess: () => {\n toast.custom((
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/account/sections/TokenSection.tsx"],"sourcesContent":["'use client';\n\nimport { IconCheck, IconCopy, IconInfoCircle } from '@tabler/icons-react';\nimport { useTranslations } from 'next-intl';\nimport { toast } from 'sonner';\nimport { Toast } from '../../ui/feedback/Toast';\nimport { Button } from '../../ui/buttons/Button';\nimport { FormField } from '../../ui/form/FormField';\nimport useCopyToClipboard from '../../../hooks/copy-to-clipboard.hook';\nimport { useAccountToken } from '../../../modules/accounts/hooks/use-account-token.hook';\nimport { useIsDefaultWhitelabel } from '../../../providers/whitelabel.provider';\n\nexport function TokenSection() {\n const translate = useTranslations();\n const { data: token = '', isLoading } = useAccountToken();\n const isDefaultWl = useIsDefaultWhitelabel();\n\n const { isCopied, copy } = useCopyToClipboard({\n onSuccess: () => {\n toast.custom((toastId) => (\n <Toast\n variant=\"success\"\n message={translate('common.account.token.copySuccess')}\n toastId={toastId}\n />\n ));\n },\n onError: () => {\n toast.custom((toastId) => (\n <Toast\n variant=\"error\"\n message={translate('common.account.token.copyError')}\n toastId={toastId}\n />\n ));\n },\n });\n\n return (\n <div className=\"h-full overflow-y-auto overscroll-contain px-4 pb-20 lg:p-5 lg:pt-5 flex flex-col gap-5 lg:gap-6 lg:pb-31 lg:overscroll-auto\">\n <span className=\"paragraph-medium-semibold text-gray-950\">\n {translate('common.account.token.title')}\n </span>\n\n <div className=\"flex flex-col gap-3\">\n <div className=\"flex items-end gap-3\">\n <FormField\n label={translate('common.account.token.label')}\n value={isLoading ? translate('common.actions.loading') : token}\n disabled\n readOnly\n classnameContainer=\"bg-gray-50 cursor-default opacity-100!\"\n className=\"text-gray-950/50\"\n />\n <Button\n type=\"button\"\n variant=\"secondary\"\n className=\"h-10! shrink-0 gap-2\"\n onClick={() => copy(token)}\n disabled={isLoading || !token}\n >\n {isCopied ? <IconCheck size={16} /> : <IconCopy size={16} />}\n {isCopied ? translate('common.actions.copied') : translate('common.actions.copy')}\n </Button>\n </div>\n\n <div className={`flex items-center gap-3 p-4 rounded-lg ${isDefaultWl ? 'bg-cyan-50' : 'bg-zinc-50'}`}>\n <IconInfoCircle className=\"size-4 text-zinc-950 shrink-0\" />\n <span className=\"paragraph-small-regular text-zinc-950 max-w-[420px]\">\n {translate('common.account.token.info')}\n </span>\n </div>\n\n <a\n href=\"https://documenter.getpostman.com/view/4861938/T1Djiz8H\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"paragraph-small-medium text-gray-500 underline hover:text-gray-700 transition-colors w-fit\"\n >\n {translate('common.account.token.docsLink')}\n </a>\n </div>\n </div>\n );\n}\n"],"mappings":";AAoBQ,cAkCE,YAlCF;AAlBR,SAAS,WAAW,UAAU,sBAAsB;AACpD,SAAS,uBAAuB;AAChC,SAAS,aAAa;AACtB,SAAS,aAAa;AACtB,SAAS,cAAc;AACvB,SAAS,iBAAiB;AAC1B,OAAO,wBAAwB;AAC/B,SAAS,uBAAuB;AAChC,SAAS,8BAA8B;AAEhC,SAAS,eAAe;AAC7B,QAAM,YAAY,gBAAgB;AAClC,QAAM,EAAE,MAAM,QAAQ,IAAI,UAAU,IAAI,gBAAgB;AACxD,QAAM,cAAc,uBAAuB;AAE3C,QAAM,EAAE,UAAU,KAAK,IAAI,mBAAmB;AAAA,IAC5C,WAAW,MAAM;AACf,YAAM,OAAO,CAAC,YACZ;AAAA,QAAC;AAAA;AAAA,UACC,SAAQ;AAAA,UACR,SAAS,UAAU,kCAAkC;AAAA,UACrD;AAAA;AAAA,MACF,CACD;AAAA,IACH;AAAA,IACA,SAAS,MAAM;AACb,YAAM,OAAO,CAAC,YACZ;AAAA,QAAC;AAAA;AAAA,UACC,SAAQ;AAAA,UACR,SAAS,UAAU,gCAAgC;AAAA,UACnD;AAAA;AAAA,MACF,CACD;AAAA,IACH;AAAA,EACF,CAAC;AAED,SACE,qBAAC,SAAI,WAAU,gIACb;AAAA,wBAAC,UAAK,WAAU,2CACb,oBAAU,4BAA4B,GACzC;AAAA,IAEA,qBAAC,SAAI,WAAU,uBACb;AAAA,2BAAC,SAAI,WAAU,wBACb;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,OAAO,UAAU,4BAA4B;AAAA,YAC7C,OAAO,YAAY,UAAU,wBAAwB,IAAI;AAAA,YACzD,UAAQ;AAAA,YACR,UAAQ;AAAA,YACR,oBAAmB;AAAA,YACnB,WAAU;AAAA;AAAA,QACZ;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,SAAQ;AAAA,YACR,WAAU;AAAA,YACV,SAAS,MAAM,KAAK,KAAK;AAAA,YACzB,UAAU,aAAa,CAAC;AAAA,YAEvB;AAAA,yBAAW,oBAAC,aAAU,MAAM,IAAI,IAAK,oBAAC,YAAS,MAAM,IAAI;AAAA,cACzD,WAAW,UAAU,uBAAuB,IAAI,UAAU,qBAAqB;AAAA;AAAA;AAAA,QAClF;AAAA,SACF;AAAA,MAEA,qBAAC,SAAI,WAAW,0CAA0C,cAAc,eAAe,YAAY,IACjG;AAAA,4BAAC,kBAAe,WAAU,iCAAgC;AAAA,QAC1D,oBAAC,UAAK,WAAU,uDACb,oBAAU,2BAA2B,GACxC;AAAA,SACF;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,QAAO;AAAA,UACP,KAAI;AAAA,UACJ,WAAU;AAAA,UAET,oBAAU,+BAA+B;AAAA;AAAA,MAC5C;AAAA,OACF;AAAA,KACF;AAEJ;","names":[]}
|
|
@@ -2,6 +2,7 @@
|
|
|
2
2
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
3
|
import Image from "next/image";
|
|
4
4
|
import Link from "next/link";
|
|
5
|
+
import { useTranslations } from "next-intl";
|
|
5
6
|
import { IconChevronRight } from "@tabler/icons-react";
|
|
6
7
|
import { Separator } from "../ui/data-display/Separator";
|
|
7
8
|
import { Tooltip, TooltipContent, TooltipTrigger } from "../ui/overlay/Tooltip";
|
|
@@ -23,6 +24,7 @@ function NavBar({
|
|
|
23
24
|
children,
|
|
24
25
|
className
|
|
25
26
|
}) {
|
|
27
|
+
const translate = useTranslations();
|
|
26
28
|
const { isExpanded: isDesktopExpanded, toggle: toggleDesktop } = useDesktopSidebarStore();
|
|
27
29
|
useDesktopSidebarHydration();
|
|
28
30
|
const { whitelabel } = useWhitelabel();
|
|
@@ -113,7 +115,7 @@ function NavBar({
|
|
|
113
115
|
children: /* @__PURE__ */ jsx(IconChevronRight, { size: 16, className: "text-gray-500" })
|
|
114
116
|
}
|
|
115
117
|
) }),
|
|
116
|
-
/* @__PURE__ */ jsx(TooltipContent, { side: "right", children: "
|
|
118
|
+
/* @__PURE__ */ jsx(TooltipContent, { side: "right", children: translate("common.layout.navbar.expandMenu") })
|
|
117
119
|
] }),
|
|
118
120
|
!isDesktopExpanded && /* @__PURE__ */ jsxs(Tooltip, { children: [
|
|
119
121
|
/* @__PURE__ */ jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsx(
|
|
@@ -124,7 +126,7 @@ function NavBar({
|
|
|
124
126
|
children: /* @__PURE__ */ jsx(IconChevronRight, { size: 16, className: "text-gray-500" })
|
|
125
127
|
}
|
|
126
128
|
) }),
|
|
127
|
-
/* @__PURE__ */ jsx(TooltipContent, { side: "right", children: "
|
|
129
|
+
/* @__PURE__ */ jsx(TooltipContent, { side: "right", children: translate("common.layout.navbar.expandMenu") })
|
|
128
130
|
] })
|
|
129
131
|
] }),
|
|
130
132
|
/* @__PURE__ */ jsxs("div", { className: "relative", children: [
|
|
@@ -171,7 +173,7 @@ function NavBar({
|
|
|
171
173
|
)
|
|
172
174
|
}
|
|
173
175
|
) }),
|
|
174
|
-
/* @__PURE__ */ jsx(TooltipContent, { side: "right", children: isDefaultWl ? "
|
|
176
|
+
/* @__PURE__ */ jsx(TooltipContent, { side: "right", children: isDefaultWl ? translate("common.layout.navbar.greatPages") : translate("common.layout.navbar.pages") })
|
|
175
177
|
] }),
|
|
176
178
|
/* @__PURE__ */ jsx(
|
|
177
179
|
"div",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/layouts/NavBar.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport Image from \"next/image\";\nimport Link from \"next/link\";\nimport { IconChevronRight } from \"@tabler/icons-react\";\nimport { Separator } from \"../ui/data-display/Separator\";\nimport { Tooltip, TooltipContent, TooltipTrigger } from \"../ui/overlay/Tooltip\";\nimport {\n useDesktopSidebarStore,\n useDesktopSidebarHydration,\n} from \"../../store/useDesktopSidebarStore\";\nimport {\n useWhitelabel,\n useIsDefaultWhitelabel,\n} from \"../../providers/whitelabel.provider\";\nimport { cn } from \"../../infra/utils/clsx\";\n\ntype NavBarProps = {\n logoHref: string;\n appIconHref: string;\n activeApp?: \"gapps\" | \"gpages\";\n showExpandButton?: boolean;\n onExpandClick?: () => void;\n children?: React.ReactNode;\n className?: string;\n};\n\nfunction NavBar({\n logoHref,\n appIconHref,\n activeApp,\n showExpandButton = false,\n onExpandClick,\n children,\n className,\n}: NavBarProps) {\n const { isExpanded: isDesktopExpanded, toggle: toggleDesktop } =\n useDesktopSidebarStore();\n useDesktopSidebarHydration();\n const { whitelabel } = useWhitelabel();\n const isDefaultWl = useIsDefaultWhitelabel();\n const primaryColor = whitelabel?.general?.primary_color;\n const wlName = whitelabel?.name || \"Great\";\n\n const wlIcon = whitelabel?.secondary_logo ? (\n <Image\n className=\"size-7 object-contain\"\n src={`${process.env.NEXT_PUBLIC_STORAGE_URL}/${whitelabel.secondary_logo}`}\n alt={`${wlName} Logo`}\n width={28}\n height={28}\n />\n ) : (\n <div\n className={cn(\n \"size-10 rounded-lg flex items-center justify-center transition-opacity duration-300\",\n activeApp !== \"gapps\" && \"opacity-20\",\n )}\n style={{ backgroundColor: primaryColor }}\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"white\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <path d=\"M4 5a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1l0 -4\" />\n <path d=\"M14 5a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1l0 -4\" />\n <path d=\"M4 15a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1l0 -4\" />\n <path d=\"M14 15a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1l0 -4\" />\n </svg>\n </div>\n );\n\n return (\n <div\n className={cn(\n \"hidden md:flex flex-col justify-between h-screen p-4 border-r border-gray-200 overflow-visible z-40 bg-white\",\n className,\n )}\n >\n <div className=\"flex flex-col gap-4 items-center mt-[6.5px]\">\n {/* GreatApps logo */}\n <div className=\"relative\">\n <Tooltip>\n <TooltipTrigger className=\"cursor-pointer\" asChild>\n <Link href={logoHref}>\n {isDefaultWl ? (\n <Image\n src=\"/icons/great-icon.svg\"\n alt=\"Great Icon\"\n width={28}\n height={28}\n />\n ) : (\n wlIcon\n )}\n </Link>\n </TooltipTrigger>\n <TooltipContent side=\"right\">{wlName}</TooltipContent>\n </Tooltip>\n <div\n className={cn(\n \"absolute -left-[22px] top-1/2 -translate-y-1/2 z-10 w-[3px] h-5 rounded-r-xl transition-opacity duration-300\",\n isDefaultWl ? \"bg-gray-950\" : \"\",\n activeApp === \"gapps\" ? \"opacity-100\" : \"opacity-0\",\n )}\n style={!isDefaultWl ? { backgroundColor: primaryColor } : undefined}\n />\n </div>\n\n <div className=\"relative w-full mt-[7.5px]\">\n <Separator />\n {/* Md expand button */}\n {showExpandButton && (\n <Tooltip>\n <TooltipTrigger asChild>\n <button\n onClick={onExpandClick}\n className=\"hidden md:flex lg:hidden absolute top-1/2 -translate-y-1/2 right-0 translate-x-[calc(50%+1rem)] size-8 items-center justify-center rounded-full border border-gray-200 bg-white hover:bg-gray-100 cursor-pointer transition-colors z-10\"\n >\n <IconChevronRight size={16} className=\"text-gray-500\" />\n </button>\n </TooltipTrigger>\n <TooltipContent side=\"right\">Expandir menu</TooltipContent>\n </Tooltip>\n )}\n {/* Desktop expand button */}\n {!isDesktopExpanded && (\n <Tooltip>\n <TooltipTrigger asChild>\n <button\n onClick={toggleDesktop}\n className=\"hidden lg:flex absolute top-1/2 -translate-y-1/2 right-0 translate-x-[calc(50%+1rem)] size-8 items-center justify-center rounded-full border border-gray-200 bg-white hover:bg-gray-100 cursor-pointer transition-colors z-10\"\n >\n <IconChevronRight size={16} className=\"text-gray-500\" />\n </button>\n </TooltipTrigger>\n <TooltipContent side=\"right\">Expandir menu</TooltipContent>\n </Tooltip>\n )}\n </div>\n\n {/* GreatPages icon */}\n <div className=\"relative\">\n <Tooltip>\n <TooltipTrigger asChild>\n <Link\n href={appIconHref}\n className={cn(\n \"size-10 rounded-lg cursor-pointer flex items-center justify-center border-2 ring-2 transition-colors duration-300\",\n activeApp === \"gpages\"\n ? isDefaultWl\n ? \"bg-cyan-100 border-white ring-cyan-300\"\n : \"border-white ring-transparent\"\n : isDefaultWl\n ? \"hover:bg-gray-100 border-transparent ring-transparent\"\n : \"border-transparent ring-transparent\",\n )}\n style={\n !isDefaultWl\n ? {\n backgroundColor: primaryColor,\n boxShadow:\n activeApp === \"gpages\"\n ? `0 0 0 2px ${primaryColor}40`\n : undefined,\n opacity: activeApp !== \"gpages\" ? 0.2 : undefined,\n }\n : undefined\n }\n >\n {isDefaultWl ? (\n <Image\n src=\"/icons/icon-navbar.svg\"\n alt=\"GreatPages\"\n width={24}\n height={24}\n />\n ) : (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"white\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <path d=\"M4 8h16\" />\n <path d=\"M4 6a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2l0 -12\" />\n <path d=\"M8 4v4\" />\n </svg>\n )}\n </Link>\n </TooltipTrigger>\n <TooltipContent side=\"right\">\n {isDefaultWl ? \"GreatPages\" : \"Páginas\"}\n </TooltipContent>\n </Tooltip>\n <div\n className={cn(\n \"absolute -left-4 top-1/2 -translate-y-1/2 z-10 w-[3px] h-5 rounded-r-xl transition-opacity duration-300\",\n isDefaultWl ? \"bg-cyan-300\" : \"\",\n activeApp === \"gpages\" ? \"opacity-100\" : \"opacity-0\",\n )}\n style={!isDefaultWl ? { backgroundColor: primaryColor } : undefined}\n />\n </div>\n </div>\n\n <div className=\"flex flex-col items-center gap-2\">{children}</div>\n </div>\n );\n}\n\nexport { NavBar };\nexport type { NavBarProps };\n"],"mappings":"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","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/layouts/NavBar.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport Image from \"next/image\";\nimport Link from \"next/link\";\nimport { useTranslations } from \"next-intl\";\nimport { IconChevronRight } from \"@tabler/icons-react\";\nimport { Separator } from \"../ui/data-display/Separator\";\nimport { Tooltip, TooltipContent, TooltipTrigger } from \"../ui/overlay/Tooltip\";\nimport {\n useDesktopSidebarStore,\n useDesktopSidebarHydration,\n} from \"../../store/useDesktopSidebarStore\";\nimport {\n useWhitelabel,\n useIsDefaultWhitelabel,\n} from \"../../providers/whitelabel.provider\";\nimport { cn } from \"../../infra/utils/clsx\";\n\ntype NavBarProps = {\n logoHref: string;\n appIconHref: string;\n activeApp?: \"gapps\" | \"gpages\";\n showExpandButton?: boolean;\n onExpandClick?: () => void;\n children?: React.ReactNode;\n className?: string;\n};\n\nfunction NavBar({\n logoHref,\n appIconHref,\n activeApp,\n showExpandButton = false,\n onExpandClick,\n children,\n className,\n}: NavBarProps) {\n const translate = useTranslations();\n const { isExpanded: isDesktopExpanded, toggle: toggleDesktop } =\n useDesktopSidebarStore();\n useDesktopSidebarHydration();\n const { whitelabel } = useWhitelabel();\n const isDefaultWl = useIsDefaultWhitelabel();\n const primaryColor = whitelabel?.general?.primary_color;\n const wlName = whitelabel?.name || \"Great\";\n\n const wlIcon = whitelabel?.secondary_logo ? (\n <Image\n className=\"size-7 object-contain\"\n src={`${process.env.NEXT_PUBLIC_STORAGE_URL}/${whitelabel.secondary_logo}`}\n alt={`${wlName} Logo`}\n width={28}\n height={28}\n />\n ) : (\n <div\n className={cn(\n \"size-10 rounded-lg flex items-center justify-center transition-opacity duration-300\",\n activeApp !== \"gapps\" && \"opacity-20\",\n )}\n style={{ backgroundColor: primaryColor }}\n >\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"white\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <path d=\"M4 5a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1l0 -4\" />\n <path d=\"M14 5a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1l0 -4\" />\n <path d=\"M4 15a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1l0 -4\" />\n <path d=\"M14 15a1 1 0 0 1 1 -1h4a1 1 0 0 1 1 1v4a1 1 0 0 1 -1 1h-4a1 1 0 0 1 -1 -1l0 -4\" />\n </svg>\n </div>\n );\n\n return (\n <div\n className={cn(\n \"hidden md:flex flex-col justify-between h-screen p-4 border-r border-gray-200 overflow-visible z-40 bg-white\",\n className,\n )}\n >\n <div className=\"flex flex-col gap-4 items-center mt-[6.5px]\">\n {/* GreatApps logo */}\n <div className=\"relative\">\n <Tooltip>\n <TooltipTrigger className=\"cursor-pointer\" asChild>\n <Link href={logoHref}>\n {isDefaultWl ? (\n <Image\n src=\"/icons/great-icon.svg\"\n alt=\"Great Icon\"\n width={28}\n height={28}\n />\n ) : (\n wlIcon\n )}\n </Link>\n </TooltipTrigger>\n <TooltipContent side=\"right\">{wlName}</TooltipContent>\n </Tooltip>\n <div\n className={cn(\n \"absolute -left-[22px] top-1/2 -translate-y-1/2 z-10 w-[3px] h-5 rounded-r-xl transition-opacity duration-300\",\n isDefaultWl ? \"bg-gray-950\" : \"\",\n activeApp === \"gapps\" ? \"opacity-100\" : \"opacity-0\",\n )}\n style={!isDefaultWl ? { backgroundColor: primaryColor } : undefined}\n />\n </div>\n\n <div className=\"relative w-full mt-[7.5px]\">\n <Separator />\n {/* Md expand button */}\n {showExpandButton && (\n <Tooltip>\n <TooltipTrigger asChild>\n <button\n onClick={onExpandClick}\n className=\"hidden md:flex lg:hidden absolute top-1/2 -translate-y-1/2 right-0 translate-x-[calc(50%+1rem)] size-8 items-center justify-center rounded-full border border-gray-200 bg-white hover:bg-gray-100 cursor-pointer transition-colors z-10\"\n >\n <IconChevronRight size={16} className=\"text-gray-500\" />\n </button>\n </TooltipTrigger>\n <TooltipContent side=\"right\">{translate('common.layout.navbar.expandMenu')}</TooltipContent>\n </Tooltip>\n )}\n {/* Desktop expand button */}\n {!isDesktopExpanded && (\n <Tooltip>\n <TooltipTrigger asChild>\n <button\n onClick={toggleDesktop}\n className=\"hidden lg:flex absolute top-1/2 -translate-y-1/2 right-0 translate-x-[calc(50%+1rem)] size-8 items-center justify-center rounded-full border border-gray-200 bg-white hover:bg-gray-100 cursor-pointer transition-colors z-10\"\n >\n <IconChevronRight size={16} className=\"text-gray-500\" />\n </button>\n </TooltipTrigger>\n <TooltipContent side=\"right\">{translate('common.layout.navbar.expandMenu')}</TooltipContent>\n </Tooltip>\n )}\n </div>\n\n {/* GreatPages icon */}\n <div className=\"relative\">\n <Tooltip>\n <TooltipTrigger asChild>\n <Link\n href={appIconHref}\n className={cn(\n \"size-10 rounded-lg cursor-pointer flex items-center justify-center border-2 ring-2 transition-colors duration-300\",\n activeApp === \"gpages\"\n ? isDefaultWl\n ? \"bg-cyan-100 border-white ring-cyan-300\"\n : \"border-white ring-transparent\"\n : isDefaultWl\n ? \"hover:bg-gray-100 border-transparent ring-transparent\"\n : \"border-transparent ring-transparent\",\n )}\n style={\n !isDefaultWl\n ? {\n backgroundColor: primaryColor,\n boxShadow:\n activeApp === \"gpages\"\n ? `0 0 0 2px ${primaryColor}40`\n : undefined,\n opacity: activeApp !== \"gpages\" ? 0.2 : undefined,\n }\n : undefined\n }\n >\n {isDefaultWl ? (\n <Image\n src=\"/icons/icon-navbar.svg\"\n alt=\"GreatPages\"\n width={24}\n height={24}\n />\n ) : (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n stroke=\"white\"\n strokeWidth=\"2\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n >\n <path d=\"M4 8h16\" />\n <path d=\"M4 6a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2l0 -12\" />\n <path d=\"M8 4v4\" />\n </svg>\n )}\n </Link>\n </TooltipTrigger>\n <TooltipContent side=\"right\">\n {isDefaultWl ? translate('common.layout.navbar.greatPages') : translate('common.layout.navbar.pages')}\n </TooltipContent>\n </Tooltip>\n <div\n className={cn(\n \"absolute -left-4 top-1/2 -translate-y-1/2 z-10 w-[3px] h-5 rounded-r-xl transition-opacity duration-300\",\n isDefaultWl ? \"bg-cyan-300\" : \"\",\n activeApp === \"gpages\" ? \"opacity-100\" : \"opacity-0\",\n )}\n style={!isDefaultWl ? { backgroundColor: primaryColor } : undefined}\n />\n </div>\n </div>\n\n <div className=\"flex flex-col items-center gap-2\">{children}</div>\n </div>\n );\n}\n\nexport { NavBar };\nexport type { NavBarProps };\n"],"mappings":"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","names":[]}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { useState } from "react";
|
|
4
|
+
import { useTranslations } from "next-intl";
|
|
4
5
|
import { IconBell } from "@tabler/icons-react";
|
|
5
6
|
import * as PopoverPrimitive from "@radix-ui/react-popover";
|
|
6
7
|
import { Popover } from "../ui/overlay/Popover";
|
|
@@ -18,6 +19,7 @@ function NotificationsPopover({
|
|
|
18
19
|
contentClassName,
|
|
19
20
|
badgeClassName
|
|
20
21
|
}) {
|
|
22
|
+
const translate = useTranslations();
|
|
21
23
|
const isDefaultWl = useIsDefaultWhitelabel();
|
|
22
24
|
const resolvedBadgeClassName = badgeClassName ?? (isDefaultWl ? "bg-cyan-300" : "bg-zinc-300");
|
|
23
25
|
const [open, setOpen] = useState(false);
|
|
@@ -61,7 +63,7 @@ function NotificationsPopover({
|
|
|
61
63
|
align,
|
|
62
64
|
sideOffset: 8,
|
|
63
65
|
children: [
|
|
64
|
-
/* @__PURE__ */ jsx("span", { className: "paragraph-small-semibold text-gray-950 px-4", children: "
|
|
66
|
+
/* @__PURE__ */ jsx("span", { className: "paragraph-small-semibold text-gray-950 px-4", children: translate("common.notifications.popover.title") }),
|
|
65
67
|
messages.length > 0 ? messages.map((message, index) => /* @__PURE__ */ jsx(
|
|
66
68
|
NotificationCard,
|
|
67
69
|
{
|
|
@@ -78,7 +80,7 @@ function NotificationsPopover({
|
|
|
78
80
|
message.id
|
|
79
81
|
)) : /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-4 pt-[41.5px] pb-[33.5px]", children: [
|
|
80
82
|
/* @__PURE__ */ jsx("div", { className: "bg-gray-50 rounded-md p-2.5", children: /* @__PURE__ */ jsx(IconBell, { size: 20, color: "var(--color-gray-950)" }) }),
|
|
81
|
-
/* @__PURE__ */ jsx("span", { className: "paragraph-small-medium text-gray-950", children: "
|
|
83
|
+
/* @__PURE__ */ jsx("span", { className: "paragraph-small-medium text-gray-950", children: translate("common.notifications.popover.empty") })
|
|
82
84
|
] }),
|
|
83
85
|
onViewAll && /* @__PURE__ */ jsx(
|
|
84
86
|
Button,
|
|
@@ -86,7 +88,7 @@ function NotificationsPopover({
|
|
|
86
88
|
variant: "secondary",
|
|
87
89
|
className: "h-8! mt-2 mb-4 mx-4 paragraph-small-semibold",
|
|
88
90
|
onClick: onViewAll,
|
|
89
|
-
children: "
|
|
91
|
+
children: translate("common.notifications.popover.viewAll")
|
|
90
92
|
}
|
|
91
93
|
)
|
|
92
94
|
]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/layouts/NotificationsPopover.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport { IconBell } from '@tabler/icons-react';\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport { Popover } from \"../ui/overlay/Popover\";\nimport { Button } from \"../ui/buttons/Button\";\nimport NotificationCard from \"../widgets/notifications/NotificationCard\";\nimport { cn } from \"../../infra/utils/clsx\";\nimport { useMessages, useMarkAllMessagesAsRead } from \"../../modules/users/hooks/messages.hook\";\nimport { useIsDefaultWhitelabel } from \"../../providers/whitelabel.provider\";\nimport { formatDistanceToNow } from \"date-fns\";\nimport { ptBR } from \"date-fns/locale\";\n\nexport interface NotificationsPopoverProps {\n onViewAll?: () => void;\n side?: \"top\" | \"bottom\" | \"left\" | \"right\";\n align?: \"start\" | \"center\" | \"end\";\n contentClassName?: string;\n badgeClassName?: string;\n}\n\nfunction NotificationsPopover({\n onViewAll,\n side,\n align,\n contentClassName,\n badgeClassName,\n}: NotificationsPopoverProps) {\n const isDefaultWl = useIsDefaultWhitelabel();\n const resolvedBadgeClassName = badgeClassName ?? (isDefaultWl ? \"bg-cyan-300\" : \"bg-zinc-300\");\n const [open, setOpen] = useState(false);\n const { data: messagesData } = useMessages({ type: 'notification', readed: true, limit: 5 });\n const { mutate: markAllAsRead } = useMarkAllMessagesAsRead();\n\n const messages = messagesData?.data ?? [];\n const totalUnread = messagesData?.totalUnread ?? 0;\n\n const handleOpenChange = (isOpen: boolean) => {\n setOpen(isOpen);\n if (isOpen && totalUnread > 0) {\n markAllAsRead();\n }\n };\n\n return (\n <Popover open={open} onOpenChange={handleOpenChange}>\n <PopoverPrimitive.Trigger className=\"cursor-pointer\">\n <div\n className={`relative rounded-full p-2.5 ${open ? \"bg-gray-100\" : \"hover:bg-gray-100\"}`}\n >\n <IconBell size={20} className=\"text-gray-500\" />\n {totalUnread > 0 && (\n <span\n className={cn(\n \"absolute top-0.5 right-0.5 size-3.5 rounded-full border-2 border-white\",\n resolvedBadgeClassName,\n )}\n />\n )}\n </div>\n </PopoverPrimitive.Trigger>\n <PopoverPrimitive.Portal>\n <PopoverPrimitive.Content\n className={cn(\n \"absolute bottom-2 left-[26px] z-[9999] w-[308px] p-0 pt-4 bg-white rounded-2xl shadow-md border border-gray-200\",\n contentClassName,\n )}\n side={side}\n align={align}\n sideOffset={8}\n >\n <span className=\"paragraph-small-semibold text-gray-950 px-4\">\n
|
|
1
|
+
{"version":3,"sources":["../../../src/components/layouts/NotificationsPopover.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport { useTranslations } from \"next-intl\";\nimport { IconBell } from '@tabler/icons-react';\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport { Popover } from \"../ui/overlay/Popover\";\nimport { Button } from \"../ui/buttons/Button\";\nimport NotificationCard from \"../widgets/notifications/NotificationCard\";\nimport { cn } from \"../../infra/utils/clsx\";\nimport { useMessages, useMarkAllMessagesAsRead } from \"../../modules/users/hooks/messages.hook\";\nimport { useIsDefaultWhitelabel } from \"../../providers/whitelabel.provider\";\nimport { formatDistanceToNow } from \"date-fns\";\nimport { ptBR } from \"date-fns/locale\";\n\nexport interface NotificationsPopoverProps {\n onViewAll?: () => void;\n side?: \"top\" | \"bottom\" | \"left\" | \"right\";\n align?: \"start\" | \"center\" | \"end\";\n contentClassName?: string;\n badgeClassName?: string;\n}\n\nfunction NotificationsPopover({\n onViewAll,\n side,\n align,\n contentClassName,\n badgeClassName,\n}: NotificationsPopoverProps) {\n const translate = useTranslations();\n const isDefaultWl = useIsDefaultWhitelabel();\n const resolvedBadgeClassName = badgeClassName ?? (isDefaultWl ? \"bg-cyan-300\" : \"bg-zinc-300\");\n const [open, setOpen] = useState(false);\n const { data: messagesData } = useMessages({ type: 'notification', readed: true, limit: 5 });\n const { mutate: markAllAsRead } = useMarkAllMessagesAsRead();\n\n const messages = messagesData?.data ?? [];\n const totalUnread = messagesData?.totalUnread ?? 0;\n\n const handleOpenChange = (isOpen: boolean) => {\n setOpen(isOpen);\n if (isOpen && totalUnread > 0) {\n markAllAsRead();\n }\n };\n\n return (\n <Popover open={open} onOpenChange={handleOpenChange}>\n <PopoverPrimitive.Trigger className=\"cursor-pointer\">\n <div\n className={`relative rounded-full p-2.5 ${open ? \"bg-gray-100\" : \"hover:bg-gray-100\"}`}\n >\n <IconBell size={20} className=\"text-gray-500\" />\n {totalUnread > 0 && (\n <span\n className={cn(\n \"absolute top-0.5 right-0.5 size-3.5 rounded-full border-2 border-white\",\n resolvedBadgeClassName,\n )}\n />\n )}\n </div>\n </PopoverPrimitive.Trigger>\n <PopoverPrimitive.Portal>\n <PopoverPrimitive.Content\n className={cn(\n \"absolute bottom-2 left-[26px] z-[9999] w-[308px] p-0 pt-4 bg-white rounded-2xl shadow-md border border-gray-200\",\n contentClassName,\n )}\n side={side}\n align={align}\n sideOffset={8}\n >\n <span className=\"paragraph-small-semibold text-gray-950 px-4\">\n {translate('common.notifications.popover.title')}\n </span>\n\n {messages.length > 0 ? (\n messages.map((message, index) => (\n <NotificationCard\n key={message.id}\n icon={<IconBell size={16} />}\n iconBgColor=\"bg-gray-100\"\n title={message.subject}\n time={formatDistanceToNow(new Date(message.datetime_add), {\n addSuffix: true,\n locale: ptBR,\n })}\n gapPx={6}\n showBorder={index < messages.length - 1}\n />\n ))\n ) : (\n <div className=\"flex flex-col items-center gap-4 pt-[41.5px] pb-[33.5px]\">\n <div className=\"bg-gray-50 rounded-md p-2.5\">\n <IconBell size={20} color=\"var(--color-gray-950)\" />\n </div>\n <span className=\"paragraph-small-medium text-gray-950\">\n {translate('common.notifications.popover.empty')}\n </span>\n </div>\n )}\n\n {onViewAll && (\n <Button\n variant=\"secondary\"\n className=\"h-8! mt-2 mb-4 mx-4 paragraph-small-semibold\"\n onClick={onViewAll}\n >\n {translate('common.notifications.popover.viewAll')}\n </Button>\n )}\n </PopoverPrimitive.Content>\n </PopoverPrimitive.Portal>\n </Popover>\n );\n}\n\nexport { NotificationsPopover };\n"],"mappings":";AAkDQ,SAGE,KAHF;AAhDR,SAAS,gBAAgB;AACzB,SAAS,uBAAuB;AAChC,SAAS,gBAAgB;AACzB,YAAY,sBAAsB;AAClC,SAAS,eAAe;AACxB,SAAS,cAAc;AACvB,OAAO,sBAAsB;AAC7B,SAAS,UAAU;AACnB,SAAS,aAAa,gCAAgC;AACtD,SAAS,8BAA8B;AACvC,SAAS,2BAA2B;AACpC,SAAS,YAAY;AAUrB,SAAS,qBAAqB;AAAA,EAC5B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAA8B;AAC5B,QAAM,YAAY,gBAAgB;AAClC,QAAM,cAAc,uBAAuB;AAC3C,QAAM,yBAAyB,mBAAmB,cAAc,gBAAgB;AAChF,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,KAAK;AACtC,QAAM,EAAE,MAAM,aAAa,IAAI,YAAY,EAAE,MAAM,gBAAgB,QAAQ,MAAM,OAAO,EAAE,CAAC;AAC3F,QAAM,EAAE,QAAQ,cAAc,IAAI,yBAAyB;AAE3D,QAAM,WAAW,cAAc,QAAQ,CAAC;AACxC,QAAM,cAAc,cAAc,eAAe;AAEjD,QAAM,mBAAmB,CAAC,WAAoB;AAC5C,YAAQ,MAAM;AACd,QAAI,UAAU,cAAc,GAAG;AAC7B,oBAAc;AAAA,IAChB;AAAA,EACF;AAEA,SACE,qBAAC,WAAQ,MAAY,cAAc,kBACjC;AAAA,wBAAC,iBAAiB,SAAjB,EAAyB,WAAU,kBAClC;AAAA,MAAC;AAAA;AAAA,QACC,WAAW,+BAA+B,OAAO,gBAAgB,mBAAmB;AAAA,QAEpF;AAAA,8BAAC,YAAS,MAAM,IAAI,WAAU,iBAAgB;AAAA,UAC7C,cAAc,KACb;AAAA,YAAC;AAAA;AAAA,cACC,WAAW;AAAA,gBACT;AAAA,gBACA;AAAA,cACF;AAAA;AAAA,UACF;AAAA;AAAA;AAAA,IAEJ,GACF;AAAA,IACA,oBAAC,iBAAiB,QAAjB,EACC;AAAA,MAAC,iBAAiB;AAAA,MAAjB;AAAA,QACC,WAAW;AAAA,UACT;AAAA,UACA;AAAA,QACF;AAAA,QACA;AAAA,QACA;AAAA,QACA,YAAY;AAAA,QAEZ;AAAA,8BAAC,UAAK,WAAU,+CACb,oBAAU,oCAAoC,GACjD;AAAA,UAEC,SAAS,SAAS,IACjB,SAAS,IAAI,CAAC,SAAS,UACrB;AAAA,YAAC;AAAA;AAAA,cAEC,MAAM,oBAAC,YAAS,MAAM,IAAI;AAAA,cAC1B,aAAY;AAAA,cACZ,OAAO,QAAQ;AAAA,cACf,MAAM,oBAAoB,IAAI,KAAK,QAAQ,YAAY,GAAG;AAAA,gBACxD,WAAW;AAAA,gBACX,QAAQ;AAAA,cACV,CAAC;AAAA,cACD,OAAO;AAAA,cACP,YAAY,QAAQ,SAAS,SAAS;AAAA;AAAA,YATjC,QAAQ;AAAA,UAUf,CACD,IAED,qBAAC,SAAI,WAAU,4DACb;AAAA,gCAAC,SAAI,WAAU,+BACb,8BAAC,YAAS,MAAM,IAAI,OAAM,yBAAwB,GACpD;AAAA,YACA,oBAAC,UAAK,WAAU,wCACb,oBAAU,oCAAoC,GACjD;AAAA,aACF;AAAA,UAGD,aACC;AAAA,YAAC;AAAA;AAAA,cACC,SAAQ;AAAA,cACR,WAAU;AAAA,cACV,SAAS;AAAA,cAER,oBAAU,sCAAsC;AAAA;AAAA,UACnD;AAAA;AAAA;AAAA,IAEJ,GACF;AAAA,KACF;AAEJ;","names":[]}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { useState } from "react";
|
|
4
|
+
import { useTranslations } from "next-intl";
|
|
4
5
|
import { useRouter } from "next/navigation";
|
|
5
6
|
import * as PopoverPrimitive from "@radix-ui/react-popover";
|
|
6
7
|
import { Popover } from "../ui/overlay/Popover";
|
|
@@ -22,6 +23,7 @@ function ProfilePopover({
|
|
|
22
23
|
contentClassName = "absolute bottom-2 left-[26px]",
|
|
23
24
|
menuItems = []
|
|
24
25
|
}) {
|
|
26
|
+
const translate = useTranslations();
|
|
25
27
|
const { user, logout } = useAuth();
|
|
26
28
|
const [isLoggingOut, setIsLoggingOut] = useState(false);
|
|
27
29
|
const [popoverOpen, setPopoverOpen] = useState(false);
|
|
@@ -46,7 +48,7 @@ function ProfilePopover({
|
|
|
46
48
|
LoadingOverlay,
|
|
47
49
|
{
|
|
48
50
|
isLoading: isLoggingOut,
|
|
49
|
-
message: "
|
|
51
|
+
message: translate("common.layout.profile.loggingOut")
|
|
50
52
|
}
|
|
51
53
|
),
|
|
52
54
|
/* @__PURE__ */ jsxs(Popover, { open: popoverOpen, onOpenChange: setPopoverOpen, children: [
|
|
@@ -98,7 +100,7 @@ function ProfilePopover({
|
|
|
98
100
|
window.location.href = `${accountsUrl}?openProfile=true`;
|
|
99
101
|
}
|
|
100
102
|
},
|
|
101
|
-
children: "
|
|
103
|
+
children: translate("common.actions.edit")
|
|
102
104
|
}
|
|
103
105
|
)
|
|
104
106
|
] }),
|
|
@@ -120,7 +122,7 @@ function ProfilePopover({
|
|
|
120
122
|
},
|
|
121
123
|
children: [
|
|
122
124
|
/* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-2", children: [
|
|
123
|
-
/* @__PURE__ */ jsx("span", { className: "paragraph-xsmall-semibold text-white truncate", children: "
|
|
125
|
+
/* @__PURE__ */ jsx("span", { className: "paragraph-xsmall-semibold text-white truncate", children: translate("common.layout.profile.usedCredits") }),
|
|
124
126
|
/* @__PURE__ */ jsxs("span", { className: "paragraph-xsmall-medium text-white/50", children: [
|
|
125
127
|
summary.usedCredits.toLocaleString("pt-BR"),
|
|
126
128
|
"/",
|
|
@@ -149,7 +151,7 @@ function ProfilePopover({
|
|
|
149
151
|
index
|
|
150
152
|
)) }),
|
|
151
153
|
/* @__PURE__ */ jsx(Separator, {}),
|
|
152
|
-
/* @__PURE__ */ jsx(NavBarItem, { label: "
|
|
154
|
+
/* @__PURE__ */ jsx(NavBarItem, { label: translate("common.layout.profile.logout"), onClick: handleLogout })
|
|
153
155
|
] })
|
|
154
156
|
] })
|
|
155
157
|
]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/layouts/ProfilePopover.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport { useRouter } from \"next/navigation\";\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport { Popover } from \"../ui/overlay/Popover\";\nimport { Button } from \"../ui/buttons/Button\";\nimport { Progress } from \"../ui/feedback/Progress\";\nimport { Separator } from \"../ui/data-display/Separator\";\nimport { NavBarItem } from \"./NavBarItem\";\nimport { UserAvatar } from \"../ui/data-display/UserAvatar\";\nimport { LoadingOverlay } from \"../ui/feedback/LoadingOverlay\";\nimport { useAuth } from \"../../providers/auth.provider\";\nimport { useIsDefaultWhitelabel, useWhitelabelUrls } from \"../../providers/whitelabel.provider\";\nimport { cn } from \"../../infra/utils/clsx\";\nimport { useIaCredits } from \"../../modules/ia-credits/hooks/ia-credits.hook\";\nimport { useBuyCreditsModal } from \"../../store/useBuyCreditsModal\";\nimport { useCreditsDisabledModal } from \"../../store/useCreditsDisabledModal\";\n\nexport interface ProfileMenuItem {\n icon?: React.ReactNode;\n label: string;\n onClick: () => void;\n}\n\nexport interface ProfilePopoverProps {\n side?: \"top\" | \"bottom\" | \"left\" | \"right\";\n align?: \"start\" | \"center\" | \"end\";\n contentClassName?: string;\n menuItems?: ProfileMenuItem[];\n}\n\nfunction ProfilePopover({\n side = \"top\",\n align = \"start\",\n contentClassName = \"absolute bottom-2 left-[26px]\",\n menuItems = [],\n}: ProfilePopoverProps) {\n const { user, logout } = useAuth();\n const [isLoggingOut, setIsLoggingOut] = useState(false);\n const [popoverOpen, setPopoverOpen] = useState(false);\n\n const { summary, subscription, isSubscriptionLoading, isCreditsLoading } =\n useIaCredits();\n const { openModal: openBuyCreditsModal } = useBuyCreditsModal();\n const { openModal: openCreditsDisabledModal } = useCreditsDisabledModal();\n const canManage = user?.profile === 'owner' || user?.profile === 'admin';\n const isDefaultWl = useIsDefaultWhitelabel();\n const { accountsUrl } = useWhitelabelUrls();\n const router = useRouter();\n\n const handleLogout = async () => {\n setPopoverOpen(false);\n setIsLoggingOut(true);\n await logout();\n };\n\n const hasSubscription = !isSubscriptionLoading && subscription !== null;\n\n const isApiPlan = hasSubscription && subscription.id_plan === 411;\n const shouldShowCredits = hasSubscription && isDefaultWl && !isApiPlan;\n const creditsPercentage =\n shouldShowCredits && summary.totalCredits > 0\n ? (summary.usedCredits / summary.totalCredits) * 100\n : 0;\n\n return (\n <>\n <LoadingOverlay\n isLoading={isLoggingOut}\n message=\"Saindo da sua conta...\"\n />\n <Popover open={popoverOpen} onOpenChange={setPopoverOpen}>\n <PopoverPrimitive.Trigger className=\"cursor-pointer\">\n {user && (\n <UserAvatar\n key={user.id}\n photo={user.photo}\n name={user.name}\n size={40}\n />\n )}\n </PopoverPrimitive.Trigger>\n\n <PopoverPrimitive.Portal>\n <PopoverPrimitive.Content\n className={cn(\n \"w-64.75 p-0 bg-white rounded-2xl shadow-md border border-gray-200 z-99\",\n contentClassName,\n )}\n side={side}\n align={align}\n sideOffset={8}\n >\n <div className=\"grid grid-cols-[32px_1fr_auto] items-center gap-3 p-3 w-full\">\n {user && (\n <UserAvatar\n key={user.id}\n photo={user.photo}\n name={user.name}\n size={32}\n />\n )}\n\n <div className=\"flex flex-col gap-0.5 min-w-0\">\n <span className=\"paragraph-small-semibold text-gray-950 truncate\">\n {user?.name || \"\"}\n </span>\n <span className=\"paragraph-xsmall-medium text-gray-500 truncate\">\n {user?.email || \"\"}\n </span>\n </div>\n\n <Button\n variant=\"secondary\"\n className=\"h-8! px-3! paragraph-xsmall-semibold\"\n onClick={() => {\n const isSameOrigin = accountsUrl.startsWith(window.location.origin);\n if (isSameOrigin) {\n setPopoverOpen(false);\n router.push(`${window.location.pathname}?openProfile=true`);\n } else {\n window.location.href = `${accountsUrl}?openProfile=true`;\n }\n }}\n >\n Editar\n </Button>\n </div>\n\n <div className=\"flex flex-col gap-2 border-t border-gray-200 rounded-2xl p-1.5\">\n {shouldShowCredits && (\n <div\n className={cn(\n \"flex flex-col bg-gray-950 rounded-lg gap-4 w-full p-4 transition-colors\",\n \"cursor-pointer hover:bg-gray-950/90\",\n )}\n onClick={() => {\n setPopoverOpen(false);\n if (canManage) {\n openBuyCreditsModal();\n } else {\n openCreditsDisabledModal();\n }\n }}\n >\n <div className=\"flex items-center justify-between gap-2\">\n <span className=\"paragraph-xsmall-semibold text-white truncate\">\n Créditos usados\n </span>\n <span className=\"paragraph-xsmall-medium text-white/50\">\n {summary.usedCredits.toLocaleString(\"pt-BR\")}/\n {summary.totalCredits.toLocaleString(\"pt-BR\")}\n </span>\n </div>\n <Progress\n className=\"bg-white/10\"\n indicatorColor=\"bg-white\"\n value={creditsPercentage}\n />\n </div>\n )}\n\n <div className=\"flex flex-col gap-2\">\n <div className=\"flex flex-col\">\n {menuItems.map((item, index) => (\n <NavBarItem\n key={index}\n icon={item.icon}\n label={item.label}\n onClick={item.onClick}\n />\n ))}\n </div>\n <Separator />\n <NavBarItem label=\"Sair\" onClick={handleLogout} />\n </div>\n </div>\n </PopoverPrimitive.Content>\n </PopoverPrimitive.Portal>\n </Popover>\n </>\n );\n}\n\nexport { ProfilePopover };\n"],"mappings":"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","names":[]}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/layouts/ProfilePopover.tsx"],"sourcesContent":["\"use client\";\n\nimport { useState } from \"react\";\nimport { useTranslations } from \"next-intl\";\nimport { useRouter } from \"next/navigation\";\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\nimport { Popover } from \"../ui/overlay/Popover\";\nimport { Button } from \"../ui/buttons/Button\";\nimport { Progress } from \"../ui/feedback/Progress\";\nimport { Separator } from \"../ui/data-display/Separator\";\nimport { NavBarItem } from \"./NavBarItem\";\nimport { UserAvatar } from \"../ui/data-display/UserAvatar\";\nimport { LoadingOverlay } from \"../ui/feedback/LoadingOverlay\";\nimport { useAuth } from \"../../providers/auth.provider\";\nimport { useIsDefaultWhitelabel, useWhitelabelUrls } from \"../../providers/whitelabel.provider\";\nimport { cn } from \"../../infra/utils/clsx\";\nimport { useIaCredits } from \"../../modules/ia-credits/hooks/ia-credits.hook\";\nimport { useBuyCreditsModal } from \"../../store/useBuyCreditsModal\";\nimport { useCreditsDisabledModal } from \"../../store/useCreditsDisabledModal\";\n\nexport interface ProfileMenuItem {\n icon?: React.ReactNode;\n label: string;\n onClick: () => void;\n}\n\nexport interface ProfilePopoverProps {\n side?: \"top\" | \"bottom\" | \"left\" | \"right\";\n align?: \"start\" | \"center\" | \"end\";\n contentClassName?: string;\n menuItems?: ProfileMenuItem[];\n}\n\nfunction ProfilePopover({\n side = \"top\",\n align = \"start\",\n contentClassName = \"absolute bottom-2 left-[26px]\",\n menuItems = [],\n}: ProfilePopoverProps) {\n const translate = useTranslations();\n const { user, logout } = useAuth();\n const [isLoggingOut, setIsLoggingOut] = useState(false);\n const [popoverOpen, setPopoverOpen] = useState(false);\n\n const { summary, subscription, isSubscriptionLoading, isCreditsLoading } =\n useIaCredits();\n const { openModal: openBuyCreditsModal } = useBuyCreditsModal();\n const { openModal: openCreditsDisabledModal } = useCreditsDisabledModal();\n const canManage = user?.profile === 'owner' || user?.profile === 'admin';\n const isDefaultWl = useIsDefaultWhitelabel();\n const { accountsUrl } = useWhitelabelUrls();\n const router = useRouter();\n\n const handleLogout = async () => {\n setPopoverOpen(false);\n setIsLoggingOut(true);\n await logout();\n };\n\n const hasSubscription = !isSubscriptionLoading && subscription !== null;\n\n const isApiPlan = hasSubscription && subscription.id_plan === 411;\n const shouldShowCredits = hasSubscription && isDefaultWl && !isApiPlan;\n const creditsPercentage =\n shouldShowCredits && summary.totalCredits > 0\n ? (summary.usedCredits / summary.totalCredits) * 100\n : 0;\n\n return (\n <>\n <LoadingOverlay\n isLoading={isLoggingOut}\n message={translate('common.layout.profile.loggingOut')}\n />\n <Popover open={popoverOpen} onOpenChange={setPopoverOpen}>\n <PopoverPrimitive.Trigger className=\"cursor-pointer\">\n {user && (\n <UserAvatar\n key={user.id}\n photo={user.photo}\n name={user.name}\n size={40}\n />\n )}\n </PopoverPrimitive.Trigger>\n\n <PopoverPrimitive.Portal>\n <PopoverPrimitive.Content\n className={cn(\n \"w-64.75 p-0 bg-white rounded-2xl shadow-md border border-gray-200 z-99\",\n contentClassName,\n )}\n side={side}\n align={align}\n sideOffset={8}\n >\n <div className=\"grid grid-cols-[32px_1fr_auto] items-center gap-3 p-3 w-full\">\n {user && (\n <UserAvatar\n key={user.id}\n photo={user.photo}\n name={user.name}\n size={32}\n />\n )}\n\n <div className=\"flex flex-col gap-0.5 min-w-0\">\n <span className=\"paragraph-small-semibold text-gray-950 truncate\">\n {user?.name || \"\"}\n </span>\n <span className=\"paragraph-xsmall-medium text-gray-500 truncate\">\n {user?.email || \"\"}\n </span>\n </div>\n\n <Button\n variant=\"secondary\"\n className=\"h-8! px-3! paragraph-xsmall-semibold\"\n onClick={() => {\n const isSameOrigin = accountsUrl.startsWith(window.location.origin);\n if (isSameOrigin) {\n setPopoverOpen(false);\n router.push(`${window.location.pathname}?openProfile=true`);\n } else {\n window.location.href = `${accountsUrl}?openProfile=true`;\n }\n }}\n >\n {translate('common.actions.edit')}\n </Button>\n </div>\n\n <div className=\"flex flex-col gap-2 border-t border-gray-200 rounded-2xl p-1.5\">\n {shouldShowCredits && (\n <div\n className={cn(\n \"flex flex-col bg-gray-950 rounded-lg gap-4 w-full p-4 transition-colors\",\n \"cursor-pointer hover:bg-gray-950/90\",\n )}\n onClick={() => {\n setPopoverOpen(false);\n if (canManage) {\n openBuyCreditsModal();\n } else {\n openCreditsDisabledModal();\n }\n }}\n >\n <div className=\"flex items-center justify-between gap-2\">\n <span className=\"paragraph-xsmall-semibold text-white truncate\">\n {translate('common.layout.profile.usedCredits')}\n </span>\n <span className=\"paragraph-xsmall-medium text-white/50\">\n {summary.usedCredits.toLocaleString(\"pt-BR\")}/\n {summary.totalCredits.toLocaleString(\"pt-BR\")}\n </span>\n </div>\n <Progress\n className=\"bg-white/10\"\n indicatorColor=\"bg-white\"\n value={creditsPercentage}\n />\n </div>\n )}\n\n <div className=\"flex flex-col gap-2\">\n <div className=\"flex flex-col\">\n {menuItems.map((item, index) => (\n <NavBarItem\n key={index}\n icon={item.icon}\n label={item.label}\n onClick={item.onClick}\n />\n ))}\n </div>\n <Separator />\n <NavBarItem label={translate('common.layout.profile.logout')} onClick={handleLogout} />\n </div>\n </div>\n </PopoverPrimitive.Content>\n </PopoverPrimitive.Portal>\n </Popover>\n </>\n );\n}\n\nexport { ProfilePopover };\n"],"mappings":"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","names":[]}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
3
3
|
import { useEffect, useState } from "react";
|
|
4
|
+
import { useTranslations } from "next-intl";
|
|
4
5
|
import { IconPlus, IconUser, IconUsers } from "@tabler/icons-react";
|
|
5
6
|
import { UserAvatar } from "../ui/data-display/UserAvatar";
|
|
6
7
|
import { Popover, PopoverContent, PopoverTrigger } from "../ui/overlay/Popover";
|
|
@@ -35,6 +36,7 @@ function UsersSelectorPopover({
|
|
|
35
36
|
align,
|
|
36
37
|
contentClassName
|
|
37
38
|
}) {
|
|
39
|
+
const translate = useTranslations();
|
|
38
40
|
const { accountsUrl } = useWhitelabelUrls();
|
|
39
41
|
const [open, setOpen] = useState(false);
|
|
40
42
|
const [hoveredId, setHoveredId] = useState(null);
|
|
@@ -86,7 +88,7 @@ function UsersSelectorPopover({
|
|
|
86
88
|
sideOffset: 8,
|
|
87
89
|
children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col p-3 gap-2", children: [
|
|
88
90
|
/* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
|
|
89
|
-
/* @__PURE__ */ jsx("span", { className: "paragraph-small-semibold", children: "
|
|
91
|
+
/* @__PURE__ */ jsx("span", { className: "paragraph-small-semibold", children: translate("common.layout.usersSelector.title") }),
|
|
90
92
|
/* @__PURE__ */ jsx("div", { className: "flex items-center gap-1.5", children: /* @__PURE__ */ jsxs(
|
|
91
93
|
Button,
|
|
92
94
|
{
|
|
@@ -97,7 +99,7 @@ function UsersSelectorPopover({
|
|
|
97
99
|
},
|
|
98
100
|
children: [
|
|
99
101
|
/* @__PURE__ */ jsx(IconPlus, { size: 16 }),
|
|
100
|
-
"
|
|
102
|
+
translate("common.layout.usersSelector.add")
|
|
101
103
|
]
|
|
102
104
|
}
|
|
103
105
|
) })
|
|
@@ -106,7 +108,7 @@ function UsersSelectorPopover({
|
|
|
106
108
|
/* @__PURE__ */ jsx(
|
|
107
109
|
CommandInput,
|
|
108
110
|
{
|
|
109
|
-
placeholder: "
|
|
111
|
+
placeholder: translate("common.layout.usersSelector.searchPlaceholder"),
|
|
110
112
|
value: searchInput,
|
|
111
113
|
onValueChange: setSearchInput
|
|
112
114
|
}
|
|
@@ -122,9 +124,9 @@ function UsersSelectorPopover({
|
|
|
122
124
|
/* @__PURE__ */ jsx(UserItemSkeleton, {})
|
|
123
125
|
] }) : allUsers.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center justify-center gap-2 h-full text-gray-400 py-4", children: [
|
|
124
126
|
/* @__PURE__ */ jsx(IconUsers, { size: 28, className: "text-gray-300" }),
|
|
125
|
-
/* @__PURE__ */ jsx("span", { className: "paragraph-small-medium text-center text-gray-500", children: "
|
|
127
|
+
/* @__PURE__ */ jsx("span", { className: "paragraph-small-medium text-center text-gray-500", children: translate("common.layout.usersSelector.empty") })
|
|
126
128
|
] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
127
|
-
/* @__PURE__ */ jsx(CommandEmpty, { children: "
|
|
129
|
+
/* @__PURE__ */ jsx(CommandEmpty, { children: translate("common.layout.usersSelector.noResults") }),
|
|
128
130
|
allUsers.map((user) => {
|
|
129
131
|
const inProject = user.in_project ?? false;
|
|
130
132
|
const removable = inProject && user.profile !== "owner" && user.profile !== "admin";
|
|
@@ -172,7 +174,7 @@ function UsersSelectorPopover({
|
|
|
172
174
|
)
|
|
173
175
|
}
|
|
174
176
|
) }),
|
|
175
|
-
/* @__PURE__ */ jsx(TooltipContent, { className: "z-[1002]", children: inProject ? "
|
|
177
|
+
/* @__PURE__ */ jsx(TooltipContent, { className: "z-[1002]", children: inProject ? translate("common.layout.usersSelector.removeFromProject") : translate("common.layout.usersSelector.addToProject") })
|
|
176
178
|
] })
|
|
177
179
|
] })
|
|
178
180
|
},
|
|
@@ -196,7 +198,7 @@ function UsersSelectorPopover({
|
|
|
196
198
|
onClick: () => {
|
|
197
199
|
window.location.href = `${accountsUrl}/my-teams`;
|
|
198
200
|
},
|
|
199
|
-
children: "
|
|
201
|
+
children: translate("common.layout.usersSelector.manageTeam")
|
|
200
202
|
}
|
|
201
203
|
)
|
|
202
204
|
] })
|