mirror/formbricks
1
0
Fork 0
mirror of https://github.com/formbricks/formbricks.git synced 2026-05-05 11:21:07 -05:00
Code Issues Packages Projects Releases 169 Wiki Activity

fix: update project config navbar + wording (#4918)

Browse Source
This commit is contained in:
Johannes
2025-03-12 05:40:01 -07:00
committed by GitHub
parent a25e5dcfcd
commit 4870dc8d45
35 changed files with 282 additions and 274 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/app/(app)/environments/[environmentId]/settings/(account)/notifications/components/EditAlerts.tsx
+2 -2
View File
@@ -27,7 +27,7 @@ export const EditAlerts = ({
return (
<>
{memberships.map((membership) => (
<>
<div key={membership.organization.id}>
<div className="mb-5 grid grid-cols-6 items-center space-x-3">
<div className="col-span-3 flex items-center space-x-3">
<UsersIcon className="h-6 w-7 text-slate-600" />
@@ -110,7 +110,7 @@ export const EditAlerts = ({
</Link>
</p>
</div>
</>
</div>
))}
</>
);
apps/web/app/(app)/environments/[environmentId]/settings/(account)/notifications/components/EditWeeklySummary.tsx
+2 -2
View File
@@ -18,7 +18,7 @@ export const EditWeeklySummary = ({ memberships, user, environmentId }: EditAler
return (
<>
{memberships.map((membership) => (
<>
<div key={membership.organization.id}>
<div className="mb-5 flex items-center space-x-3 text-sm font-medium">
<UsersIcon className="h-6 w-7 text-slate-600" />
@@ -52,7 +52,7 @@ export const EditWeeklySummary = ({ memberships, user, environmentId }: EditAler
</Link>
</p>
</div>
</>
</div>
))}
</>
);
apps/web/app/(app)/environments/[environmentId]/settings/(account)/profile/page.tsx
+7 -3
View File
@@ -9,8 +9,10 @@ import { UpgradePrompt } from "@/modules/ui/components/upgrade-prompt";
import { getTranslate } from "@/tolgee/server";
import { getServerSession } from "next-auth";
import { IS_FORMBRICKS_CLOUD } from "@formbricks/lib/constants";
import { getOrganizationsWhereUserIsSingleOwner } from "@formbricks/lib/organization/service";
import { getOrganizationByEnvironmentId } from "@formbricks/lib/organization/service";
import {
getOrganizationByEnvironmentId,
getOrganizationsWhereUserIsSingleOwner,
} from "@formbricks/lib/organization/service";
import { getUser } from "@formbricks/lib/user/service";
import { SettingsCard } from "../../components/SettingsCard";
import { DeleteAccount } from "./components/DeleteAccount";
@@ -71,7 +73,9 @@ const Page = async (props: { params: Promise<{ environmentId: string }> }) => {
description={t("environments.settings.profile.two_factor_authentication_description")}
buttons={[
{
text: t("common.start_free_trial"),
text: IS_FORMBRICKS_CLOUD
? t("common.start_free_trial")
: t("common.request_trial_license"),
href: IS_FORMBRICKS_CLOUD
? `/environments/${params.environmentId}/settings/billing`
: "https://formbricks.com/upgrade-self-hosting-license",
apps/web/modules/ee/contacts/page.tsx
+1 -1
View File
@@ -95,7 +95,7 @@ export const ContactsPage = async ({
description={t("environments.contacts.unlock_contacts_description")}
buttons={[
{
text: t("common.start_free_trial"),
text: IS_FORMBRICKS_CLOUD ? t("common.start_free_trial") : t("common.request_trial_license"),
href: IS_FORMBRICKS_CLOUD
? `/environments/${params.environmentId}/settings/billing`
: "https://formbricks.com/upgrade-self-hosting-license",
apps/web/modules/ee/contacts/segments/page.tsx
+1 -1
View File
@@ -100,7 +100,7 @@ export const SegmentsPage = async ({
description={t("environments.segments.unlock_segments_description")}
buttons={[
{
text: t("common.start_free_trial"),
text: IS_FORMBRICKS_CLOUD ? t("common.start_free_trial") : t("common.request_trial_license"),
href: IS_FORMBRICKS_CLOUD
? `/environments/${params.environmentId}/settings/billing`
: "https://formbricks.com/upgrade-self-hosting-license",
apps/web/modules/ee/languages/loading.tsx
+1 -1
View File
@@ -11,7 +11,7 @@ export const LanguagesLoading = () => {
const { t } = useTranslate();
return (
<PageContentWrapper>
<PageHeader pageTitle={t("common.configuration")}>
<PageHeader pageTitle={t("common.project_configuration")}>
<ProjectConfigNavigation activeId="languages" loading />
</PageHeader>
<SettingsCard
apps/web/modules/ee/languages/page.tsx
+12 -18
View File
@@ -1,9 +1,6 @@
import { SettingsCard } from "@/app/(app)/environments/[environmentId]/settings/components/SettingsCard";
import { authOptions } from "@/modules/auth/lib/authOptions";
import {
getMultiLanguagePermission,
getRoleManagementPermission,
} from "@/modules/ee/license-check/lib/utils";
import { getMultiLanguagePermission } from "@/modules/ee/license-check/lib/utils";
import { EditLanguage } from "@/modules/ee/multi-language-surveys/components/edit-language";
import { getProjectPermissionByUserId } from "@/modules/ee/teams/lib/roles";
import { getTeamPermissionFlags } from "@/modules/ee/teams/utils/teams";
@@ -12,7 +9,7 @@ import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper
import { PageHeader } from "@/modules/ui/components/page-header";
import { getTranslate } from "@/tolgee/server";
import { getServerSession } from "next-auth";
import { notFound } from "next/navigation";
import { IS_FORMBRICKS_CLOUD } from "@formbricks/lib/constants";
import { getMembershipByUserIdOrganizationId } from "@formbricks/lib/membership/service";
import { getAccessFlags } from "@formbricks/lib/membership/utils";
import { getOrganization } from "@formbricks/lib/organization/service";
@@ -35,11 +32,6 @@ export const LanguagesPage = async (props: { params: Promise<{ environmentId: st
}
const isMultiLanguageAllowed = await getMultiLanguagePermission(organization.billing.plan);
if (!isMultiLanguageAllowed) {
notFound();
}
const canDoRoleManagement = await getRoleManagementPermission(organization.billing.plan);
const session = await getServerSession(authOptions);
@@ -63,18 +55,20 @@ export const LanguagesPage = async (props: { params: Promise<{ environmentId: st
return (
<PageContentWrapper>
<PageHeader pageTitle={t("common.configuration")}>
<ProjectConfigNavigation
environmentId={params.environmentId}
activeId="languages"
isMultiLanguageAllowed={isMultiLanguageAllowed}
canDoRoleManagement={canDoRoleManagement}
/>
<PageHeader pageTitle={t("common.project_configuration")}>
<ProjectConfigNavigation environmentId={params.environmentId} activeId="languages" />
</PageHeader>
<SettingsCard
title={t("environments.project.languages.multi_language_surveys")}
description={t("environments.project.languages.multi_language_surveys_description")}>
<EditLanguage project={project} locale={user.locale} isReadOnly={isReadOnly} />
<EditLanguage
project={project}
locale={user.locale}
isReadOnly={isReadOnly}
isMultiLanguageAllowed={isMultiLanguageAllowed}
environmentId={params.environmentId}
isFormbricksCloud={IS_FORMBRICKS_CLOUD}
/>
</SettingsCard>
</PageContentWrapper>
);
apps/web/modules/ee/multi-language-surveys/components/edit-language.tsx
+97 -60
View File
@@ -4,9 +4,9 @@ import { getFormattedErrorMessage } from "@/lib/utils/helper";
import { Alert, AlertDescription } from "@/modules/ui/components/alert";
import { Button } from "@/modules/ui/components/button";
import { ConfirmationModal } from "@/modules/ui/components/confirmation-modal";
import { ModalButton, UpgradePrompt } from "@/modules/ui/components/upgrade-prompt";
import { Language } from "@prisma/client";
import { useTranslate } from "@tolgee/react";
import { TFnType } from "@tolgee/react";
import { TFnType, useTranslate } from "@tolgee/react";
import { PlusIcon } from "lucide-react";
import { useEffect, useState } from "react";
import { toast } from "react-hot-toast";
@@ -26,6 +26,9 @@ interface EditLanguageProps {
project: TProject;
locale: TUserLocale;
isReadOnly: boolean;
isMultiLanguageAllowed: boolean;
environmentId: string;
isFormbricksCloud: boolean;
}
const checkIfDuplicateExists = (arr: string[]) => {
@@ -57,7 +60,7 @@ const validateLanguages = (languages: Language[], t: TFnType) => {
return false;
}
// Check if the chosen alias matches an ISO identifier of a language that hasn’t been added
// Check if the chosen alias matches an ISO identifier of a language that hasn't been added
for (const alias of languageAliases) {
if (iso639Languages.some((language) => language.alpha2 === alias && !languageCodes.includes(alias))) {
toast.error(t("environments.project.languages.conflict_between_selected_alias_and_another_language"), {
@@ -70,7 +73,14 @@ const validateLanguages = (languages: Language[], t: TFnType) => {
return true;
};
export function EditLanguage({ project, locale, isReadOnly }: EditLanguageProps) {
export function EditLanguage({
project,
locale,
isReadOnly,
isMultiLanguageAllowed,
environmentId,
isFormbricksCloud,
}: EditLanguageProps) {
const { t } = useTranslate();
const [languages, setLanguages] = useState<Language[]>(project.languages);
const [isEditing, setIsEditing] = useState(false);
@@ -150,6 +160,21 @@ export function EditLanguage({ project, locale, isReadOnly }: EditLanguageProps)
setIsEditing(false);
};
const buttons: [ModalButton, ModalButton] = [
{
text: isFormbricksCloud ? t("common.start_free_trial") : t("common.request_trial_license"),
href: isFormbricksCloud
? `/environments/${environmentId}/settings/billing`
: "https://formbricks.com/upgrade-self-hosting-license",
},
{
text: t("common.learn_more"),
href: isFormbricksCloud
? `/environments/${environmentId}/settings/billing`
: "https://formbricks.com/learn-more-self-hosting-license",
},
];
const handleSaveChanges = async () => {
if (!validateLanguages(languages, t)) return;
await Promise.all(
@@ -179,63 +204,75 @@ export function EditLanguage({ project, locale, isReadOnly }: EditLanguageProps)
) : null;
return (
<div className="flex flex-col space-y-4">
<div className="space-y-4">
{languages.length > 0 ? (
<>
<LanguageLabels />
{languages.map((language, index) => (
<LanguageRow
index={index}
isEditing={isEditing}
key={language.id}
language={language}
locale={locale}
onDelete={() => handleDeleteLanguage(language.id)}
onLanguageChange={(newLanguage: Language) => {
const updatedLanguages = [...languages];
updatedLanguages[index] = newLanguage;
setLanguages(updatedLanguages);
}}
/>
))}
</>
) : (
<p className="text-sm italic text-slate-500">
{t("environments.project.languages.no_language_found")}
</p>
)}
<AddLanguageButton onClick={handleAddLanguage} />
</div>
<EditSaveButtons
isEditing={isEditing}
onCancel={handleCancelChanges}
disabled={isReadOnly}
onEdit={() => {
setIsEditing(true);
}}
onSave={handleSaveChanges}
t={t}
/>
{isReadOnly && (
<Alert variant="warning" className="mt-4">
<AlertDescription>
{t("common.only_owners_managers_and_manage_access_members_can_perform_this_action")}
</AlertDescription>
</Alert>
<>
{isMultiLanguageAllowed ? (
<div className="flex flex-col space-y-4">
<div className="space-y-4">
{languages.length > 0 ? (
<>
<LanguageLabels />
{languages.map((language, index) => (
<LanguageRow
index={index}
isEditing={isEditing}
key={language.id}
language={language}
locale={locale}
onDelete={() => handleDeleteLanguage(language.id)}
onLanguageChange={(newLanguage: Language) => {
const updatedLanguages = [...languages];
updatedLanguages[index] = newLanguage;
setLanguages(updatedLanguages);
}}
/>
))}
</>
) : (
<p className="text-sm italic text-slate-500">
{t("environments.project.languages.no_language_found")}
</p>
)}
<AddLanguageButton onClick={handleAddLanguage} />
</div>
<EditSaveButtons
isEditing={isEditing}
onCancel={handleCancelChanges}
disabled={isReadOnly}
onEdit={() => {
setIsEditing(true);
}}
onSave={handleSaveChanges}
t={t}
/>
{isReadOnly && (
<Alert variant="warning" className="mt-4">
<AlertDescription>
{t("common.only_owners_managers_and_manage_access_members_can_perform_this_action")}
</AlertDescription>
</Alert>
)}
<ConfirmationModal
buttonText={t("environments.project.languages.remove_language")}
isButtonDisabled={confirmationModal.isButtonDisabled}
onConfirm={() => performLanguageDeletion(confirmationModal.languageId)}
open={confirmationModal.isOpen}
setOpen={() => {
setConfirmationModal((prev) => ({ ...prev, isOpen: !prev.isOpen }));
}}
text={confirmationModal.text}
title={t("environments.project.languages.remove_language")}
/>
</div>
) : (
<UpgradePrompt
title={t("environments.settings.general.use_multi_language_surveys_with_a_higher_plan")}
description={t(
"environments.settings.general.use_multi_language_surveys_with_a_higher_plan_description"
)}
buttons={buttons}
/>
)}
<ConfirmationModal
buttonText={t("environments.project.languages.remove_language")}
isButtonDisabled={confirmationModal.isButtonDisabled}
onConfirm={() => performLanguageDeletion(confirmationModal.languageId)}
open={confirmationModal.isOpen}
setOpen={() => {
setConfirmationModal((prev) => ({ ...prev, isOpen: !prev.isOpen }));
}}
text={confirmationModal.text}
title={t("environments.project.languages.remove_language")}
/>
</div>
</>
);
}
apps/web/modules/ee/multi-language-surveys/components/multi-language-card.tsx
+3 -1
View File
@@ -230,7 +230,9 @@ export const MultiLanguageCard: FC<MultiLanguageCardProps> = ({
description={t("environments.surveys.edit.upgrade_notice_description")}
buttons={[
{
text: t("common.start_free_trial"),
text: isFormbricksCloud
? t("common.start_free_trial")
: t("common.request_trial_license"),
href: isFormbricksCloud
? `/environments/${environmentId}/settings/billing`
: "https://formbricks.com/docs/self-hosting/license#30-day-trial-license-request",
apps/web/modules/ee/teams/project-teams/loading.tsx
+36
View File
@@ -0,0 +1,36 @@
"use client";
import { ProjectConfigNavigation } from "@/modules/projects/settings/components/project-config-navigation";
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
import { PageHeader } from "@/modules/ui/components/page-header";
import { useTranslate } from "@tolgee/react";
export const TeamsLoading = () => {
const { t } = useTranslate();
return (
<PageContentWrapper>
<PageHeader pageTitle={t("common.project_configuration")}>
<ProjectConfigNavigation activeId="teams" loading />
</PageHeader>
<div className="p-4">
<div className="mb-4">
<div className="h-6 w-1/3 animate-pulse rounded bg-slate-200" />
</div>
<div className="space-y-4">
{[...Array(3)].map((_, idx) => (
<div
key={idx}
className="flex animate-pulse items-center space-x-4 rounded border border-slate-200 p-4">
<div className="h-10 w-10 rounded-full bg-slate-300" />
<div className="flex-1 space-y-2">
<div className="h-4 w-3/4 rounded bg-slate-200" />
<div className="h-4 w-1/2 rounded bg-slate-200" />
</div>
</div>
))}
</div>
</div>
</PageContentWrapper>
);
};
apps/web/modules/ee/teams/project-teams/page.tsx
+2 -14
View File
@@ -1,8 +1,4 @@
import { authOptions } from "@/modules/auth/lib/authOptions";
import {
getMultiLanguagePermission,
getRoleManagementPermission,
} from "@/modules/ee/license-check/lib/utils";
import { AccessView } from "@/modules/ee/teams/project-teams/components/access-view";
import { ProjectConfigNavigation } from "@/modules/projects/settings/components/project-config-navigation";
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
@@ -37,9 +33,6 @@ export const ProjectTeams = async (props: { params: Promise<{ environmentId: str
const currentUserMembership = await getMembershipByUserIdOrganizationId(session?.user.id, organization.id);
const { isOwner, isManager } = getAccessFlags(currentUserMembership?.role);
const isMultiLanguageAllowed = await getMultiLanguagePermission(organization.billing.plan);
const canDoRoleManagement = await getRoleManagementPermission(organization.billing.plan);
const teams = await getTeamsByProjectId(project.id);
if (!teams) {
@@ -50,13 +43,8 @@ export const ProjectTeams = async (props: { params: Promise<{ environmentId: str
return (
<PageContentWrapper>
<PageHeader pageTitle={t("common.configuration")}>
<ProjectConfigNavigation
environmentId={params.environmentId}
activeId="teams"
isMultiLanguageAllowed={isMultiLanguageAllowed}
canDoRoleManagement={canDoRoleManagement}
/>
<PageHeader pageTitle={t("common.project_configuration")}>
<ProjectConfigNavigation environmentId={params.environmentId} activeId="teams" />
</PageHeader>
<AccessView environmentId={params.environmentId} teams={teams} isOwnerOrManager={isOwnerOrManager} />
</PageContentWrapper>
apps/web/modules/ee/teams/team-list/components/teams-view.tsx
+1 -1
View File
@@ -37,7 +37,7 @@ export const TeamsView = async ({
const buttons: [ModalButton, ModalButton] = [
{
text: t("common.start_free_trial"),
text: IS_FORMBRICKS_CLOUD ? t("common.start_free_trial") : t("common.request_trial_license"),
href: IS_FORMBRICKS_CLOUD
? `/environments/${environmentId}/settings/billing`
: "https://formbricks.com/docs/self-hosting/license#30-day-trial-license-request",
apps/web/modules/ee/whitelabel/email-customization/components/email-customization-settings.tsx
+1 -1
View File
@@ -162,7 +162,7 @@ export const EmailCustomizationSettings = ({
const buttons: [ModalButton, ModalButton] = [
{
text: t("common.start_free_trial"),
text: isFormbricksCloud ? t("common.start_free_trial") : t("common.request_trial_license"),
href: isFormbricksCloud
? `/environments/${environmentId}/settings/billing`
: "https://formbricks.com/upgrade-self-hosting-license",
apps/web/modules/ee/whitelabel/remove-branding/components/branding-settings-card.tsx
+1 -1
View File
@@ -23,7 +23,7 @@ export const BrandingSettingsCard = async ({
const buttons: [ModalButton, ModalButton] = [
{
text: t("common.start_free_trial"),
text: IS_FORMBRICKS_CLOUD ? t("common.start_free_trial") : t("common.request_trial_license"),
href: IS_FORMBRICKS_CLOUD
? `/environments/${environmentId}/settings/billing`
: "https://formbricks.com/upgrade-self-hosting-license",
apps/web/modules/projects/settings/(setup)/app-connection/loading.tsx
+1 -1
View File
@@ -35,7 +35,7 @@ export const AppConnectionLoading = () => {
return (
<PageContentWrapper>
<PageHeader pageTitle={t("common.configuration")}>
<PageHeader pageTitle={t("common.project_configuration")}>
<ProjectConfigNavigation activeId="app-connection" loading />
</PageHeader>
<div className="mt-4 flex max-w-4xl animate-pulse items-center space-y-4 rounded-lg border bg-blue-50 p-6 text-sm text-blue-900 shadow-sm md:space-y-0 md:text-base"></div>
apps/web/modules/projects/settings/(setup)/app-connection/page.tsx
+2 -14
View File
@@ -1,9 +1,5 @@
import { WidgetStatusIndicator } from "@/app/(app)/environments/[environmentId]/components/WidgetStatusIndicator";
import { SettingsCard } from "@/app/(app)/environments/[environmentId]/settings/components/SettingsCard";
import {
getMultiLanguagePermission,
getRoleManagementPermission,
} from "@/modules/ee/license-check/lib/utils";
import { EnvironmentIdField } from "@/modules/projects/settings/(setup)/components/environment-id-field";
import { SetupInstructions } from "@/modules/projects/settings/(setup)/components/setup-instructions";
import { ProjectConfigNavigation } from "@/modules/projects/settings/components/project-config-navigation";
@@ -31,18 +27,10 @@ export const AppConnectionPage = async (props) => {
throw new Error(t("common.organization_not_found"));
}
const isMultiLanguageAllowed = await getMultiLanguagePermission(organization.billing.plan);
const canDoRoleManagement = await getRoleManagementPermission(organization.billing.plan);
return (
<PageContentWrapper>
<PageHeader pageTitle={t("common.configuration")}>
<ProjectConfigNavigation
environmentId={params.environmentId}
activeId="app-connection"
isMultiLanguageAllowed={isMultiLanguageAllowed}
canDoRoleManagement={canDoRoleManagement}
/>
<PageHeader pageTitle={t("common.project_configuration")}>
<ProjectConfigNavigation environmentId={params.environmentId} activeId="app-connection" />
</PageHeader>
<div className="space-y-4">
<EnvironmentNotice environmentId={params.environmentId} subPageUrl="/project/app-connection" />
apps/web/modules/projects/settings/api-keys/loading.tsx
+1 -1
View File
@@ -42,7 +42,7 @@ export const APIKeysLoading = () => {
const { t } = useTranslate();
return (
<PageContentWrapper>
<PageHeader pageTitle={t("common.configuration")}>
<PageHeader pageTitle={t("common.project_configuration")}>
<ProjectConfigNavigation activeId="api-keys" loading />
</PageHeader>
<div className="mt-4 flex max-w-4xl animate-pulse items-center space-y-4 rounded-lg border bg-blue-50 p-6 text-sm text-blue-900 shadow-sm md:space-y-0 md:text-base"></div>
apps/web/modules/projects/settings/api-keys/page.tsx
+2 -14
View File
@@ -1,9 +1,5 @@
import { SettingsCard } from "@/app/(app)/environments/[environmentId]/settings/components/SettingsCard";
import { authOptions } from "@/modules/auth/lib/authOptions";
import {
getMultiLanguagePermission,
getRoleManagementPermission,
} from "@/modules/ee/license-check/lib/utils";
import { getProjectPermissionByUserId } from "@/modules/ee/teams/lib/roles";
import { getTeamPermissionFlags } from "@/modules/ee/teams/utils/teams";
import { ProjectConfigNavigation } from "@/modules/projects/settings/components/project-config-navigation";
@@ -53,18 +49,10 @@ export const APIKeysPage = async (props) => {
const isReadOnly = isMember && !hasManageAccess;
const isMultiLanguageAllowed = await getMultiLanguagePermission(organization.billing.plan);
const canDoRoleManagement = await getRoleManagementPermission(organization.billing.plan);
return (
<PageContentWrapper>
<PageHeader pageTitle={t("common.configuration")}>
<ProjectConfigNavigation
environmentId={params.environmentId}
activeId="api-keys"
isMultiLanguageAllowed={isMultiLanguageAllowed}
canDoRoleManagement={canDoRoleManagement}
/>
<PageHeader pageTitle={t("common.project_configuration")}>
<ProjectConfigNavigation environmentId={params.environmentId} activeId="api-keys" />
</PageHeader>
<EnvironmentNotice environmentId={environment.id} subPageUrl="/project/api-keys" />
{environment.type === "development" ? (
apps/web/modules/projects/settings/components/project-config-navigation.tsx
+1 -6
View File
@@ -8,17 +8,13 @@ import { usePathname } from "next/navigation";
interface ProjectConfigNavigationProps {
activeId: string;
environmentId?: string;
isMultiLanguageAllowed?: boolean;
loading?: boolean;
canDoRoleManagement?: boolean;
}
export const ProjectConfigNavigation = ({
activeId,
environmentId,
isMultiLanguageAllowed,
loading,
canDoRoleManagement,
}: ProjectConfigNavigationProps) => {
const { t } = useTranslate();
const pathname = usePathname();
@@ -43,7 +39,6 @@ export const ProjectConfigNavigation = ({
label: t("common.survey_languages"),
icon: <LanguagesIcon className="h-5 w-5" />,
href: `/environments/${environmentId}/project/languages`,
hidden: !isMultiLanguageAllowed,
current: pathname?.includes("/languages"),
},
{
@@ -70,8 +65,8 @@ export const ProjectConfigNavigation = ({
{
id: "teams",
label: t("common.team_access"),
icon: <UsersIcon className="h-5 w-5" />,
href: `/environments/${environmentId}/project/teams`,
hidden: !canDoRoleManagement,
current: pathname?.includes("/teams"),
},
];
apps/web/modules/projects/settings/general/loading.tsx
+1 -1
View File
@@ -28,7 +28,7 @@ export const GeneralSettingsLoading = () => {
return (
<PageContentWrapper>
<PageHeader pageTitle={t("common.configuration")}>
<PageHeader pageTitle={t("common.project_configuration")}>
<ProjectConfigNavigation activeId="general" loading />
</PageHeader>
{cards.map((card, index) => (
apps/web/modules/projects/settings/general/page.tsx
+1 -14
View File
@@ -1,9 +1,5 @@
import { SettingsCard } from "@/app/(app)/environments/[environmentId]/settings/components/SettingsCard";
import { authOptions } from "@/modules/auth/lib/authOptions";
import {
getMultiLanguagePermission,
getRoleManagementPermission,
} from "@/modules/ee/license-check/lib/utils";
import { getProjectPermissionByUserId } from "@/modules/ee/teams/lib/roles";
import { getTeamPermissionFlags } from "@/modules/ee/teams/utils/teams";
import { ProjectConfigNavigation } from "@/modules/projects/settings/components/project-config-navigation";
@@ -51,21 +47,12 @@ export const GeneralSettingsPage = async (props: { params: Promise<{ environment
const isReadOnly = isMember && !hasManageAccess;
const isMultiLanguageAllowed = await getMultiLanguagePermission(organization.billing.plan);
const canDoRoleManagement = await getRoleManagementPermission(organization.billing.plan);
const isOwnerOrManager = isOwner || isManager;
return (
<PageContentWrapper>
<PageHeader pageTitle={t("common.project_configuration")}>
{/* </PageHeader><PageHeader pageTitle={t("common.configuration")}> */}
<ProjectConfigNavigation
environmentId={params.environmentId}
activeId="general"
isMultiLanguageAllowed={isMultiLanguageAllowed}
canDoRoleManagement={canDoRoleManagement}
/>
<ProjectConfigNavigation environmentId={params.environmentId} activeId="general" />
</PageHeader>
<SettingsCard
title={t("common.project_name")}
apps/web/modules/projects/settings/layout.tsx
+1 -1
View File
@@ -9,7 +9,7 @@ import { getOrganizationByEnvironmentId } from "@formbricks/lib/organization/ser
import { getProjectByEnvironmentId } from "@formbricks/lib/project/service";
export const metadata: Metadata = {
title: "Config",
title: "Configuration",
};
export const ProjectSettingsLayout = async (props) => {
apps/web/modules/projects/settings/look/loading.tsx
+1 -1
View File
@@ -24,7 +24,7 @@ export const ProjectLookSettingsLoading = () => {
const { t } = useTranslate();
return (
<PageContentWrapper>
<PageHeader pageTitle={t("common.configuration")}>
<PageHeader pageTitle={t("common.project_configuration")}>
<ProjectConfigNavigation activeId="look" loading />
</PageHeader>
<SettingsCard
apps/web/modules/projects/settings/look/page.tsx
+3 -15
View File
@@ -1,10 +1,6 @@
import { SettingsCard } from "@/app/(app)/environments/[environmentId]/settings/components/SettingsCard";
import { authOptions } from "@/modules/auth/lib/authOptions";
import {
getMultiLanguagePermission,
getRoleManagementPermission,
getWhiteLabelPermission,
} from "@/modules/ee/license-check/lib/utils";
import { getWhiteLabelPermission } from "@/modules/ee/license-check/lib/utils";
import { getProjectPermissionByUserId } from "@/modules/ee/teams/lib/roles";
import { getTeamPermissionFlags } from "@/modules/ee/teams/utils/teams";
import { BrandingSettingsCard } from "@/modules/ee/whitelabel/remove-branding/components/branding-settings-card";
@@ -51,18 +47,10 @@ export const ProjectLookSettingsPage = async (props: { params: Promise<{ environ
const isReadOnly = isMember && !hasManageAccess;
const isMultiLanguageAllowed = await getMultiLanguagePermission(organization.billing.plan);
const canDoRoleManagement = await getRoleManagementPermission(organization.billing.plan);
return (
<PageContentWrapper>
<PageHeader pageTitle={t("common.configuration")}>
<ProjectConfigNavigation
environmentId={params.environmentId}
activeId="look"
isMultiLanguageAllowed={isMultiLanguageAllowed}
canDoRoleManagement={canDoRoleManagement}
/>
<PageHeader pageTitle={t("common.project_configuration")}>
<ProjectConfigNavigation environmentId={params.environmentId} activeId="look" />
</PageHeader>
<SettingsCard
title={t("environments.project.look.theme")}
apps/web/modules/projects/settings/tags/loading.tsx
+1 -1
View File
@@ -10,7 +10,7 @@ export const TagsLoading = () => {
const { t } = useTranslate();
return (
<PageContentWrapper>
<PageHeader pageTitle={t("common.configuration")}>
<PageHeader pageTitle={t("common.project_configuration")}>
<ProjectConfigNavigation activeId="tags" />
</PageHeader>
<SettingsCard
apps/web/modules/projects/settings/tags/page.tsx
+2 -14
View File
@@ -1,9 +1,5 @@
import { SettingsCard } from "@/app/(app)/environments/[environmentId]/settings/components/SettingsCard";
import { authOptions } from "@/modules/auth/lib/authOptions";
import {
getMultiLanguagePermission,
getRoleManagementPermission,
} from "@/modules/ee/license-check/lib/utils";
import { getProjectPermissionByUserId } from "@/modules/ee/teams/lib/roles";
import { getTeamPermissionFlags } from "@/modules/ee/teams/utils/teams";
import { ProjectConfigNavigation } from "@/modules/projects/settings/components/project-config-navigation";
@@ -59,18 +55,10 @@ export const TagsPage = async (props) => {
const isReadOnly = isMember && !hasManageAccess;
const isMultiLanguageAllowed = await getMultiLanguagePermission(organization.billing.plan);
const canDoRoleManagement = await getRoleManagementPermission(organization.billing.plan);
return (
<PageContentWrapper>
<PageHeader pageTitle={t("common.configuration")}>
<ProjectConfigNavigation
environmentId={params.environmentId}
activeId="tags"
isMultiLanguageAllowed={isMultiLanguageAllowed}
canDoRoleManagement={canDoRoleManagement}
/>
<PageHeader pageTitle={t("common.project_configuration")}>
<ProjectConfigNavigation environmentId={params.environmentId} activeId="tags" />
</PageHeader>
<SettingsCard
title={t("environments.project.tags.manage_tags")}
apps/web/modules/survey/editor/components/targeting-locked-card.tsx
+1 -1
View File
@@ -43,7 +43,7 @@ export const TargetingLockedCard = ({ isFormbricksCloud, environmentId }: Target
description={t("environments.surveys.edit.unlock_targeting_description")}
buttons={[
{
text: t("common.start_free_trial"),
text: isFormbricksCloud ? t("common.start_free_trial") : t("common.request_trial_license"),
href: isFormbricksCloud
? `/environments/${environmentId}/settings/billing`
: "https://formbricks.com/upgrade-self-hosting-license",
apps/web/modules/ui/components/icons/slack-icon.tsx
+2 -2
View File
@@ -8,8 +8,8 @@ export const SlackIcon: React.FC<React.SVGProps<SVGSVGElement>> = (props) => {
fill="none"
stroke="currentColor"
strokeWidth="2"
stroke-linecap="round"
stroke-linejoin="round"
strokeLinecap="round"
strokeLinejoin="round"
{...props}>
<rect width="3" height="8" x="13" y="2" rx="1.5" />
<path d="M19 8.5V10h1.5A1.5 1.5 0 1 0 19 8.5" />
apps/web/modules/ui/components/secondary-navigation/index.tsx
+61 -66
View File
@@ -16,77 +16,72 @@ interface SecondaryNavbarProps {
export const SecondaryNavigation = ({ navigation, activeId, loading, ...props }: SecondaryNavbarProps) => {
return (
<div {...props}>
<div className="grid h-10 w-full grid-cols-[auto,1fr]">
<nav className="flex h-full min-w-full items-center space-x-4" aria-label="Tabs">
{loading
? navigation.map((navElem) => (
<div className="group flex h-full flex-col" key={navElem.id}>
<div
aria-disabled="true"
className={cn(
navElem.id === activeId ? "font-semibold text-slate-900" : "text-slate-500",
"flex h-full items-center px-3 text-sm font-medium",
navElem.hidden && "hidden"
)}
aria-current={navElem.id === activeId ? "page" : undefined}>
{navElem.label}
</div>
<div
className={cn(
"bottom-0 mt-auto h-[2px] w-full rounded-t-lg transition-all duration-150 ease-in-out",
navElem.id === activeId ? "bg-slate-300" : "bg-transparent group-hover:bg-slate-300",
navElem.hidden && "hidden"
)}
/>
<nav className="flex h-10 w-full items-center space-x-4" aria-label="Tabs">
{loading
? navigation.map((navElem) => (
<div className="group flex h-full flex-col truncate" key={navElem.id}>
<div
aria-disabled="true"
className={cn(
navElem.id === activeId ? "font-semibold text-slate-900" : "text-slate-500",
"flex h-full items-center truncate px-3 text-sm font-medium",
navElem.hidden && "hidden"
)}
aria-current={navElem.id === activeId ? "page" : undefined}>
{navElem.label}
</div>
))
: navigation.map(
(navElem) =>
!navElem.hidden && (
<div className="group flex h-full flex-col" key={navElem.id}>
{navElem.href ? (
<Link
href={navElem.href}
{...(navElem.onClick ? { onClick: navElem.onClick } : {})}
className={cn(
navElem.id === activeId
? "font-semibold text-slate-900"
: "text-slate-500 hover:text-slate-700",
"flex h-full items-center px-3 text-sm font-medium",
navElem.hidden && "hidden"
)}
aria-current={navElem.id === activeId ? "page" : undefined}>
{navElem.label}
</Link>
) : (
<button
{...(navElem.onClick ? { onClick: navElem.onClick } : {})}
className={cn(
navElem.id === activeId
? "font-semibold text-slate-900"
: "text-slate-500 hover:text-slate-700",
"grow items-center px-3 text-sm font-medium transition-all duration-150 ease-in-out",
navElem.hidden && "hidden"
)}
aria-current={navElem.id === activeId ? "page" : undefined}>
{navElem.label}
</button>
)}
<div
<div
className={cn(
"bottom-0 mt-auto h-[2px] w-full rounded-t-lg transition-all duration-150 ease-in-out",
navElem.id === activeId ? "bg-slate-300" : "bg-transparent group-hover:bg-slate-300",
navElem.hidden && "hidden"
)}
/>
</div>
))
: navigation.map(
(navElem) =>
!navElem.hidden && (
<div className="group flex h-full flex-col truncate" key={navElem.id}>
{navElem.href ? (
<Link
href={navElem.href}
{...(navElem.onClick ? { onClick: navElem.onClick } : {})}
className={cn(
"bottom-0 mt-auto h-[2px] w-full rounded-t-lg transition-all duration-150 ease-in-out",
navElem.id === activeId
? "bg-brand-dark"
: "bg-transparent group-hover:bg-slate-300",
? "font-semibold text-slate-900"
: "text-slate-500 hover:text-slate-700",
"flex h-full items-center px-3 text-sm font-medium",
navElem.hidden && "hidden"
)}
/>
</div>
)
)}
</nav>
<div className="justify-self-end"></div>
</div>
aria-current={navElem.id === activeId ? "page" : undefined}>
{navElem.label}
</Link>
) : (
<button
{...(navElem.onClick ? { onClick: navElem.onClick } : {})}
className={cn(
navElem.id === activeId
? "font-semibold text-slate-900"
: "text-slate-500 hover:text-slate-700",
"grow items-center px-3 text-sm font-medium transition-all duration-150 ease-in-out",
navElem.hidden && "hidden"
)}
aria-current={navElem.id === activeId ? "page" : undefined}>
{navElem.label}
</button>
)}
<div
className={cn(
"bottom-0 mt-auto h-[2px] w-full rounded-t-lg transition-all duration-150 ease-in-out",
navElem.id === activeId ? "bg-brand-dark" : "bg-transparent group-hover:bg-slate-300",
navElem.hidden && "hidden"
)}
/>
</div>
)
)}
</nav>
</div>
);
};