mirror of
https://github.com/formbricks/formbricks.git
synced 2026-04-20 02:30:18 -05:00
Compare commits
8 Commits
feat/unify
...
4.7.1
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
5b776b04b1 | ||
|
|
e3f3516fa7 | ||
|
|
91486f3dc9 | ||
|
|
8b9179bfcc | ||
|
|
1b337aeac3 | ||
|
|
cd64848cc5 | ||
|
|
42411694a7 | ||
|
|
721d972901 |
@@ -1,9 +0,0 @@
|
|||||||
# THIS IS AUTOGENERATED. DO NOT EDIT MANUALLY
|
|
||||||
version = 1
|
|
||||||
name = "formbricks"
|
|
||||||
|
|
||||||
[setup]
|
|
||||||
script = '''
|
|
||||||
pnpm install
|
|
||||||
pnpm dev:setup
|
|
||||||
'''
|
|
||||||
42
.env.example
42
.env.example
@@ -94,12 +94,6 @@ EMAIL_VERIFICATION_DISABLED=1
|
|||||||
# Password Reset. If you enable Password Reset functionality you have to setup SMTP-Settings, too.
|
# Password Reset. If you enable Password Reset functionality you have to setup SMTP-Settings, too.
|
||||||
PASSWORD_RESET_DISABLED=1
|
PASSWORD_RESET_DISABLED=1
|
||||||
|
|
||||||
# Password reset token lifetime in minutes. Must be between 5 and 120 if set.
|
|
||||||
# PASSWORD_RESET_TOKEN_LIFETIME_MINUTES=30
|
|
||||||
|
|
||||||
# Development-only helper: log the password reset link to the server console instead of sending reset emails.
|
|
||||||
# DEBUG_SHOW_RESET_LINK=1
|
|
||||||
|
|
||||||
# Email login. Disable the ability for users to login with email.
|
# Email login. Disable the ability for users to login with email.
|
||||||
# EMAIL_AUTH_DISABLED=1
|
# EMAIL_AUTH_DISABLED=1
|
||||||
|
|
||||||
@@ -138,31 +132,6 @@ AZUREAD_CLIENT_ID=
|
|||||||
AZUREAD_CLIENT_SECRET=
|
AZUREAD_CLIENT_SECRET=
|
||||||
AZUREAD_TENANT_ID=
|
AZUREAD_TENANT_ID=
|
||||||
|
|
||||||
# Configure Formbricks AI at the instance level
|
|
||||||
# Set the provider used for AI features on this instance.
|
|
||||||
# Accepted values for AI_PROVIDER: aws, gcp, azure
|
|
||||||
# Set AI_MODEL to the provider-specific model or deployment name and configure the matching credentials below.
|
|
||||||
# AI_PROVIDER=gcp
|
|
||||||
# AI_MODEL=gemini-2.5-flash
|
|
||||||
|
|
||||||
# Google Vertex AI credentials
|
|
||||||
# AI_GCP_PROJECT=
|
|
||||||
# AI_GCP_LOCATION=
|
|
||||||
# AI_GCP_CREDENTIALS_JSON=
|
|
||||||
# AI_GCP_APPLICATION_CREDENTIALS=
|
|
||||||
|
|
||||||
# Amazon Bedrock credentials
|
|
||||||
# AI_AWS_REGION=
|
|
||||||
# AI_AWS_ACCESS_KEY_ID=
|
|
||||||
# AI_AWS_SECRET_ACCESS_KEY=
|
|
||||||
# AI_AWS_SESSION_TOKEN=
|
|
||||||
|
|
||||||
# Azure AI / Microsoft Foundry credentials
|
|
||||||
# AI_AZURE_BASE_URL=
|
|
||||||
# AI_AZURE_RESOURCE_NAME=
|
|
||||||
# AI_AZURE_API_KEY=
|
|
||||||
# AI_AZURE_API_VERSION=v1
|
|
||||||
|
|
||||||
# OpenID Connect (OIDC) configuration
|
# OpenID Connect (OIDC) configuration
|
||||||
# OIDC_CLIENT_ID=
|
# OIDC_CLIENT_ID=
|
||||||
# OIDC_CLIENT_SECRET=
|
# OIDC_CLIENT_SECRET=
|
||||||
@@ -181,7 +150,6 @@ NOTION_OAUTH_CLIENT_ID=
|
|||||||
NOTION_OAUTH_CLIENT_SECRET=
|
NOTION_OAUTH_CLIENT_SECRET=
|
||||||
|
|
||||||
# Stripe Billing Variables
|
# Stripe Billing Variables
|
||||||
STRIPE_PUBLISHABLE_KEY=
|
|
||||||
STRIPE_SECRET_KEY=
|
STRIPE_SECRET_KEY=
|
||||||
STRIPE_WEBHOOK_SECRET=
|
STRIPE_WEBHOOK_SECRET=
|
||||||
|
|
||||||
@@ -216,14 +184,6 @@ ENTERPRISE_LICENSE_KEY=
|
|||||||
# Ignore Rate Limiting across the Formbricks app
|
# Ignore Rate Limiting across the Formbricks app
|
||||||
# RATE_LIMITING_DISABLED=1
|
# RATE_LIMITING_DISABLED=1
|
||||||
|
|
||||||
# Disable telemetry reporting (usage stats sent to Formbricks). Ignored when an EE license is active.
|
|
||||||
# TELEMETRY_DISABLED=1
|
|
||||||
|
|
||||||
# Allow webhook URLs to point to internal/private network addresses (e.g. localhost, 192.168.x.x)
|
|
||||||
# WARNING: Only enable this if you understand the SSRF risks. Useful for self-hosted instances
|
|
||||||
# that need to send webhooks to internal services.
|
|
||||||
# DANGEROUSLY_ALLOW_WEBHOOK_INTERNAL_URLS=1
|
|
||||||
|
|
||||||
# OpenTelemetry OTLP endpoint (base URL, exporters append /v1/traces and /v1/metrics)
|
# OpenTelemetry OTLP endpoint (base URL, exporters append /v1/traces and /v1/metrics)
|
||||||
# OTEL_EXPORTER_OTLP_ENDPOINT=http://localhost:4318
|
# OTEL_EXPORTER_OTLP_ENDPOINT=http://localhost:4318
|
||||||
# OTEL_EXPORTER_OTLP_PROTOCOL=http/protobuf
|
# OTEL_EXPORTER_OTLP_PROTOCOL=http/protobuf
|
||||||
@@ -270,4 +230,4 @@ REDIS_URL=redis://localhost:6379
|
|||||||
|
|
||||||
|
|
||||||
# Lingo.dev API key for translation generation
|
# Lingo.dev API key for translation generation
|
||||||
LINGO_API_KEY=your_api_key_here
|
LINGODOTDEV_API_KEY=your_api_key_here
|
||||||
@@ -285,14 +285,12 @@ runs:
|
|||||||
encryption_key=${{ env.DUMMY_ENCRYPTION_KEY }}
|
encryption_key=${{ env.DUMMY_ENCRYPTION_KEY }}
|
||||||
redis_url=${{ env.DUMMY_REDIS_URL }}
|
redis_url=${{ env.DUMMY_REDIS_URL }}
|
||||||
sentry_auth_token=${{ env.SENTRY_AUTH_TOKEN }}
|
sentry_auth_token=${{ env.SENTRY_AUTH_TOKEN }}
|
||||||
posthog_key=${{ env.POSTHOG_KEY }}
|
|
||||||
env:
|
env:
|
||||||
DEPOT_PROJECT_TOKEN: ${{ env.DEPOT_PROJECT_TOKEN }}
|
DEPOT_PROJECT_TOKEN: ${{ env.DEPOT_PROJECT_TOKEN }}
|
||||||
DUMMY_DATABASE_URL: ${{ env.DUMMY_DATABASE_URL }}
|
DUMMY_DATABASE_URL: ${{ env.DUMMY_DATABASE_URL }}
|
||||||
DUMMY_ENCRYPTION_KEY: ${{ env.DUMMY_ENCRYPTION_KEY }}
|
DUMMY_ENCRYPTION_KEY: ${{ env.DUMMY_ENCRYPTION_KEY }}
|
||||||
DUMMY_REDIS_URL: ${{ env.DUMMY_REDIS_URL }}
|
DUMMY_REDIS_URL: ${{ env.DUMMY_REDIS_URL }}
|
||||||
SENTRY_AUTH_TOKEN: ${{ env.SENTRY_AUTH_TOKEN }}
|
SENTRY_AUTH_TOKEN: ${{ env.SENTRY_AUTH_TOKEN }}
|
||||||
POSTHOG_KEY: ${{ env.POSTHOG_KEY }}
|
|
||||||
|
|
||||||
- name: Sign GHCR image (GHCR only)
|
- name: Sign GHCR image (GHCR only)
|
||||||
if: ${{ inputs.registry_type == 'ghcr' && (github.event_name == 'workflow_call' || github.event_name == 'release' || github.event_name == 'workflow_dispatch') }}
|
if: ${{ inputs.registry_type == 'ghcr' && (github.event_name == 'workflow_call' || github.event_name == 'release' || github.event_name == 'workflow_dispatch') }}
|
||||||
|
|||||||
1
.github/workflows/build-and-push-ecr.yml
vendored
1
.github/workflows/build-and-push-ecr.yml
vendored
@@ -92,4 +92,3 @@ jobs:
|
|||||||
DUMMY_ENCRYPTION_KEY: ${{ secrets.DUMMY_ENCRYPTION_KEY }}
|
DUMMY_ENCRYPTION_KEY: ${{ secrets.DUMMY_ENCRYPTION_KEY }}
|
||||||
DUMMY_REDIS_URL: ${{ secrets.DUMMY_REDIS_URL }}
|
DUMMY_REDIS_URL: ${{ secrets.DUMMY_REDIS_URL }}
|
||||||
SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }}
|
SENTRY_AUTH_TOKEN: ${{ secrets.SENTRY_AUTH_TOKEN }}
|
||||||
POSTHOG_KEY: ${{ secrets.POSTHOG_KEY }}
|
|
||||||
|
|||||||
42
.github/workflows/translation-check.yml
vendored
42
.github/workflows/translation-check.yml
vendored
@@ -6,9 +6,19 @@ permissions:
|
|||||||
on:
|
on:
|
||||||
pull_request:
|
pull_request:
|
||||||
types: [opened, synchronize, reopened]
|
types: [opened, synchronize, reopened]
|
||||||
|
paths:
|
||||||
|
- "apps/web/**/*.ts"
|
||||||
|
- "apps/web/**/*.tsx"
|
||||||
|
- "apps/web/locales/**/*.json"
|
||||||
|
- "scan-translations.ts"
|
||||||
push:
|
push:
|
||||||
branches:
|
branches:
|
||||||
- main
|
- main
|
||||||
|
paths:
|
||||||
|
- "apps/web/**/*.ts"
|
||||||
|
- "apps/web/**/*.tsx"
|
||||||
|
- "apps/web/locales/**/*.json"
|
||||||
|
- "scan-translations.ts"
|
||||||
|
|
||||||
jobs:
|
jobs:
|
||||||
validate-translations:
|
validate-translations:
|
||||||
@@ -23,38 +33,30 @@ jobs:
|
|||||||
egress-policy: audit
|
egress-policy: audit
|
||||||
|
|
||||||
- uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2
|
- uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683 # v4.2.2
|
||||||
|
|
||||||
- name: Check for relevant changes
|
|
||||||
id: changes
|
|
||||||
uses: dorny/paths-filter@de90cc6fb38fc0963ad72b210f1f284cd68cea36 # v3.0.2
|
|
||||||
with:
|
with:
|
||||||
filters: |
|
fetch-depth: 0 # Shallow clones should be disabled for a better relevancy of analysis
|
||||||
translations:
|
|
||||||
- 'apps/web/**/*.ts'
|
|
||||||
- 'apps/web/**/*.tsx'
|
|
||||||
- 'apps/web/locales/**/*.json'
|
|
||||||
- 'packages/surveys/src/**/*.{ts,tsx}'
|
|
||||||
- 'packages/surveys/locales/**/*.json'
|
|
||||||
- 'packages/email/**/*.{ts,tsx}'
|
|
||||||
|
|
||||||
- name: Setup Node.js 22.x
|
- name: Setup Node.js 22.x
|
||||||
if: steps.changes.outputs.translations == 'true'
|
|
||||||
uses: actions/setup-node@39370e3970a6d050c480ffad4ff0ed4d3fdee5af
|
uses: actions/setup-node@39370e3970a6d050c480ffad4ff0ed4d3fdee5af
|
||||||
with:
|
with:
|
||||||
node-version: 22.x
|
node-version: 22.x
|
||||||
|
|
||||||
- name: Install pnpm
|
- name: Install pnpm
|
||||||
if: steps.changes.outputs.translations == 'true'
|
|
||||||
uses: pnpm/action-setup@a7487c7e89a18df4991f7f222e4898a00d66ddda # v4.1.0
|
uses: pnpm/action-setup@a7487c7e89a18df4991f7f222e4898a00d66ddda # v4.1.0
|
||||||
|
|
||||||
- name: Install dependencies
|
- name: Install dependencies
|
||||||
if: steps.changes.outputs.translations == 'true'
|
|
||||||
run: pnpm install --config.platform=linux --config.architecture=x64
|
run: pnpm install --config.platform=linux --config.architecture=x64
|
||||||
|
|
||||||
- name: Validate translation keys
|
- name: Validate translation keys
|
||||||
if: steps.changes.outputs.translations == 'true'
|
run: |
|
||||||
run: pnpm run scan-translations
|
echo ""
|
||||||
|
echo "🔍 Validating translation keys..."
|
||||||
|
echo ""
|
||||||
|
pnpm run scan-translations
|
||||||
|
|
||||||
- name: Skip (no translation-related changes)
|
- name: Summary
|
||||||
if: steps.changes.outputs.translations != 'true'
|
if: success()
|
||||||
run: echo "No translation-related files changed — skipping validation."
|
run: |
|
||||||
|
echo ""
|
||||||
|
echo "✅ Translation validation completed successfully!"
|
||||||
|
echo ""
|
||||||
|
|||||||
2
.gitignore
vendored
2
.gitignore
vendored
@@ -45,7 +45,7 @@ yarn-error.log*
|
|||||||
.direnv
|
.direnv
|
||||||
|
|
||||||
# Playwright
|
# Playwright
|
||||||
**/test-results/
|
/test-results/
|
||||||
/playwright-report/
|
/playwright-report/
|
||||||
/blob-report/
|
/blob-report/
|
||||||
/playwright/.cache/
|
/playwright/.cache/
|
||||||
|
|||||||
2
.husky/post-checkout
Normal file
2
.husky/post-checkout
Normal file
@@ -0,0 +1,2 @@
|
|||||||
|
echo "{\"branchName\": \"$(git rev-parse --abbrev-ref HEAD)\"}" > ./branch.json
|
||||||
|
prettier --write ./branch.json
|
||||||
@@ -1 +1,40 @@
|
|||||||
pnpm lint-staged
|
# Load environment variables from .env files
|
||||||
|
if [ -f .env ]; then
|
||||||
|
set -a
|
||||||
|
. .env
|
||||||
|
set +a
|
||||||
|
fi
|
||||||
|
|
||||||
|
pnpm lint-staged
|
||||||
|
|
||||||
|
# Run Lingo.dev i18n workflow if LINGODOTDEV_API_KEY is set
|
||||||
|
if [ -n "$LINGODOTDEV_API_KEY" ]; then
|
||||||
|
echo ""
|
||||||
|
echo "🌍 Running Lingo.dev translation workflow..."
|
||||||
|
echo ""
|
||||||
|
|
||||||
|
# Run translation generation and validation
|
||||||
|
if pnpm run i18n; then
|
||||||
|
echo ""
|
||||||
|
echo "✅ Translation validation passed"
|
||||||
|
echo ""
|
||||||
|
# Add updated locale files to git
|
||||||
|
git add apps/web/locales/*.json
|
||||||
|
else
|
||||||
|
echo ""
|
||||||
|
echo "❌ Translation validation failed!"
|
||||||
|
echo ""
|
||||||
|
echo "Please fix the translation issues above before committing:"
|
||||||
|
echo " • Add missing translation keys to your locale files"
|
||||||
|
echo " • Remove unused translation keys"
|
||||||
|
echo ""
|
||||||
|
echo "Or run 'pnpm i18n' to see the detailed report"
|
||||||
|
echo ""
|
||||||
|
exit 1
|
||||||
|
fi
|
||||||
|
else
|
||||||
|
echo ""
|
||||||
|
echo "⚠️ Skipping translation validation: LINGODOTDEV_API_KEY is not set"
|
||||||
|
echo " (This is expected for community contributors)"
|
||||||
|
echo ""
|
||||||
|
fi
|
||||||
@@ -52,14 +52,6 @@ We are using SonarQube to identify code smells and security hotspots.
|
|||||||
- Translations are in `apps/web/locales/`. Default is `en-US.json`.
|
- Translations are in `apps/web/locales/`. Default is `en-US.json`.
|
||||||
- Lingo.dev is automatically translating strings from en-US into other languages on commit. Run `pnpm i18n` to generate missing translations and validate keys.
|
- Lingo.dev is automatically translating strings from en-US into other languages on commit. Run `pnpm i18n` to generate missing translations and validate keys.
|
||||||
|
|
||||||
## Date and Time Rendering
|
|
||||||
|
|
||||||
- All user-facing dates and times must use shared formatting helpers instead of ad hoc `date-fns`, `Intl`, or `toLocale*` calls in components.
|
|
||||||
- Locale for display must come from the app language source of truth (`user.locale`, `getLocale()`, or `i18n.resolvedLanguage`), not browser defaults or implicit `undefined` locale behavior.
|
|
||||||
- Locale and time zone are different concerns: locale controls formatting, time zone controls the represented clock/calendar moment.
|
|
||||||
- Never infer a time zone from locale. If a product-level time zone source of truth exists, use it explicitly; otherwise preserve the existing semantic meaning of the stored value and avoid introducing browser-dependent conversions.
|
|
||||||
- Machine-facing values for storage, APIs, exports, integrations, and logs must remain stable and non-localized (`ISO 8601` / UTC where applicable).
|
|
||||||
|
|
||||||
## Database & Prisma Performance
|
## Database & Prisma Performance
|
||||||
|
|
||||||
- Multi-tenancy: All data must be scoped by Organization or Environment.
|
- Multi-tenancy: All data must be scoped by Organization or Environment.
|
||||||
|
|||||||
26
README.md
26
README.md
@@ -127,10 +127,34 @@ Formbricks has a hosted cloud offering with a generous free plan to get you up a
|
|||||||
|
|
||||||
Formbricks is available Open-Source under AGPLv3 license. You can host Formbricks on your own servers using Docker without a subscription.
|
Formbricks is available Open-Source under AGPLv3 license. You can host Formbricks on your own servers using Docker without a subscription.
|
||||||
|
|
||||||
|
If you opt for self-hosting Formbricks, here are a few options to consider:
|
||||||
|
|
||||||
#### Docker
|
#### Docker
|
||||||
|
|
||||||
To get started with self-hosting with Docker, take a look at our [self-hosting docs](https://formbricks.com/docs/self-hosting/deployment).
|
To get started with self-hosting with Docker, take a look at our [self-hosting docs](https://formbricks.com/docs/self-hosting/deployment).
|
||||||
|
|
||||||
|
#### Community-managed One Click Hosting
|
||||||
|
|
||||||
|
##### Railway
|
||||||
|
|
||||||
|
You can deploy Formbricks on [Railway](https://railway.app) using the button below.
|
||||||
|
|
||||||
|
[](https://railway.app/new/template/PPDzCd)
|
||||||
|
|
||||||
|
##### RepoCloud
|
||||||
|
|
||||||
|
Or you can also deploy Formbricks on [RepoCloud](https://repocloud.io) using the button below.
|
||||||
|
|
||||||
|
[](https://repocloud.io/details/?app_id=254)
|
||||||
|
|
||||||
|
##### Zeabur
|
||||||
|
|
||||||
|
Or you can also deploy Formbricks on [Zeabur](https://zeabur.com) using the button below.
|
||||||
|
|
||||||
|
[](https://zeabur.com/templates/G4TUJL)
|
||||||
|
|
||||||
|
<a id="development"></a>
|
||||||
|
|
||||||
## 👨💻 Development
|
## 👨💻 Development
|
||||||
|
|
||||||
### Prerequisites
|
### Prerequisites
|
||||||
@@ -223,4 +247,4 @@ We currently do not offer Formbricks white-labeled. That means that we don't sel
|
|||||||
|
|
||||||
The Enterprise Edition allows us to fund the development of Formbricks sustainably. It guarantees that the free and open-source surveying infrastructure we're building will be around for decades to come.
|
The Enterprise Edition allows us to fund the development of Formbricks sustainably. It guarantees that the free and open-source surveying infrastructure we're building will be around for decades to come.
|
||||||
|
|
||||||
<a id="readme-de"></a>
|
<p align="right"><a href="#top">🔼 Back to top</a></p>
|
||||||
|
|||||||
@@ -10,20 +10,25 @@
|
|||||||
"build-storybook": "storybook build",
|
"build-storybook": "storybook build",
|
||||||
"clean": "rimraf .turbo node_modules dist storybook-static"
|
"clean": "rimraf .turbo node_modules dist storybook-static"
|
||||||
},
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"@formbricks/survey-ui": "workspace:*"
|
||||||
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@chromatic-com/storybook": "^5.0.1",
|
"@chromatic-com/storybook": "^5.0.0",
|
||||||
"@storybook/addon-a11y": "10.2.17",
|
"@storybook/addon-a11y": "10.1.11",
|
||||||
"@storybook/addon-links": "10.2.17",
|
"@storybook/addon-links": "10.1.11",
|
||||||
"@storybook/addon-onboarding": "10.2.17",
|
"@storybook/addon-onboarding": "10.1.11",
|
||||||
"@storybook/react-vite": "10.2.17",
|
"@storybook/react-vite": "10.1.11",
|
||||||
"@typescript-eslint/eslint-plugin": "8.57.0",
|
"@typescript-eslint/eslint-plugin": "8.53.0",
|
||||||
"@tailwindcss/vite": "4.2.1",
|
"@tailwindcss/vite": "4.1.18",
|
||||||
"@typescript-eslint/parser": "8.57.0",
|
"@typescript-eslint/parser": "8.53.0",
|
||||||
"@vitejs/plugin-react": "5.1.4",
|
"@vitejs/plugin-react": "5.1.2",
|
||||||
|
"esbuild": "0.25.12",
|
||||||
"eslint-plugin-react-refresh": "0.4.26",
|
"eslint-plugin-react-refresh": "0.4.26",
|
||||||
"eslint-plugin-storybook": "10.2.17",
|
"eslint-plugin-storybook": "10.1.11",
|
||||||
"storybook": "10.2.17",
|
"prop-types": "15.8.1",
|
||||||
|
"storybook": "10.1.11",
|
||||||
"vite": "7.3.1",
|
"vite": "7.3.1",
|
||||||
"@storybook/addon-docs": "10.2.17"
|
"@storybook/addon-docs": "10.1.11"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,6 +0,0 @@
|
|||||||
const baseConfig = require("../../.prettierrc.js");
|
|
||||||
|
|
||||||
module.exports = {
|
|
||||||
...baseConfig,
|
|
||||||
tailwindConfig: "./tailwind.config.js",
|
|
||||||
};
|
|
||||||
@@ -18,7 +18,7 @@ FROM node:24-alpine3.23 AS base
|
|||||||
FROM base AS installer
|
FROM base AS installer
|
||||||
|
|
||||||
# Enable corepack and prepare pnpm
|
# Enable corepack and prepare pnpm
|
||||||
RUN npm install --ignore-scripts -g corepack@latest
|
RUN npm install --ignore-scripts -g corepack@latest
|
||||||
RUN corepack enable
|
RUN corepack enable
|
||||||
RUN corepack prepare pnpm@10.28.2 --activate
|
RUN corepack prepare pnpm@10.28.2 --activate
|
||||||
|
|
||||||
@@ -67,7 +67,6 @@ RUN --mount=type=secret,id=database_url \
|
|||||||
--mount=type=secret,id=encryption_key \
|
--mount=type=secret,id=encryption_key \
|
||||||
--mount=type=secret,id=redis_url \
|
--mount=type=secret,id=redis_url \
|
||||||
--mount=type=secret,id=sentry_auth_token \
|
--mount=type=secret,id=sentry_auth_token \
|
||||||
--mount=type=secret,id=posthog_key \
|
|
||||||
/tmp/read-secrets.sh pnpm build --filter=@formbricks/web...
|
/tmp/read-secrets.sh pnpm build --filter=@formbricks/web...
|
||||||
|
|
||||||
#
|
#
|
||||||
@@ -75,10 +74,9 @@ RUN --mount=type=secret,id=database_url \
|
|||||||
#
|
#
|
||||||
FROM base AS runner
|
FROM base AS runner
|
||||||
|
|
||||||
# Upgrade Alpine system packages to pick up security patches, update npm to latest, then create user
|
# Update npm to latest, then create user
|
||||||
# Note: npm's bundled tar has a known vulnerability but npm is only used during build, not at runtime
|
# Note: npm's bundled tar has a known vulnerability but npm is only used during build, not at runtime
|
||||||
RUN apk update && apk upgrade --no-cache \
|
RUN npm install --ignore-scripts -g npm@latest \
|
||||||
&& npm install --ignore-scripts -g npm@latest \
|
|
||||||
&& addgroup -S nextjs \
|
&& addgroup -S nextjs \
|
||||||
&& adduser -S -u 1001 -G nextjs nextjs
|
&& adduser -S -u 1001 -G nextjs nextjs
|
||||||
|
|
||||||
@@ -103,9 +101,6 @@ RUN chown -R nextjs:nextjs ./apps/web/public && chmod -R 755 ./apps/web/public
|
|||||||
# Create packages/database directory structure with proper ownership for runtime migrations
|
# Create packages/database directory structure with proper ownership for runtime migrations
|
||||||
RUN mkdir -p ./packages/database/migrations && chown -R nextjs:nextjs ./packages/database
|
RUN mkdir -p ./packages/database/migrations && chown -R nextjs:nextjs ./packages/database
|
||||||
|
|
||||||
COPY --from=installer /app/packages/database/package.json ./packages/database/package.json
|
|
||||||
RUN chown nextjs:nextjs ./packages/database/package.json && chmod 644 ./packages/database/package.json
|
|
||||||
|
|
||||||
COPY --from=installer /app/packages/database/schema.prisma ./packages/database/schema.prisma
|
COPY --from=installer /app/packages/database/schema.prisma ./packages/database/schema.prisma
|
||||||
RUN chown nextjs:nextjs ./packages/database/schema.prisma && chmod 644 ./packages/database/schema.prisma
|
RUN chown nextjs:nextjs ./packages/database/schema.prisma && chmod 644 ./packages/database/schema.prisma
|
||||||
|
|
||||||
@@ -122,11 +117,8 @@ RUN chown -R nextjs:nextjs ./node_modules/.prisma && chmod -R 755 ./node_modules
|
|||||||
COPY --from=installer /app/node_modules/@paralleldrive/cuid2 ./node_modules/@paralleldrive/cuid2
|
COPY --from=installer /app/node_modules/@paralleldrive/cuid2 ./node_modules/@paralleldrive/cuid2
|
||||||
RUN chmod -R 755 ./node_modules/@paralleldrive/cuid2
|
RUN chmod -R 755 ./node_modules/@paralleldrive/cuid2
|
||||||
|
|
||||||
# Runtime migrations import uuid v7 from the database package, so copy the
|
COPY --from=installer /app/node_modules/uuid ./node_modules/uuid
|
||||||
# database package's resolved install instead of the repo-root hoisted version.
|
RUN chmod -R 755 ./node_modules/uuid
|
||||||
COPY --from=installer /app/packages/database/node_modules/uuid ./node_modules/uuid
|
|
||||||
RUN chmod -R 755 ./node_modules/uuid \
|
|
||||||
&& node --input-type=module -e "import('uuid').then((module) => { if (typeof module.v7 !== 'function') throw new Error('uuid v7 missing in runtime image'); })"
|
|
||||||
|
|
||||||
COPY --from=installer /app/node_modules/@noble/hashes ./node_modules/@noble/hashes
|
COPY --from=installer /app/node_modules/@noble/hashes ./node_modules/@noble/hashes
|
||||||
RUN chmod -R 755 ./node_modules/@noble/hashes
|
RUN chmod -R 755 ./node_modules/@noble/hashes
|
||||||
@@ -169,4 +161,4 @@ RUN mkdir -p /home/nextjs/apps/web/uploads/ && \
|
|||||||
VOLUME /home/nextjs/apps/web/uploads/
|
VOLUME /home/nextjs/apps/web/uploads/
|
||||||
VOLUME /home/nextjs/apps/web/saml-connection
|
VOLUME /home/nextjs/apps/web/saml-connection
|
||||||
|
|
||||||
CMD ["/home/nextjs/start.sh"]
|
CMD ["/home/nextjs/start.sh"]
|
||||||
@@ -69,7 +69,7 @@ export const ConnectWithFormbricks = ({
|
|||||||
) : (
|
) : (
|
||||||
<div className="flex animate-pulse flex-col items-center space-y-4">
|
<div className="flex animate-pulse flex-col items-center space-y-4">
|
||||||
<span className="relative flex h-10 w-10">
|
<span className="relative flex h-10 w-10">
|
||||||
<span className="absolute inline-flex h-full w-full animate-ping-slow rounded-full bg-slate-400 opacity-75"></span>
|
<span className="animate-ping-slow absolute inline-flex h-full w-full rounded-full bg-slate-400 opacity-75"></span>
|
||||||
<span className="relative inline-flex h-10 w-10 rounded-full bg-slate-500"></span>
|
<span className="relative inline-flex h-10 w-10 rounded-full bg-slate-500"></span>
|
||||||
</span>
|
</span>
|
||||||
<p className="pt-4 text-sm font-medium text-slate-600">
|
<p className="pt-4 text-sm font-medium text-slate-600">
|
||||||
|
|||||||
@@ -1,6 +1,5 @@
|
|||||||
import { XIcon } from "lucide-react";
|
import { XIcon } from "lucide-react";
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
import { ResourceNotFoundError } from "@formbricks/types/errors";
|
|
||||||
import { ConnectWithFormbricks } from "@/app/(app)/(onboarding)/environments/[environmentId]/connect/components/ConnectWithFormbricks";
|
import { ConnectWithFormbricks } from "@/app/(app)/(onboarding)/environments/[environmentId]/connect/components/ConnectWithFormbricks";
|
||||||
import { getEnvironment } from "@/lib/environment/service";
|
import { getEnvironment } from "@/lib/environment/service";
|
||||||
import { getPublicDomain } from "@/lib/getPublicUrl";
|
import { getPublicDomain } from "@/lib/getPublicUrl";
|
||||||
@@ -21,12 +20,12 @@ const Page = async (props: ConnectPageProps) => {
|
|||||||
const environment = await getEnvironment(params.environmentId);
|
const environment = await getEnvironment(params.environmentId);
|
||||||
|
|
||||||
if (!environment) {
|
if (!environment) {
|
||||||
throw new ResourceNotFoundError(t("common.environment"), params.environmentId);
|
throw new Error(t("common.environment_not_found"));
|
||||||
}
|
}
|
||||||
|
|
||||||
const project = await getProjectByEnvironmentId(environment.id);
|
const project = await getProjectByEnvironmentId(environment.id);
|
||||||
if (!project) {
|
if (!project) {
|
||||||
throw new ResourceNotFoundError(t("common.workspace"), null);
|
throw new Error(t("common.workspace_not_found"));
|
||||||
}
|
}
|
||||||
|
|
||||||
const channel = project.config.channel || null;
|
const channel = project.config.channel || null;
|
||||||
@@ -47,7 +46,7 @@ const Page = async (props: ConnectPageProps) => {
|
|||||||
channel={channel}
|
channel={channel}
|
||||||
/>
|
/>
|
||||||
<Button
|
<Button
|
||||||
className="absolute right-5 top-5 !mt-0 text-slate-500 hover:text-slate-700"
|
className="absolute top-5 right-5 !mt-0 text-slate-500 hover:text-slate-700"
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
asChild>
|
asChild>
|
||||||
<Link href={`/environments/${environment.id}`}>
|
<Link href={`/environments/${environment.id}`}>
|
||||||
|
|||||||
@@ -4,10 +4,7 @@ import { AuthorizationError } from "@formbricks/types/errors";
|
|||||||
import { hasUserEnvironmentAccess } from "@/lib/environment/auth";
|
import { hasUserEnvironmentAccess } from "@/lib/environment/auth";
|
||||||
import { authOptions } from "@/modules/auth/lib/authOptions";
|
import { authOptions } from "@/modules/auth/lib/authOptions";
|
||||||
|
|
||||||
const OnboardingLayout = async (props: {
|
const OnboardingLayout = async (props) => {
|
||||||
params: Promise<{ environmentId: string }>;
|
|
||||||
children: React.ReactNode;
|
|
||||||
}) => {
|
|
||||||
const params = await props.params;
|
const params = await props.params;
|
||||||
|
|
||||||
const { children } = props;
|
const { children } = props;
|
||||||
|
|||||||
@@ -2,7 +2,6 @@ import "@testing-library/jest-dom/vitest";
|
|||||||
import { cleanup } from "@testing-library/react";
|
import { cleanup } from "@testing-library/react";
|
||||||
import { afterEach, describe, expect, test } from "vitest";
|
import { afterEach, describe, expect, test } from "vitest";
|
||||||
import { TProject } from "@formbricks/types/project";
|
import { TProject } from "@formbricks/types/project";
|
||||||
import { TSurveyElementTypeEnum } from "@formbricks/types/surveys/constants";
|
|
||||||
import { TXMTemplate } from "@formbricks/types/templates";
|
import { TXMTemplate } from "@formbricks/types/templates";
|
||||||
import { replacePresetPlaceholders } from "./utils";
|
import { replacePresetPlaceholders } from "./utils";
|
||||||
|
|
||||||
@@ -40,13 +39,13 @@ const mockTemplate: TXMTemplate = {
|
|||||||
elements: [
|
elements: [
|
||||||
{
|
{
|
||||||
id: "q1",
|
id: "q1",
|
||||||
type: "openText" as TSurveyElementTypeEnum.OpenText,
|
type: "openText" as const,
|
||||||
inputType: "text" as const,
|
inputType: "text" as const,
|
||||||
headline: { default: "$[projectName] Question" },
|
headline: { default: "$[projectName] Question" },
|
||||||
subheader: { default: "" },
|
subheader: { default: "" },
|
||||||
required: false,
|
required: false,
|
||||||
placeholder: { default: "" },
|
placeholder: { default: "" },
|
||||||
charLimit: { enabled: true, max: 1000 },
|
charLimit: 1000,
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -14,7 +14,7 @@ describe("xm-templates", () => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
test("getXMSurveyDefault returns default survey template", () => {
|
test("getXMSurveyDefault returns default survey template", () => {
|
||||||
const tMock = vi.fn((key: string) => key) as unknown as TFunction;
|
const tMock = vi.fn((key) => key) as TFunction;
|
||||||
const result = getXMSurveyDefault(tMock);
|
const result = getXMSurveyDefault(tMock);
|
||||||
|
|
||||||
expect(result).toEqual({
|
expect(result).toEqual({
|
||||||
@@ -29,7 +29,7 @@ describe("xm-templates", () => {
|
|||||||
});
|
});
|
||||||
|
|
||||||
test("getXMTemplates returns all templates", () => {
|
test("getXMTemplates returns all templates", () => {
|
||||||
const tMock = vi.fn((key: string) => key) as unknown as TFunction;
|
const tMock = vi.fn((key) => key) as TFunction;
|
||||||
const result = getXMTemplates(tMock);
|
const result = getXMTemplates(tMock);
|
||||||
|
|
||||||
expect(result).toHaveLength(6);
|
expect(result).toHaveLength(6);
|
||||||
@@ -44,7 +44,7 @@ describe("xm-templates", () => {
|
|||||||
test("getXMTemplates handles errors gracefully", async () => {
|
test("getXMTemplates handles errors gracefully", async () => {
|
||||||
const tMock = vi.fn(() => {
|
const tMock = vi.fn(() => {
|
||||||
throw new Error("Test error");
|
throw new Error("Test error");
|
||||||
}) as unknown as TFunction;
|
}) as TFunction;
|
||||||
|
|
||||||
const result = getXMTemplates(tMock);
|
const result = getXMTemplates(tMock);
|
||||||
|
|
||||||
|
|||||||
@@ -1,7 +1,6 @@
|
|||||||
import { XIcon } from "lucide-react";
|
import { XIcon } from "lucide-react";
|
||||||
import { getServerSession } from "next-auth";
|
import { getServerSession } from "next-auth";
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
import { AuthenticationError, ResourceNotFoundError } from "@formbricks/types/errors";
|
|
||||||
import { XMTemplateList } from "@/app/(app)/(onboarding)/environments/[environmentId]/xm-templates/components/XMTemplateList";
|
import { XMTemplateList } from "@/app/(app)/(onboarding)/environments/[environmentId]/xm-templates/components/XMTemplateList";
|
||||||
import { getEnvironment } from "@/lib/environment/service";
|
import { getEnvironment } from "@/lib/environment/service";
|
||||||
import { getProjectByEnvironmentId, getUserProjects } from "@/lib/project/service";
|
import { getProjectByEnvironmentId, getUserProjects } from "@/lib/project/service";
|
||||||
@@ -24,22 +23,22 @@ const Page = async (props: XMTemplatePageProps) => {
|
|||||||
const environment = await getEnvironment(params.environmentId);
|
const environment = await getEnvironment(params.environmentId);
|
||||||
const t = await getTranslate();
|
const t = await getTranslate();
|
||||||
if (!session) {
|
if (!session) {
|
||||||
throw new AuthenticationError(t("common.not_authenticated"));
|
throw new Error(t("common.session_not_found"));
|
||||||
}
|
}
|
||||||
|
|
||||||
const user = await getUser(session.user.id);
|
const user = await getUser(session.user.id);
|
||||||
if (!user) {
|
if (!user) {
|
||||||
throw new AuthenticationError(t("common.not_authenticated"));
|
throw new Error(t("common.user_not_found"));
|
||||||
}
|
}
|
||||||
if (!environment) {
|
if (!environment) {
|
||||||
throw new ResourceNotFoundError(t("common.environment"), params.environmentId);
|
throw new Error(t("common.environment_not_found"));
|
||||||
}
|
}
|
||||||
|
|
||||||
const organizationId = await getOrganizationIdFromEnvironmentId(environment.id);
|
const organizationId = await getOrganizationIdFromEnvironmentId(environment.id);
|
||||||
|
|
||||||
const project = await getProjectByEnvironmentId(environment.id);
|
const project = await getProjectByEnvironmentId(environment.id);
|
||||||
if (!project) {
|
if (!project) {
|
||||||
throw new ResourceNotFoundError(t("common.workspace"), null);
|
throw new Error(t("common.workspace_not_found"));
|
||||||
}
|
}
|
||||||
|
|
||||||
const projects = await getUserProjects(session.user.id, organizationId);
|
const projects = await getUserProjects(session.user.id, organizationId);
|
||||||
@@ -50,7 +49,7 @@ const Page = async (props: XMTemplatePageProps) => {
|
|||||||
<XMTemplateList project={project} user={user} environmentId={environment.id} />
|
<XMTemplateList project={project} user={user} environmentId={environment.id} />
|
||||||
{projects.length >= 2 && (
|
{projects.length >= 2 && (
|
||||||
<Button
|
<Button
|
||||||
className="absolute right-5 top-5 !mt-0 text-slate-500 hover:text-slate-700"
|
className="absolute top-5 right-5 !mt-0 text-slate-500 hover:text-slate-700"
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
asChild>
|
asChild>
|
||||||
<Link href={`/environments/${environment.id}/surveys`}>
|
<Link href={`/environments/${environment.id}/surveys`}>
|
||||||
|
|||||||
@@ -19,8 +19,8 @@ describe("getTeamsByOrganizationId", () => {
|
|||||||
|
|
||||||
test("returns mapped teams", async () => {
|
test("returns mapped teams", async () => {
|
||||||
const mockTeams = [
|
const mockTeams = [
|
||||||
{ id: "t1", name: "Team 1", createdAt: new Date(), updatedAt: new Date(), organizationId: "org1" },
|
{ id: "t1", name: "Team 1" },
|
||||||
{ id: "t2", name: "Team 2", createdAt: new Date(), updatedAt: new Date(), organizationId: "org1" },
|
{ id: "t2", name: "Team 2" },
|
||||||
];
|
];
|
||||||
vi.mocked(prisma.team.findMany).mockResolvedValueOnce(mockTeams);
|
vi.mocked(prisma.team.findMany).mockResolvedValueOnce(mockTeams);
|
||||||
const result = await getTeamsByOrganizationId("org1");
|
const result = await getTeamsByOrganizationId("org1");
|
||||||
|
|||||||
@@ -22,10 +22,12 @@ export const getTeamsByOrganizationId = reactCache(
|
|||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
return teams.map((team: TOrganizationTeam) => ({
|
const projectTeams = teams.map((team) => ({
|
||||||
id: team.id,
|
id: team.id,
|
||||||
name: team.name,
|
name: team.name,
|
||||||
}));
|
}));
|
||||||
|
|
||||||
|
return projectTeams;
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
if (error instanceof Prisma.PrismaClientKnownRequestError) {
|
if (error instanceof Prisma.PrismaClientKnownRequestError) {
|
||||||
throw new DatabaseError(error.message);
|
throw new DatabaseError(error.message);
|
||||||
|
|||||||
@@ -42,7 +42,7 @@ export const LandingSidebar = ({ user, organization }: LandingSidebarProps) => {
|
|||||||
return (
|
return (
|
||||||
<aside
|
<aside
|
||||||
className={cn(
|
className={cn(
|
||||||
"z-40 flex w-sidebar-collapsed flex-col justify-between rounded-r-xl border-r border-slate-200 bg-white pt-3 shadow-md transition-all duration-100"
|
"w-sidebar-collapsed z-40 flex flex-col justify-between rounded-r-xl border-r border-slate-200 bg-white pt-3 shadow-md transition-all duration-100"
|
||||||
)}>
|
)}>
|
||||||
<Image src={FBLogo} width={160} height={30} alt={t("environments.formbricks_logo")} />
|
<Image src={FBLogo} width={160} height={30} alt={t("environments.formbricks_logo")} />
|
||||||
|
|
||||||
|
|||||||
@@ -5,10 +5,7 @@ import { getMembershipByUserIdOrganizationId } from "@/lib/membership/service";
|
|||||||
import { getUserProjects } from "@/lib/project/service";
|
import { getUserProjects } from "@/lib/project/service";
|
||||||
import { authOptions } from "@/modules/auth/lib/authOptions";
|
import { authOptions } from "@/modules/auth/lib/authOptions";
|
||||||
|
|
||||||
const LandingLayout = async (props: {
|
const LandingLayout = async (props) => {
|
||||||
params: Promise<{ organizationId: string }>;
|
|
||||||
children: React.ReactNode;
|
|
||||||
}) => {
|
|
||||||
const params = await props.params;
|
const params = await props.params;
|
||||||
|
|
||||||
const { children } = props;
|
const { children } = props;
|
||||||
|
|||||||
@@ -10,7 +10,7 @@ import { getIsMultiOrgEnabled } from "@/modules/ee/license-check/lib/utils";
|
|||||||
import { getOrganizationAuth } from "@/modules/organization/lib/utils";
|
import { getOrganizationAuth } from "@/modules/organization/lib/utils";
|
||||||
import { Header } from "@/modules/ui/components/header";
|
import { Header } from "@/modules/ui/components/header";
|
||||||
|
|
||||||
const Page = async (props: { params: Promise<{ organizationId: string }> }) => {
|
const Page = async (props) => {
|
||||||
const params = await props.params;
|
const params = await props.params;
|
||||||
const t = await getTranslate();
|
const t = await getTranslate();
|
||||||
|
|
||||||
@@ -26,8 +26,7 @@ const Page = async (props: { params: Promise<{ organizationId: string }> }) => {
|
|||||||
const isMultiOrgEnabled = await getIsMultiOrgEnabled();
|
const isMultiOrgEnabled = await getIsMultiOrgEnabled();
|
||||||
|
|
||||||
const membership = await getMembershipByUserIdOrganizationId(session.user.id, organization.id);
|
const membership = await getMembershipByUserIdOrganizationId(session.user.id, organization.id);
|
||||||
const { isBilling } = getAccessFlags(membership?.role);
|
const { isMember } = getAccessFlags(membership?.role);
|
||||||
const isMembershipPending = membership?.role === undefined;
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="flex min-h-full min-w-full flex-row">
|
<div className="flex min-h-full min-w-full flex-row">
|
||||||
@@ -45,8 +44,7 @@ const Page = async (props: { params: Promise<{ organizationId: string }> }) => {
|
|||||||
isLicenseActive={false}
|
isLicenseActive={false}
|
||||||
isOwnerOrManager={false}
|
isOwnerOrManager={false}
|
||||||
isAccessControlAllowed={false}
|
isAccessControlAllowed={false}
|
||||||
isBilling={isBilling}
|
isMember={isMember}
|
||||||
isMembershipPending={isMembershipPending}
|
|
||||||
environments={[]}
|
environments={[]}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
import { getServerSession } from "next-auth";
|
import { getServerSession } from "next-auth";
|
||||||
import { redirect } from "next/navigation";
|
import { redirect } from "next/navigation";
|
||||||
import { AuthenticationError, AuthorizationError, ResourceNotFoundError } from "@formbricks/types/errors";
|
import { AuthorizationError } from "@formbricks/types/errors";
|
||||||
import { canUserAccessOrganization } from "@/lib/organization/auth";
|
import { canUserAccessOrganization } from "@/lib/organization/auth";
|
||||||
import { getOrganization } from "@/lib/organization/service";
|
import { getOrganization } from "@/lib/organization/service";
|
||||||
import { getUser } from "@/lib/user/service";
|
import { getUser } from "@/lib/user/service";
|
||||||
@@ -8,10 +8,7 @@ import { getTranslate } from "@/lingodotdev/server";
|
|||||||
import { authOptions } from "@/modules/auth/lib/authOptions";
|
import { authOptions } from "@/modules/auth/lib/authOptions";
|
||||||
import { ToasterClient } from "@/modules/ui/components/toaster-client";
|
import { ToasterClient } from "@/modules/ui/components/toaster-client";
|
||||||
|
|
||||||
const ProjectOnboardingLayout = async (props: {
|
const ProjectOnboardingLayout = async (props) => {
|
||||||
params: Promise<{ organizationId: string }>;
|
|
||||||
children: React.ReactNode;
|
|
||||||
}) => {
|
|
||||||
const params = await props.params;
|
const params = await props.params;
|
||||||
|
|
||||||
const { children } = props;
|
const { children } = props;
|
||||||
@@ -25,7 +22,7 @@ const ProjectOnboardingLayout = async (props: {
|
|||||||
|
|
||||||
const user = await getUser(session.user.id);
|
const user = await getUser(session.user.id);
|
||||||
if (!user) {
|
if (!user) {
|
||||||
throw new AuthenticationError(t("common.not_authenticated"));
|
throw new Error(t("common.user_not_found"));
|
||||||
}
|
}
|
||||||
|
|
||||||
const isAuthorized = await canUserAccessOrganization(session.user.id, params.organizationId);
|
const isAuthorized = await canUserAccessOrganization(session.user.id, params.organizationId);
|
||||||
@@ -36,7 +33,7 @@ const ProjectOnboardingLayout = async (props: {
|
|||||||
|
|
||||||
const organization = await getOrganization(params.organizationId);
|
const organization = await getOrganization(params.organizationId);
|
||||||
if (!organization) {
|
if (!organization) {
|
||||||
throw new ResourceNotFoundError(t("common.organization"), params.organizationId);
|
throw new Error(t("common.organization_not_found"));
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|||||||
@@ -50,7 +50,7 @@ const Page = async (props: ChannelPageProps) => {
|
|||||||
<OnboardingOptionsContainer options={channelOptions} />
|
<OnboardingOptionsContainer options={channelOptions} />
|
||||||
{projects.length >= 1 && (
|
{projects.length >= 1 && (
|
||||||
<Button
|
<Button
|
||||||
className="absolute right-5 top-5 !mt-0 text-slate-500 hover:text-slate-700"
|
className="absolute top-5 right-5 !mt-0 text-slate-500 hover:text-slate-700"
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
asChild>
|
asChild>
|
||||||
<Link href={"/"}>
|
<Link href={"/"}>
|
||||||
|
|||||||
@@ -1,6 +1,5 @@
|
|||||||
import { getServerSession } from "next-auth";
|
import { getServerSession } from "next-auth";
|
||||||
import { notFound, redirect } from "next/navigation";
|
import { notFound, redirect } from "next/navigation";
|
||||||
import { ResourceNotFoundError } from "@formbricks/types/errors";
|
|
||||||
import { getMembershipByUserIdOrganizationId } from "@/lib/membership/service";
|
import { getMembershipByUserIdOrganizationId } from "@/lib/membership/service";
|
||||||
import { getAccessFlags } from "@/lib/membership/utils";
|
import { getAccessFlags } from "@/lib/membership/utils";
|
||||||
import { getOrganization } from "@/lib/organization/service";
|
import { getOrganization } from "@/lib/organization/service";
|
||||||
@@ -9,10 +8,7 @@ import { getTranslate } from "@/lingodotdev/server";
|
|||||||
import { authOptions } from "@/modules/auth/lib/authOptions";
|
import { authOptions } from "@/modules/auth/lib/authOptions";
|
||||||
import { getOrganizationProjectsLimit } from "@/modules/ee/license-check/lib/utils";
|
import { getOrganizationProjectsLimit } from "@/modules/ee/license-check/lib/utils";
|
||||||
|
|
||||||
const OnboardingLayout = async (props: {
|
const OnboardingLayout = async (props) => {
|
||||||
params: Promise<{ organizationId: string }>;
|
|
||||||
children: React.ReactNode;
|
|
||||||
}) => {
|
|
||||||
const params = await props.params;
|
const params = await props.params;
|
||||||
|
|
||||||
const { children } = props;
|
const { children } = props;
|
||||||
@@ -29,13 +25,11 @@ const OnboardingLayout = async (props: {
|
|||||||
|
|
||||||
const organization = await getOrganization(params.organizationId);
|
const organization = await getOrganization(params.organizationId);
|
||||||
if (!organization) {
|
if (!organization) {
|
||||||
throw new ResourceNotFoundError(t("common.organization"), params.organizationId);
|
throw new Error(t("common.organization_not_found"));
|
||||||
}
|
}
|
||||||
|
|
||||||
const [organizationProjectsLimit, organizationProjectsCount] = await Promise.all([
|
const organizationProjectsLimit = await getOrganizationProjectsLimit(organization.billing.limits);
|
||||||
getOrganizationProjectsLimit(organization.id),
|
const organizationProjectsCount = await getOrganizationProjectsCount(organization.id);
|
||||||
getOrganizationProjectsCount(organization.id),
|
|
||||||
]);
|
|
||||||
|
|
||||||
if (organizationProjectsCount >= organizationProjectsLimit) {
|
if (organizationProjectsCount >= organizationProjectsLimit) {
|
||||||
return redirect(`/`);
|
return redirect(`/`);
|
||||||
|
|||||||
@@ -47,7 +47,7 @@ const Page = async (props: ModePageProps) => {
|
|||||||
<OnboardingOptionsContainer options={channelOptions} />
|
<OnboardingOptionsContainer options={channelOptions} />
|
||||||
{projects.length >= 1 && (
|
{projects.length >= 1 && (
|
||||||
<Button
|
<Button
|
||||||
className="absolute right-5 top-5 !mt-0 text-slate-500 hover:text-slate-700"
|
className="absolute top-5 right-5 !mt-0 text-slate-500 hover:text-slate-700"
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
asChild>
|
asChild>
|
||||||
<Link href={"/"}>
|
<Link href={"/"}>
|
||||||
|
|||||||
@@ -1,22 +0,0 @@
|
|||||||
import { getTranslate } from "@/lingodotdev/server";
|
|
||||||
import { SelectPlanCard } from "@/modules/ee/billing/components/select-plan-card";
|
|
||||||
import { Header } from "@/modules/ui/components/header";
|
|
||||||
|
|
||||||
interface SelectPlanOnboardingProps {
|
|
||||||
organizationId: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const SelectPlanOnboarding = async ({ organizationId }: SelectPlanOnboardingProps) => {
|
|
||||||
const t = await getTranslate();
|
|
||||||
const nextUrl = `/organizations/${organizationId}/workspaces/new/mode`;
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="flex min-h-full min-w-full flex-col items-center justify-center space-y-8">
|
|
||||||
<Header
|
|
||||||
title={t("environments.settings.billing.select_plan_header_title")}
|
|
||||||
subtitle={t("environments.settings.billing.select_plan_header_subtitle")}
|
|
||||||
/>
|
|
||||||
<SelectPlanCard nextUrl={nextUrl} organizationId={organizationId} />
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
@@ -1,42 +0,0 @@
|
|||||||
import { redirect } from "next/navigation";
|
|
||||||
import { TCloudBillingPlan } from "@formbricks/types/organizations";
|
|
||||||
import { IS_FORMBRICKS_CLOUD } from "@/lib/constants";
|
|
||||||
import { getOrganizationBillingWithReadThroughSync } from "@/modules/ee/billing/lib/organization-billing";
|
|
||||||
import { getOrganizationAuth } from "@/modules/organization/lib/utils";
|
|
||||||
import { SelectPlanOnboarding } from "./components/select-plan-onboarding";
|
|
||||||
|
|
||||||
const PAID_PLANS = new Set<TCloudBillingPlan>(["pro", "scale", "custom"]);
|
|
||||||
|
|
||||||
interface PlanPageProps {
|
|
||||||
params: Promise<{
|
|
||||||
organizationId: string;
|
|
||||||
}>;
|
|
||||||
}
|
|
||||||
|
|
||||||
const Page = async (props: PlanPageProps) => {
|
|
||||||
const params = await props.params;
|
|
||||||
|
|
||||||
if (!IS_FORMBRICKS_CLOUD) {
|
|
||||||
return redirect(`/organizations/${params.organizationId}/workspaces/new/mode`);
|
|
||||||
}
|
|
||||||
|
|
||||||
const { session } = await getOrganizationAuth(params.organizationId);
|
|
||||||
|
|
||||||
if (!session?.user) {
|
|
||||||
return redirect(`/auth/login`);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Users with an existing paid/trial subscription should not be shown the trial page.
|
|
||||||
// Redirect them directly to the next onboarding step.
|
|
||||||
const billing = await getOrganizationBillingWithReadThroughSync(params.organizationId);
|
|
||||||
const currentPlan = billing?.stripe?.plan;
|
|
||||||
const hasExistingSubscription = currentPlan !== undefined && PAID_PLANS.has(currentPlan);
|
|
||||||
|
|
||||||
if (hasExistingSubscription) {
|
|
||||||
return redirect(`/organizations/${params.organizationId}/workspaces/new/mode`);
|
|
||||||
}
|
|
||||||
|
|
||||||
return <SelectPlanOnboarding organizationId={params.organizationId} />;
|
|
||||||
};
|
|
||||||
|
|
||||||
export default Page;
|
|
||||||
@@ -228,7 +228,7 @@ export const ProjectSettings = ({
|
|||||||
</FormProvider>
|
</FormProvider>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="relative flex w-1/2 flex-col items-center justify-center space-y-2 rounded-lg border bg-slate-200 p-6 shadow">
|
<div className="relative flex h-[30rem] w-1/2 flex-col items-center justify-center space-y-2 rounded-lg border bg-slate-200 shadow">
|
||||||
{logoUrl && (
|
{logoUrl && (
|
||||||
<Image
|
<Image
|
||||||
src={logoUrl}
|
src={logoUrl}
|
||||||
@@ -239,16 +239,18 @@ export const ProjectSettings = ({
|
|||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
<p className="text-sm text-slate-400">{t("common.preview")}</p>
|
<p className="text-sm text-slate-400">{t("common.preview")}</p>
|
||||||
<SurveyInline
|
<div className="z-0 h-3/4 w-3/4">
|
||||||
appUrl={publicDomain}
|
<SurveyInline
|
||||||
isPreviewMode={true}
|
appUrl={publicDomain}
|
||||||
survey={previewSurvey(projectName || t("common.my_product"), t)}
|
isPreviewMode={true}
|
||||||
styling={previewStyling}
|
survey={previewSurvey(projectName || "my Product", t)}
|
||||||
isBrandingEnabled={false}
|
styling={previewStyling}
|
||||||
languageCode="default"
|
isBrandingEnabled={false}
|
||||||
onFileUpload={async (file) => file.name}
|
languageCode="default"
|
||||||
autoFocus={false}
|
onFileUpload={async (file) => file.name}
|
||||||
/>
|
autoFocus={false}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<CreateTeamModal
|
<CreateTeamModal
|
||||||
open={createTeamModalOpen}
|
open={createTeamModalOpen}
|
||||||
|
|||||||
@@ -1,7 +1,6 @@
|
|||||||
import { XIcon } from "lucide-react";
|
import { XIcon } from "lucide-react";
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
import { redirect } from "next/navigation";
|
import { redirect } from "next/navigation";
|
||||||
import { ResourceNotFoundError } from "@formbricks/types/errors";
|
|
||||||
import { TProjectConfigChannel, TProjectConfigIndustry, TProjectMode } from "@formbricks/types/project";
|
import { TProjectConfigChannel, TProjectConfigIndustry, TProjectMode } from "@formbricks/types/project";
|
||||||
import { getTeamsByOrganizationId } from "@/app/(app)/(onboarding)/lib/onboarding";
|
import { getTeamsByOrganizationId } from "@/app/(app)/(onboarding)/lib/onboarding";
|
||||||
import { ProjectSettings } from "@/app/(app)/(onboarding)/organizations/[organizationId]/workspaces/new/settings/components/ProjectSettings";
|
import { ProjectSettings } from "@/app/(app)/(onboarding)/organizations/[organizationId]/workspaces/new/settings/components/ProjectSettings";
|
||||||
@@ -43,10 +42,10 @@ const Page = async (props: ProjectSettingsPageProps) => {
|
|||||||
|
|
||||||
const organizationTeams = await getTeamsByOrganizationId(params.organizationId);
|
const organizationTeams = await getTeamsByOrganizationId(params.organizationId);
|
||||||
|
|
||||||
const isAccessControlAllowed = await getAccessControlPermission(organization.id);
|
const isAccessControlAllowed = await getAccessControlPermission(organization.billing.plan);
|
||||||
|
|
||||||
if (!organizationTeams) {
|
if (!organizationTeams) {
|
||||||
throw new ResourceNotFoundError(t("common.team"), null);
|
throw new Error(t("common.organization_teams_not_found"));
|
||||||
}
|
}
|
||||||
|
|
||||||
const publicDomain = getPublicDomain();
|
const publicDomain = getPublicDomain();
|
||||||
@@ -70,7 +69,7 @@ const Page = async (props: ProjectSettingsPageProps) => {
|
|||||||
/>
|
/>
|
||||||
{projects.length >= 1 && (
|
{projects.length >= 1 && (
|
||||||
<Button
|
<Button
|
||||||
className="absolute right-5 top-5 !mt-0 text-slate-500 hover:text-slate-700"
|
className="absolute top-5 right-5 !mt-0 text-slate-500 hover:text-slate-700"
|
||||||
variant="ghost"
|
variant="ghost"
|
||||||
asChild>
|
asChild>
|
||||||
<Link href={"/"}>
|
<Link href={"/"}>
|
||||||
|
|||||||
@@ -16,7 +16,7 @@ interface OnboardingOptionsContainerProps {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export const OnboardingOptionsContainer = ({ options }: OnboardingOptionsContainerProps) => {
|
export const OnboardingOptionsContainer = ({ options }: OnboardingOptionsContainerProps) => {
|
||||||
const getOptionCard = (option: OnboardingOptionsContainerProps["options"][number]) => {
|
const getOptionCard = (option) => {
|
||||||
const Icon = option.icon;
|
const Icon = option.icon;
|
||||||
return (
|
return (
|
||||||
<OptionCard
|
<OptionCard
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
import { z } from "zod";
|
import { z } from "zod";
|
||||||
|
|
||||||
export const ZOrganizationTeam = z.object({
|
export const ZOrganizationTeam = z.object({
|
||||||
id: z.cuid2(),
|
id: z.string().cuid2(),
|
||||||
name: z.string(),
|
name: z.string(),
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
@@ -1,12 +1,8 @@
|
|||||||
import { redirect } from "next/navigation";
|
import { redirect } from "next/navigation";
|
||||||
import { AuthenticationError, ResourceNotFoundError } from "@formbricks/types/errors";
|
|
||||||
import { getEnvironment } from "@/lib/environment/service";
|
import { getEnvironment } from "@/lib/environment/service";
|
||||||
import { environmentIdLayoutChecks } from "@/modules/environments/lib/utils";
|
import { environmentIdLayoutChecks } from "@/modules/environments/lib/utils";
|
||||||
|
|
||||||
const SurveyEditorEnvironmentLayout = async (props: {
|
const SurveyEditorEnvironmentLayout = async (props) => {
|
||||||
params: Promise<{ environmentId: string }>;
|
|
||||||
children: React.ReactNode;
|
|
||||||
}) => {
|
|
||||||
const params = await props.params;
|
const params = await props.params;
|
||||||
|
|
||||||
const { children } = props;
|
const { children } = props;
|
||||||
@@ -18,13 +14,13 @@ const SurveyEditorEnvironmentLayout = async (props: {
|
|||||||
}
|
}
|
||||||
|
|
||||||
if (!user) {
|
if (!user) {
|
||||||
throw new AuthenticationError(t("common.not_authenticated"));
|
throw new Error(t("common.user_not_found"));
|
||||||
}
|
}
|
||||||
|
|
||||||
const environment = await getEnvironment(params.environmentId);
|
const environment = await getEnvironment(params.environmentId);
|
||||||
|
|
||||||
if (!environment) {
|
if (!environment) {
|
||||||
throw new ResourceNotFoundError(t("common.environment"), params.environmentId);
|
throw new Error(t("common.environment_not_found"));
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
|||||||
@@ -6,26 +6,15 @@ import { useTranslation } from "react-i18next";
|
|||||||
import { Button } from "@/modules/ui/components/button";
|
import { Button } from "@/modules/ui/components/button";
|
||||||
import { Confetti } from "@/modules/ui/components/confetti";
|
import { Confetti } from "@/modules/ui/components/confetti";
|
||||||
|
|
||||||
const BILLING_CONFIRMATION_ENVIRONMENT_ID_KEY = "billingConfirmationEnvironmentId";
|
interface ConfirmationPageProps {
|
||||||
|
environmentId: string;
|
||||||
|
}
|
||||||
|
|
||||||
export const ConfirmationPage = () => {
|
export const ConfirmationPage = ({ environmentId }: ConfirmationPageProps) => {
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
const [showConfetti, setShowConfetti] = useState(false);
|
const [showConfetti, setShowConfetti] = useState(false);
|
||||||
const [resolvedEnvironmentId, setResolvedEnvironmentId] = useState<string | null>(null);
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
setShowConfetti(true);
|
setShowConfetti(true);
|
||||||
|
|
||||||
if (globalThis.window === undefined) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const storedEnvironmentId = globalThis.window.sessionStorage.getItem(
|
|
||||||
BILLING_CONFIRMATION_ENVIRONMENT_ID_KEY
|
|
||||||
);
|
|
||||||
if (storedEnvironmentId) {
|
|
||||||
setResolvedEnvironmentId(storedEnvironmentId);
|
|
||||||
}
|
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@@ -41,12 +30,7 @@ export const ConfirmationPage = () => {
|
|||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<Button asChild className="w-full justify-center">
|
<Button asChild className="w-full justify-center">
|
||||||
<Link
|
<Link href={`/environments/${environmentId}/settings/billing`}>
|
||||||
href={
|
|
||||||
resolvedEnvironmentId
|
|
||||||
? `/environments/${resolvedEnvironmentId}/settings/billing`
|
|
||||||
: "/environments"
|
|
||||||
}>
|
|
||||||
{t("billing_confirmation.back_to_billing_overview")}
|
{t("billing_confirmation.back_to_billing_overview")}
|
||||||
</Link>
|
</Link>
|
||||||
</Button>
|
</Button>
|
||||||
|
|||||||
@@ -3,10 +3,13 @@ import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper
|
|||||||
|
|
||||||
export const dynamic = "force-dynamic";
|
export const dynamic = "force-dynamic";
|
||||||
|
|
||||||
const Page = async () => {
|
const Page = async (props) => {
|
||||||
|
const searchParams = await props.searchParams;
|
||||||
|
const { environmentId } = searchParams;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<PageContentWrapper>
|
<PageContentWrapper>
|
||||||
<ConfirmationPage />
|
<ConfirmationPage environmentId={environmentId?.toString()} />
|
||||||
</PageContentWrapper>
|
</PageContentWrapper>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -1,24 +0,0 @@
|
|||||||
import { getServerSession } from "next-auth";
|
|
||||||
import { redirect } from "next/navigation";
|
|
||||||
import { EnvironmentLayout } from "@/app/(app)/environments/[environmentId]/components/EnvironmentLayout";
|
|
||||||
import { authOptions } from "@/modules/auth/lib/authOptions";
|
|
||||||
import { getEnvironmentLayoutData } from "@/modules/environments/lib/utils";
|
|
||||||
|
|
||||||
const MainNavLayout = async (props: {
|
|
||||||
params: Promise<{ environmentId: string }>;
|
|
||||||
children: React.ReactNode;
|
|
||||||
}) => {
|
|
||||||
const params = await props.params;
|
|
||||||
const { children } = props;
|
|
||||||
|
|
||||||
const session = await getServerSession(authOptions);
|
|
||||||
if (!session?.user) {
|
|
||||||
return redirect("/auth/login");
|
|
||||||
}
|
|
||||||
|
|
||||||
const layoutData = await getEnvironmentLayoutData(params.environmentId, session.user.id);
|
|
||||||
|
|
||||||
return <EnvironmentLayout layoutData={layoutData}>{children}</EnvironmentLayout>;
|
|
||||||
};
|
|
||||||
|
|
||||||
export default MainNavLayout;
|
|
||||||
@@ -1,125 +0,0 @@
|
|||||||
"use client";
|
|
||||||
|
|
||||||
import { AlertCircleIcon, InfoIcon } from "lucide-react";
|
|
||||||
import Link from "next/link";
|
|
||||||
import { useTranslation } from "react-i18next";
|
|
||||||
import { TDisplayWithContact } from "@formbricks/types/displays";
|
|
||||||
import { TUserLocale } from "@formbricks/types/user";
|
|
||||||
import { timeSince } from "@/lib/time";
|
|
||||||
import { Button } from "@/modules/ui/components/button";
|
|
||||||
|
|
||||||
interface SummaryImpressionsProps {
|
|
||||||
displays: TDisplayWithContact[];
|
|
||||||
isLoading: boolean;
|
|
||||||
hasMore: boolean;
|
|
||||||
displaysError: string | null;
|
|
||||||
environmentId: string;
|
|
||||||
locale: TUserLocale;
|
|
||||||
onLoadMore: () => void;
|
|
||||||
onRetry: () => void;
|
|
||||||
}
|
|
||||||
|
|
||||||
const getDisplayContactIdentifier = (display: TDisplayWithContact): string => {
|
|
||||||
if (!display.contact) return "";
|
|
||||||
return display.contact.attributes?.email || display.contact.attributes?.userId || display.contact.id;
|
|
||||||
};
|
|
||||||
|
|
||||||
export const SummaryImpressions = ({
|
|
||||||
displays,
|
|
||||||
isLoading,
|
|
||||||
hasMore,
|
|
||||||
displaysError,
|
|
||||||
environmentId,
|
|
||||||
locale,
|
|
||||||
onLoadMore,
|
|
||||||
onRetry,
|
|
||||||
}: SummaryImpressionsProps) => {
|
|
||||||
const { t } = useTranslation();
|
|
||||||
|
|
||||||
const renderContent = () => {
|
|
||||||
if (displaysError) {
|
|
||||||
return (
|
|
||||||
<div className="p-8">
|
|
||||||
<div className="flex flex-col items-center gap-4 text-center">
|
|
||||||
<div className="flex items-center gap-2 text-red-600">
|
|
||||||
<AlertCircleIcon className="h-5 w-5" />
|
|
||||||
<span className="text-sm font-medium">{t("common.error_loading_data")}</span>
|
|
||||||
</div>
|
|
||||||
<p className="text-sm text-slate-500">{displaysError}</p>
|
|
||||||
<Button onClick={onRetry} variant="secondary" size="sm">
|
|
||||||
{t("common.try_again")}
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (displays.length === 0) {
|
|
||||||
return (
|
|
||||||
<div className="p-8 text-center text-sm text-slate-500">
|
|
||||||
{t("environments.surveys.summary.no_identified_impressions")}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<>
|
|
||||||
<div className="grid min-h-10 grid-cols-4 items-center border-b border-slate-200 bg-slate-100 text-sm font-semibold text-slate-600">
|
|
||||||
<div className="col-span-2 px-4 md:px-6">{t("common.user")}</div>
|
|
||||||
<div className="col-span-2 px-4 md:px-6">{t("environments.contacts.survey_viewed_at")}</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="max-h-[62vh] overflow-y-auto">
|
|
||||||
{displays.map((display) => (
|
|
||||||
<div
|
|
||||||
key={display.id}
|
|
||||||
className="grid grid-cols-4 items-center border-b border-slate-100 py-2 text-xs text-slate-800 last:border-transparent md:text-sm">
|
|
||||||
<div className="col-span-2 pl-4 md:pl-6">
|
|
||||||
{display.contact ? (
|
|
||||||
<Link
|
|
||||||
className="ph-no-capture break-all text-slate-600 hover:underline"
|
|
||||||
href={`/environments/${environmentId}/contacts/${display.contact.id}`}>
|
|
||||||
{getDisplayContactIdentifier(display)}
|
|
||||||
</Link>
|
|
||||||
) : (
|
|
||||||
<span className="break-all text-slate-600">{t("common.anonymous")}</span>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
<div className="col-span-2 px-4 text-slate-500 md:px-6">
|
|
||||||
{timeSince(display.createdAt.toString(), locale)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{hasMore && (
|
|
||||||
<div className="flex justify-center border-t border-slate-100 py-4">
|
|
||||||
<Button onClick={onLoadMore} variant="secondary" size="sm">
|
|
||||||
{t("common.load_more")}
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
if (isLoading) {
|
|
||||||
return (
|
|
||||||
<div className="rounded-xl border border-slate-200 bg-white p-8 shadow-sm">
|
|
||||||
<div className="flex items-center justify-center">
|
|
||||||
<div className="h-6 w-32 animate-pulse rounded-full bg-slate-200"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="rounded-xl border border-slate-200 bg-white shadow-sm">
|
|
||||||
<div className="flex items-center gap-2 rounded-t-xl border-b border-slate-200 bg-slate-50 px-4 py-3 text-sm text-slate-600">
|
|
||||||
<InfoIcon className="h-4 w-4 shrink-0" />
|
|
||||||
<span>{t("environments.surveys.summary.impressions_identified_only")}</span>
|
|
||||||
</div>
|
|
||||||
{renderContent()}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
@@ -1,106 +0,0 @@
|
|||||||
"use server";
|
|
||||||
|
|
||||||
import { z } from "zod";
|
|
||||||
import { ZId } from "@formbricks/types/common";
|
|
||||||
import { ResourceNotFoundError } from "@formbricks/types/errors";
|
|
||||||
import { ZResponseFilterCriteria } from "@formbricks/types/responses";
|
|
||||||
import { capturePostHogEvent } from "@/lib/posthog";
|
|
||||||
import { getResponseDownloadFile, getResponseFilteringValues } from "@/lib/response/service";
|
|
||||||
import { getSurvey } from "@/lib/survey/service";
|
|
||||||
import { getTagsByEnvironmentId } from "@/lib/tag/service";
|
|
||||||
import { authenticatedActionClient } from "@/lib/utils/action-client";
|
|
||||||
import { checkAuthorizationUpdated } from "@/lib/utils/action-client/action-client-middleware";
|
|
||||||
import { getOrganizationIdFromSurveyId, getProjectIdFromSurveyId } from "@/lib/utils/helper";
|
|
||||||
import { getIsQuotasEnabled } from "@/modules/ee/license-check/lib/utils";
|
|
||||||
import { getQuotas } from "@/modules/ee/quotas/lib/quotas";
|
|
||||||
import { getOrganizationBilling } from "@/modules/survey/lib/survey";
|
|
||||||
|
|
||||||
const ZGetResponsesDownloadUrlAction = z.object({
|
|
||||||
surveyId: ZId,
|
|
||||||
format: z.union([z.literal("csv"), z.literal("xlsx")]),
|
|
||||||
filterCriteria: ZResponseFilterCriteria,
|
|
||||||
});
|
|
||||||
|
|
||||||
export const getResponsesDownloadUrlAction = authenticatedActionClient
|
|
||||||
.inputSchema(ZGetResponsesDownloadUrlAction)
|
|
||||||
.action(async ({ ctx, parsedInput }) => {
|
|
||||||
const organizationId = await getOrganizationIdFromSurveyId(parsedInput.surveyId);
|
|
||||||
|
|
||||||
await checkAuthorizationUpdated({
|
|
||||||
userId: ctx.user.id,
|
|
||||||
organizationId,
|
|
||||||
access: [
|
|
||||||
{
|
|
||||||
type: "organization",
|
|
||||||
roles: ["owner", "manager"],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "projectTeam",
|
|
||||||
minPermission: "read",
|
|
||||||
projectId: await getProjectIdFromSurveyId(parsedInput.surveyId),
|
|
||||||
},
|
|
||||||
],
|
|
||||||
});
|
|
||||||
|
|
||||||
const result = await getResponseDownloadFile(
|
|
||||||
parsedInput.surveyId,
|
|
||||||
parsedInput.format,
|
|
||||||
parsedInput.filterCriteria
|
|
||||||
);
|
|
||||||
|
|
||||||
capturePostHogEvent(ctx.user.id, "responses_exported", {
|
|
||||||
survey_id: parsedInput.surveyId,
|
|
||||||
format: parsedInput.format,
|
|
||||||
filter_applied: Object.keys(parsedInput.filterCriteria ?? {}).length > 0,
|
|
||||||
organization_id: organizationId,
|
|
||||||
});
|
|
||||||
|
|
||||||
return result;
|
|
||||||
});
|
|
||||||
|
|
||||||
const ZGetSurveyFilterDataAction = z.object({
|
|
||||||
surveyId: ZId,
|
|
||||||
});
|
|
||||||
|
|
||||||
export const getSurveyFilterDataAction = authenticatedActionClient
|
|
||||||
.inputSchema(ZGetSurveyFilterDataAction)
|
|
||||||
.action(async ({ ctx, parsedInput }) => {
|
|
||||||
const survey = await getSurvey(parsedInput.surveyId);
|
|
||||||
|
|
||||||
if (!survey) {
|
|
||||||
throw new ResourceNotFoundError("Survey", parsedInput.surveyId);
|
|
||||||
}
|
|
||||||
|
|
||||||
const organizationId = await getOrganizationIdFromSurveyId(parsedInput.surveyId);
|
|
||||||
|
|
||||||
await checkAuthorizationUpdated({
|
|
||||||
userId: ctx.user.id,
|
|
||||||
organizationId: organizationId,
|
|
||||||
access: [
|
|
||||||
{
|
|
||||||
type: "organization",
|
|
||||||
roles: ["owner", "manager"],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
type: "projectTeam",
|
|
||||||
minPermission: "read",
|
|
||||||
projectId: await getProjectIdFromSurveyId(parsedInput.surveyId),
|
|
||||||
},
|
|
||||||
],
|
|
||||||
});
|
|
||||||
|
|
||||||
const organizationBilling = await getOrganizationBilling(organizationId);
|
|
||||||
if (!organizationBilling) {
|
|
||||||
throw new ResourceNotFoundError("Organization", organizationId);
|
|
||||||
}
|
|
||||||
|
|
||||||
const isQuotasAllowed = await getIsQuotasEnabled(organizationId);
|
|
||||||
|
|
||||||
const [tags, { contactAttributes: attributes, meta, hiddenFields }, quotas = []] = await Promise.all([
|
|
||||||
getTagsByEnvironmentId(survey.environmentId),
|
|
||||||
getResponseFilteringValues(parsedInput.surveyId),
|
|
||||||
isQuotasAllowed ? getQuotas(parsedInput.surveyId) : [],
|
|
||||||
]);
|
|
||||||
|
|
||||||
return { environmentTags: tags, attributes, meta, hiddenFields, quotas };
|
|
||||||
});
|
|
||||||
@@ -1,28 +0,0 @@
|
|||||||
import { IS_FORMBRICKS_CLOUD } from "@/lib/constants";
|
|
||||||
import { getEnvironmentAuth } from "@/modules/environments/lib/utils";
|
|
||||||
import { SettingsSidebar } from "@/modules/settings/components/settings-sidebar";
|
|
||||||
|
|
||||||
const SettingsLayout = async (props: {
|
|
||||||
params: Promise<{ environmentId: string }>;
|
|
||||||
children: React.ReactNode;
|
|
||||||
}) => {
|
|
||||||
const params = await props.params;
|
|
||||||
const { children } = props;
|
|
||||||
|
|
||||||
const { project, organization, currentUserMembership } = await getEnvironmentAuth(params.environmentId);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="flex h-screen min-h-screen overflow-hidden">
|
|
||||||
<SettingsSidebar
|
|
||||||
environmentId={params.environmentId}
|
|
||||||
projectName={project.name}
|
|
||||||
organizationName={organization.name}
|
|
||||||
isFormbricksCloud={IS_FORMBRICKS_CLOUD}
|
|
||||||
membershipRole={currentUserMembership?.role}
|
|
||||||
/>
|
|
||||||
<div className="flex flex-1 flex-col overflow-y-auto bg-slate-50">{children}</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default SettingsLayout;
|
|
||||||
@@ -1,139 +0,0 @@
|
|||||||
import { getServerSession } from "next-auth";
|
|
||||||
import { prisma } from "@formbricks/database";
|
|
||||||
import { AuthenticationError, ResourceNotFoundError } from "@formbricks/types/errors";
|
|
||||||
import { TUserNotificationSettings } from "@formbricks/types/user";
|
|
||||||
import { EditAlerts } from "@/app/(app)/environments/[environmentId]/settings/(account)/notifications/components/EditAlerts";
|
|
||||||
import { IntegrationsTip } from "@/app/(app)/environments/[environmentId]/settings/(account)/notifications/components/IntegrationsTip";
|
|
||||||
import type { Membership } from "@/app/(app)/environments/[environmentId]/settings/(account)/notifications/types";
|
|
||||||
import { SettingsCard } from "@/app/(app)/environments/[environmentId]/settings/components/SettingsCard";
|
|
||||||
import { getUser } from "@/lib/user/service";
|
|
||||||
import { getTranslate } from "@/lingodotdev/server";
|
|
||||||
import { authOptions } from "@/modules/auth/lib/authOptions";
|
|
||||||
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
|
||||||
import { PageHeader } from "@/modules/ui/components/page-header";
|
|
||||||
|
|
||||||
const setCompleteNotificationSettings = (
|
|
||||||
notificationSettings: TUserNotificationSettings,
|
|
||||||
memberships: Membership[]
|
|
||||||
): TUserNotificationSettings => {
|
|
||||||
const newNotificationSettings: TUserNotificationSettings = {
|
|
||||||
alert: {} as Record<string, boolean>,
|
|
||||||
unsubscribedOrganizationIds: notificationSettings.unsubscribedOrganizationIds || [],
|
|
||||||
};
|
|
||||||
for (const membership of memberships) {
|
|
||||||
for (const project of membership.organization.projects) {
|
|
||||||
for (const environment of project.environments) {
|
|
||||||
for (const survey of environment.surveys) {
|
|
||||||
newNotificationSettings.alert[survey.id] =
|
|
||||||
(notificationSettings as unknown as Record<string, Record<string, boolean>>)[survey.id]
|
|
||||||
?.responseFinished ||
|
|
||||||
(notificationSettings.alert && notificationSettings.alert[survey.id]) ||
|
|
||||||
false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return newNotificationSettings;
|
|
||||||
};
|
|
||||||
|
|
||||||
const getMemberships = async (userId: string): Promise<Membership[]> => {
|
|
||||||
const memberships = await prisma.membership.findMany({
|
|
||||||
where: {
|
|
||||||
userId,
|
|
||||||
role: { not: "billing" },
|
|
||||||
OR: [
|
|
||||||
{ role: { in: ["owner", "manager"] } },
|
|
||||||
{
|
|
||||||
organization: {
|
|
||||||
projects: {
|
|
||||||
some: {
|
|
||||||
projectTeams: { some: { team: { teamUsers: { some: { userId } } } } },
|
|
||||||
},
|
|
||||||
},
|
|
||||||
},
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
select: {
|
|
||||||
organization: {
|
|
||||||
select: {
|
|
||||||
id: true,
|
|
||||||
name: true,
|
|
||||||
projects: {
|
|
||||||
where: {
|
|
||||||
OR: [
|
|
||||||
{
|
|
||||||
organization: {
|
|
||||||
memberships: { some: { userId, role: { in: ["owner", "manager"] } } },
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{ projectTeams: { some: { team: { teamUsers: { some: { userId } } } } } },
|
|
||||||
],
|
|
||||||
},
|
|
||||||
select: {
|
|
||||||
id: true,
|
|
||||||
name: true,
|
|
||||||
environments: {
|
|
||||||
where: { type: "production" },
|
|
||||||
select: {
|
|
||||||
id: true,
|
|
||||||
surveys: { select: { id: true, name: true } },
|
|
||||||
},
|
|
||||||
},
|
|
||||||
},
|
|
||||||
},
|
|
||||||
},
|
|
||||||
},
|
|
||||||
},
|
|
||||||
});
|
|
||||||
return memberships;
|
|
||||||
};
|
|
||||||
|
|
||||||
const Page = async (props: {
|
|
||||||
params: Promise<{ environmentId: string }>;
|
|
||||||
searchParams: Promise<Record<string, string>>;
|
|
||||||
}) => {
|
|
||||||
const searchParams = await props.searchParams;
|
|
||||||
const params = await props.params;
|
|
||||||
const t = await getTranslate();
|
|
||||||
const session = await getServerSession(authOptions);
|
|
||||||
if (!session) {
|
|
||||||
throw new AuthenticationError(t("common.not_authenticated"));
|
|
||||||
}
|
|
||||||
const autoDisableNotificationType = searchParams["type"];
|
|
||||||
const autoDisableNotificationElementId = searchParams["elementId"];
|
|
||||||
|
|
||||||
const [user, memberships] = await Promise.all([getUser(session.user.id), getMemberships(session.user.id)]);
|
|
||||||
if (!user) {
|
|
||||||
throw new AuthenticationError(t("common.not_authenticated"));
|
|
||||||
}
|
|
||||||
|
|
||||||
if (!memberships) {
|
|
||||||
throw new ResourceNotFoundError(t("common.membership"), null);
|
|
||||||
}
|
|
||||||
|
|
||||||
if (user?.notificationSettings) {
|
|
||||||
user.notificationSettings = setCompleteNotificationSettings(user.notificationSettings, memberships);
|
|
||||||
}
|
|
||||||
return (
|
|
||||||
<PageContentWrapper>
|
|
||||||
<PageHeader pageTitle={t("common.account_settings")} />
|
|
||||||
<SettingsCard
|
|
||||||
title={t("environments.settings.notifications.email_alerts_surveys")}
|
|
||||||
description={t(
|
|
||||||
"environments.settings.notifications.set_up_an_alert_to_get_an_email_on_new_responses"
|
|
||||||
)}>
|
|
||||||
<EditAlerts
|
|
||||||
memberships={memberships}
|
|
||||||
user={user}
|
|
||||||
environmentId={params.environmentId}
|
|
||||||
autoDisableNotificationType={autoDisableNotificationType}
|
|
||||||
autoDisableNotificationElementId={autoDisableNotificationElementId}
|
|
||||||
/>
|
|
||||||
</SettingsCard>
|
|
||||||
<IntegrationsTip environmentId={params.environmentId} />
|
|
||||||
</PageContentWrapper>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default Page;
|
|
||||||
@@ -1,99 +0,0 @@
|
|||||||
import { AuthenticationError } from "@formbricks/types/errors";
|
|
||||||
import { AccountSecurity } from "@/app/(app)/environments/[environmentId]/settings/(account)/profile/components/AccountSecurity";
|
|
||||||
import { DeleteAccount } from "@/app/(app)/environments/[environmentId]/settings/(account)/profile/components/DeleteAccount";
|
|
||||||
import { EditProfileDetailsForm } from "@/app/(app)/environments/[environmentId]/settings/(account)/profile/components/EditProfileDetailsForm";
|
|
||||||
import { SettingsCard } from "@/app/(app)/environments/[environmentId]/settings/components/SettingsCard";
|
|
||||||
import { EMAIL_VERIFICATION_DISABLED, IS_FORMBRICKS_CLOUD, PASSWORD_RESET_DISABLED } from "@/lib/constants";
|
|
||||||
import { getOrganizationsWhereUserIsSingleOwner } from "@/lib/organization/service";
|
|
||||||
import { getUser } from "@/lib/user/service";
|
|
||||||
import { getTranslate } from "@/lingodotdev/server";
|
|
||||||
import { getIsMultiOrgEnabled, getIsTwoFactorAuthEnabled } from "@/modules/ee/license-check/lib/utils";
|
|
||||||
import { getEnvironmentAuth } from "@/modules/environments/lib/utils";
|
|
||||||
import { IdBadge } from "@/modules/ui/components/id-badge";
|
|
||||||
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
|
||||||
import { PageHeader } from "@/modules/ui/components/page-header";
|
|
||||||
import { UpgradePrompt } from "@/modules/ui/components/upgrade-prompt";
|
|
||||||
|
|
||||||
const Page = async (props: { params: Promise<{ environmentId: string }> }) => {
|
|
||||||
const isTwoFactorAuthEnabled = await getIsTwoFactorAuthEnabled();
|
|
||||||
const isMultiOrgEnabled = await getIsMultiOrgEnabled();
|
|
||||||
const params = await props.params;
|
|
||||||
const t = await getTranslate();
|
|
||||||
const { environmentId } = params;
|
|
||||||
|
|
||||||
const { session } = await getEnvironmentAuth(params.environmentId);
|
|
||||||
|
|
||||||
const organizationsWithSingleOwner = await getOrganizationsWhereUserIsSingleOwner(session.user.id);
|
|
||||||
|
|
||||||
const user = session?.user ? await getUser(session.user.id) : null;
|
|
||||||
|
|
||||||
if (!user) {
|
|
||||||
throw new AuthenticationError(t("common.not_authenticated"));
|
|
||||||
}
|
|
||||||
|
|
||||||
const isPasswordResetEnabled = !PASSWORD_RESET_DISABLED && user.identityProvider === "email";
|
|
||||||
|
|
||||||
return (
|
|
||||||
<PageContentWrapper>
|
|
||||||
<PageHeader pageTitle={t("common.account_settings")} />
|
|
||||||
{user && (
|
|
||||||
<div>
|
|
||||||
<SettingsCard
|
|
||||||
title={t("environments.settings.profile.personal_information")}
|
|
||||||
description={t("environments.settings.profile.update_personal_info")}>
|
|
||||||
<EditProfileDetailsForm
|
|
||||||
user={user}
|
|
||||||
emailVerificationDisabled={EMAIL_VERIFICATION_DISABLED}
|
|
||||||
isPasswordResetEnabled={isPasswordResetEnabled}
|
|
||||||
/>
|
|
||||||
</SettingsCard>
|
|
||||||
{user.identityProvider === "email" && (
|
|
||||||
<SettingsCard
|
|
||||||
title={t("common.security")}
|
|
||||||
description={t("environments.settings.profile.security_description")}>
|
|
||||||
{!isTwoFactorAuthEnabled && !user.twoFactorEnabled ? (
|
|
||||||
<UpgradePrompt
|
|
||||||
title={t("environments.settings.profile.unlock_two_factor_authentication")}
|
|
||||||
description={t("environments.settings.profile.two_factor_authentication_description")}
|
|
||||||
buttons={[
|
|
||||||
{
|
|
||||||
text: IS_FORMBRICKS_CLOUD
|
|
||||||
? t("common.upgrade_plan")
|
|
||||||
: t("common.request_trial_license"),
|
|
||||||
href: IS_FORMBRICKS_CLOUD
|
|
||||||
? `/environments/${environmentId}/settings/organization/billing`
|
|
||||||
: "https://formbricks.com/upgrade-self-hosting-license",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
text: t("common.learn_more"),
|
|
||||||
href: IS_FORMBRICKS_CLOUD
|
|
||||||
? `/environments/${environmentId}/settings/organization/billing`
|
|
||||||
: "https://formbricks.com/learn-more-self-hosting-license",
|
|
||||||
},
|
|
||||||
]}
|
|
||||||
/>
|
|
||||||
) : (
|
|
||||||
<AccountSecurity user={user} />
|
|
||||||
)}
|
|
||||||
</SettingsCard>
|
|
||||||
)}
|
|
||||||
|
|
||||||
<SettingsCard
|
|
||||||
title={t("environments.settings.profile.delete_account")}
|
|
||||||
description={t("environments.settings.profile.confirm_delete_account")}>
|
|
||||||
<DeleteAccount
|
|
||||||
session={session}
|
|
||||||
IS_FORMBRICKS_CLOUD={IS_FORMBRICKS_CLOUD}
|
|
||||||
user={user}
|
|
||||||
organizationsWithSingleOwner={organizationsWithSingleOwner}
|
|
||||||
isMultiOrgEnabled={isMultiOrgEnabled}
|
|
||||||
/>
|
|
||||||
</SettingsCard>
|
|
||||||
<IdBadge id={user.id} label={t("common.profile_id")} variant="column" />
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</PageContentWrapper>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default Page;
|
|
||||||
@@ -1,43 +0,0 @@
|
|||||||
import { SettingsCard } from "@/app/(app)/environments/[environmentId]/settings/components/SettingsCard";
|
|
||||||
import { DEFAULT_LOCALE, IS_FORMBRICKS_CLOUD } from "@/lib/constants";
|
|
||||||
import { getUserLocale } from "@/lib/user/service";
|
|
||||||
import { getTranslate } from "@/lingodotdev/server";
|
|
||||||
import { getEnvironmentAuth } from "@/modules/environments/lib/utils";
|
|
||||||
import { ApiKeyList } from "@/modules/organization/settings/api-keys/components/api-key-list";
|
|
||||||
import { getProjectsByOrganizationId } from "@/modules/organization/settings/api-keys/lib/projects";
|
|
||||||
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
|
||||||
import { PageHeader } from "@/modules/ui/components/page-header";
|
|
||||||
|
|
||||||
const Page = async (props: { params: Promise<{ environmentId: string }> }) => {
|
|
||||||
const params = await props.params;
|
|
||||||
const t = await getTranslate();
|
|
||||||
|
|
||||||
const { currentUserMembership, organization, session } = await getEnvironmentAuth(params.environmentId);
|
|
||||||
|
|
||||||
const [projects, locale] = await Promise.all([
|
|
||||||
getProjectsByOrganizationId(organization.id),
|
|
||||||
getUserLocale(session.user.id),
|
|
||||||
]);
|
|
||||||
|
|
||||||
const canAccessApiKeys = currentUserMembership.role === "owner" || currentUserMembership.role === "manager";
|
|
||||||
|
|
||||||
if (!canAccessApiKeys) throw new Error(t("common.not_authorized"));
|
|
||||||
|
|
||||||
return (
|
|
||||||
<PageContentWrapper>
|
|
||||||
<PageHeader pageTitle={t("environments.settings.general.organization_settings")} />
|
|
||||||
<SettingsCard
|
|
||||||
title={t("common.api_keys")}
|
|
||||||
description={t("environments.settings.api_keys.api_keys_description")}>
|
|
||||||
<ApiKeyList
|
|
||||||
organizationId={organization.id}
|
|
||||||
locale={locale ?? DEFAULT_LOCALE}
|
|
||||||
isReadOnly={!canAccessApiKeys}
|
|
||||||
projects={projects}
|
|
||||||
/>
|
|
||||||
</SettingsCard>
|
|
||||||
</PageContentWrapper>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default Page;
|
|
||||||
@@ -1,64 +0,0 @@
|
|||||||
import { notFound } from "next/navigation";
|
|
||||||
import { IS_FORMBRICKS_CLOUD } from "@/lib/constants";
|
|
||||||
import { getMonthlyOrganizationResponseCount } from "@/lib/organization/service";
|
|
||||||
import { getOrganizationProjectsCount } from "@/lib/project/service";
|
|
||||||
import { getTranslate } from "@/lingodotdev/server";
|
|
||||||
import { PricingTable } from "@/modules/ee/billing/components/pricing-table";
|
|
||||||
import { getCloudBillingDisplayContext } from "@/modules/ee/billing/lib/cloud-billing-display";
|
|
||||||
import { getStripeBillingCatalogDisplay } from "@/modules/ee/billing/lib/stripe-billing-catalog";
|
|
||||||
import { getEnvironmentAuth } from "@/modules/environments/lib/utils";
|
|
||||||
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
|
||||||
import { PageHeader } from "@/modules/ui/components/page-header";
|
|
||||||
|
|
||||||
const Page = async (props: { params: Promise<{ environmentId: string }> }) => {
|
|
||||||
const params = await props.params;
|
|
||||||
const t = await getTranslate();
|
|
||||||
|
|
||||||
const { organization, isMember, currentUserMembership } = await getEnvironmentAuth(params.environmentId);
|
|
||||||
|
|
||||||
if (!IS_FORMBRICKS_CLOUD) {
|
|
||||||
notFound();
|
|
||||||
}
|
|
||||||
|
|
||||||
const [cloudBillingDisplayContext, billingCatalog] = await Promise.all([
|
|
||||||
getCloudBillingDisplayContext(organization.id),
|
|
||||||
getStripeBillingCatalogDisplay(),
|
|
||||||
]);
|
|
||||||
|
|
||||||
const organizationWithSyncedBilling = {
|
|
||||||
...organization,
|
|
||||||
billing: cloudBillingDisplayContext.billing,
|
|
||||||
};
|
|
||||||
|
|
||||||
const [responseCount, projectCount] = await Promise.all([
|
|
||||||
getMonthlyOrganizationResponseCount(organization.id),
|
|
||||||
getOrganizationProjectsCount(organization.id),
|
|
||||||
]);
|
|
||||||
|
|
||||||
const hasBillingRights = !isMember;
|
|
||||||
|
|
||||||
return (
|
|
||||||
<PageContentWrapper>
|
|
||||||
<PageHeader pageTitle={t("environments.settings.general.organization_settings")} />
|
|
||||||
|
|
||||||
<PricingTable
|
|
||||||
organization={organizationWithSyncedBilling}
|
|
||||||
environmentId={params.environmentId}
|
|
||||||
responseCount={responseCount}
|
|
||||||
projectCount={projectCount}
|
|
||||||
hasBillingRights={hasBillingRights}
|
|
||||||
currentCloudPlan={cloudBillingDisplayContext.currentCloudPlan}
|
|
||||||
currentBillingInterval={cloudBillingDisplayContext.currentBillingInterval}
|
|
||||||
currentSubscriptionStatus={cloudBillingDisplayContext.currentSubscriptionStatus}
|
|
||||||
pendingChange={cloudBillingDisplayContext.pendingChange}
|
|
||||||
usageCycleStart={cloudBillingDisplayContext.usageCycleStart}
|
|
||||||
usageCycleEnd={cloudBillingDisplayContext.usageCycleEnd}
|
|
||||||
isStripeSetupIncomplete={!organizationWithSyncedBilling.billing.stripeCustomerId}
|
|
||||||
trialDaysRemaining={cloudBillingDisplayContext.trialDaysRemaining}
|
|
||||||
billingCatalog={billingCatalog}
|
|
||||||
/>
|
|
||||||
</PageContentWrapper>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default Page;
|
|
||||||
@@ -1,65 +0,0 @@
|
|||||||
import { notFound } from "next/navigation";
|
|
||||||
import { AuthenticationError } from "@formbricks/types/errors";
|
|
||||||
import { PrettyUrlsTable } from "@/app/(app)/environments/[environmentId]/settings/(organization)/domain/components/pretty-urls-table";
|
|
||||||
import { SettingsCard } from "@/app/(app)/environments/[environmentId]/settings/components/SettingsCard";
|
|
||||||
import { IS_FORMBRICKS_CLOUD, IS_STORAGE_CONFIGURED } from "@/lib/constants";
|
|
||||||
import { getTranslate } from "@/lingodotdev/server";
|
|
||||||
import { getWhiteLabelPermission } from "@/modules/ee/license-check/lib/utils";
|
|
||||||
import { FaviconCustomizationSettings } from "@/modules/ee/whitelabel/favicon-customization/components/favicon-customization-settings";
|
|
||||||
import { getEnvironmentAuth } from "@/modules/environments/lib/utils";
|
|
||||||
import { getSurveysWithSlugsByOrganizationId } from "@/modules/survey/lib/slug";
|
|
||||||
import { Alert, AlertDescription } from "@/modules/ui/components/alert";
|
|
||||||
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
|
||||||
import { PageHeader } from "@/modules/ui/components/page-header";
|
|
||||||
|
|
||||||
const Page = async (props: { params: Promise<{ environmentId: string }> }) => {
|
|
||||||
const params = await props.params;
|
|
||||||
const t = await getTranslate();
|
|
||||||
|
|
||||||
if (IS_FORMBRICKS_CLOUD) {
|
|
||||||
return notFound();
|
|
||||||
}
|
|
||||||
|
|
||||||
const { session, currentUserMembership, organization, isOwner, isManager } = await getEnvironmentAuth(
|
|
||||||
params.environmentId
|
|
||||||
);
|
|
||||||
|
|
||||||
if (!session) {
|
|
||||||
throw new AuthenticationError(t("common.not_authenticated"));
|
|
||||||
}
|
|
||||||
|
|
||||||
const hasWhiteLabelPermission = await getWhiteLabelPermission(organization.id);
|
|
||||||
const isOwnerOrManager = isManager || isOwner;
|
|
||||||
|
|
||||||
const surveys = await getSurveysWithSlugsByOrganizationId(organization.id);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<PageContentWrapper>
|
|
||||||
<PageHeader pageTitle={t("environments.settings.general.organization_settings")} />
|
|
||||||
|
|
||||||
{!IS_STORAGE_CONFIGURED && (
|
|
||||||
<div className="max-w-4xl">
|
|
||||||
<Alert variant="warning">
|
|
||||||
<AlertDescription>{t("common.storage_not_configured")}</AlertDescription>
|
|
||||||
</Alert>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
|
|
||||||
<FaviconCustomizationSettings
|
|
||||||
organization={organization}
|
|
||||||
hasWhiteLabelPermission={hasWhiteLabelPermission}
|
|
||||||
environmentId={params.environmentId}
|
|
||||||
isReadOnly={!isOwnerOrManager}
|
|
||||||
isStorageConfigured={IS_STORAGE_CONFIGURED}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<SettingsCard
|
|
||||||
title={t("environments.settings.domain.title")}
|
|
||||||
description={t("environments.settings.domain.description")}>
|
|
||||||
<PrettyUrlsTable surveys={surveys} />
|
|
||||||
</SettingsCard>
|
|
||||||
</PageContentWrapper>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default Page;
|
|
||||||
@@ -1,166 +0,0 @@
|
|||||||
import { CheckIcon } from "lucide-react";
|
|
||||||
import Link from "next/link";
|
|
||||||
import { notFound } from "next/navigation";
|
|
||||||
import { EnterpriseLicenseFeaturesTable } from "@/app/(app)/environments/[environmentId]/settings/(organization)/enterprise/components/EnterpriseLicenseFeaturesTable";
|
|
||||||
import { EnterpriseLicenseStatus } from "@/app/(app)/environments/[environmentId]/settings/(organization)/enterprise/components/EnterpriseLicenseStatus";
|
|
||||||
import { IS_FORMBRICKS_CLOUD } from "@/lib/constants";
|
|
||||||
import { getTranslate } from "@/lingodotdev/server";
|
|
||||||
import { GRACE_PERIOD_MS, getEnterpriseLicense } from "@/modules/ee/license-check/lib/license";
|
|
||||||
import { getEnvironmentAuth } from "@/modules/environments/lib/utils";
|
|
||||||
import { Button } from "@/modules/ui/components/button";
|
|
||||||
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
|
||||||
import { PageHeader } from "@/modules/ui/components/page-header";
|
|
||||||
|
|
||||||
const Page = async (props: { params: Promise<{ environmentId: string }> }) => {
|
|
||||||
const params = await props.params;
|
|
||||||
const t = await getTranslate();
|
|
||||||
if (IS_FORMBRICKS_CLOUD) {
|
|
||||||
return notFound();
|
|
||||||
}
|
|
||||||
|
|
||||||
const { isMember, currentUserMembership } = await getEnvironmentAuth(params.environmentId);
|
|
||||||
|
|
||||||
const isPricingDisabled = isMember;
|
|
||||||
|
|
||||||
if (isPricingDisabled) {
|
|
||||||
return notFound();
|
|
||||||
}
|
|
||||||
|
|
||||||
const licenseState = await getEnterpriseLicense();
|
|
||||||
const hasLicense = licenseState.status !== "no-license";
|
|
||||||
|
|
||||||
const paidFeatures = [
|
|
||||||
{ title: t("environments.settings.billing.remove_branding"), comingSoon: false, onRequest: false },
|
|
||||||
{ title: t("environments.settings.enterprise.sso"), comingSoon: false, onRequest: false },
|
|
||||||
{
|
|
||||||
title: t("environments.workspace.languages.multi_language_surveys"),
|
|
||||||
comingSoon: false,
|
|
||||||
onRequest: false,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: t("environments.settings.enterprise.organization_roles"),
|
|
||||||
comingSoon: false,
|
|
||||||
onRequest: false,
|
|
||||||
},
|
|
||||||
{ title: t("environments.settings.enterprise.teams"), comingSoon: false, onRequest: false },
|
|
||||||
{
|
|
||||||
title: t("environments.settings.enterprise.contacts_and_segments"),
|
|
||||||
comingSoon: false,
|
|
||||||
onRequest: false,
|
|
||||||
},
|
|
||||||
{ title: t("environments.settings.enterprise.audit_logs"), comingSoon: false, onRequest: true },
|
|
||||||
{ title: t("environments.settings.enterprise.saml_sso"), comingSoon: false, onRequest: true },
|
|
||||||
{
|
|
||||||
title: t("environments.settings.enterprise.service_level_agreement"),
|
|
||||||
comingSoon: false,
|
|
||||||
onRequest: true,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: t("environments.settings.enterprise.soc2_hipaa_iso_27001_compliance_check"),
|
|
||||||
comingSoon: false,
|
|
||||||
onRequest: true,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
return (
|
|
||||||
<PageContentWrapper>
|
|
||||||
<PageHeader pageTitle={t("environments.settings.general.organization_settings")} />
|
|
||||||
{hasLicense ? (
|
|
||||||
<>
|
|
||||||
<EnterpriseLicenseStatus
|
|
||||||
status={licenseState.status}
|
|
||||||
lastChecked={licenseState.lastChecked}
|
|
||||||
gracePeriodEnd={
|
|
||||||
licenseState.status === "unreachable"
|
|
||||||
? new Date(licenseState.lastChecked.getTime() + GRACE_PERIOD_MS)
|
|
||||||
: undefined
|
|
||||||
}
|
|
||||||
environmentId={params.environmentId}
|
|
||||||
/>
|
|
||||||
{licenseState.features && <EnterpriseLicenseFeaturesTable features={licenseState.features} />}
|
|
||||||
</>
|
|
||||||
) : (
|
|
||||||
<div>
|
|
||||||
<div className="relative isolate mt-8 overflow-hidden rounded-lg bg-slate-900 px-3 pt-8 shadow-2xl sm:px-8 md:pt-12 lg:flex lg:gap-x-10 lg:px-12 lg:pt-0">
|
|
||||||
<svg
|
|
||||||
viewBox="0 0 1024 1024"
|
|
||||||
className="absolute left-1/2 top-1/2 -z-10 h-[64rem] w-[64rem] -translate-y-1/2 [mask-image:radial-gradient(closest-side,white,transparent)] sm:left-full sm:-ml-80 lg:left-1/2 lg:ml-0 lg:-translate-x-1/2 lg:translate-y-0"
|
|
||||||
aria-hidden="true">
|
|
||||||
<circle
|
|
||||||
cx={512}
|
|
||||||
cy={512}
|
|
||||||
r={512}
|
|
||||||
fill="url(#759c1415-0410-454c-8f7c-9a820de03641)"
|
|
||||||
fillOpacity="0.7"
|
|
||||||
/>
|
|
||||||
<defs>
|
|
||||||
<radialGradient id="759c1415-0410-454c-8f7c-9a820de03641">
|
|
||||||
<stop stopColor="#00E6CA" />
|
|
||||||
<stop offset={0} stopColor="#00C4B8" />
|
|
||||||
</radialGradient>
|
|
||||||
</defs>
|
|
||||||
</svg>
|
|
||||||
<div className="mx-auto text-center lg:mx-0 lg:flex-auto lg:py-16 lg:text-left">
|
|
||||||
<h2 className="text-2xl font-bold text-white sm:text-3xl">
|
|
||||||
{t("environments.settings.enterprise.unlock_the_full_power_of_formbricks_free_for_30_days")}
|
|
||||||
</h2>
|
|
||||||
<p className="text-md mt-6 leading-8 text-slate-300">
|
|
||||||
{t("environments.settings.enterprise.keep_full_control_over_your_data_privacy_and_security")}
|
|
||||||
<br />
|
|
||||||
{t(
|
|
||||||
"environments.settings.enterprise.get_an_enterprise_license_to_get_access_to_all_features"
|
|
||||||
)}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="mt-8 rounded-lg border border-slate-300 bg-slate-100 shadow-sm">
|
|
||||||
<div className="p-8">
|
|
||||||
<h2 className="mr-2 inline-flex text-2xl font-bold text-slate-700">
|
|
||||||
{t("environments.settings.enterprise.enterprise_features")}
|
|
||||||
</h2>
|
|
||||||
<ul className="my-4 space-y-4">
|
|
||||||
{paidFeatures.map((feature) => (
|
|
||||||
<li key={feature.title} className="flex items-center">
|
|
||||||
<div className="rounded-full border border-green-300 bg-green-100 p-0.5 dark:bg-green-800">
|
|
||||||
<CheckIcon className="h-5 w-5 p-0.5 text-green-500 dark:text-green-400" />
|
|
||||||
</div>
|
|
||||||
<span className="ml-2 text-sm text-slate-500 dark:text-slate-400">{feature.title}</span>
|
|
||||||
{feature.comingSoon && (
|
|
||||||
<span className="mx-2 rounded-full bg-blue-100 px-3 py-1 text-xs text-blue-700 dark:bg-slate-700 dark:text-teal-500">
|
|
||||||
{t("environments.settings.enterprise.coming_soon")}
|
|
||||||
</span>
|
|
||||||
)}
|
|
||||||
{feature.onRequest && (
|
|
||||||
<span className="mx-2 rounded-full bg-violet-100 px-3 py-1 text-xs text-violet-700 dark:bg-slate-700 dark:text-teal-500">
|
|
||||||
{t("environments.settings.enterprise.on_request")}
|
|
||||||
</span>
|
|
||||||
)}
|
|
||||||
</li>
|
|
||||||
))}
|
|
||||||
</ul>
|
|
||||||
<p className="my-6 text-sm text-slate-700">
|
|
||||||
{t(
|
|
||||||
"environments.settings.enterprise.no_call_needed_no_strings_attached_request_a_free_30_day_trial_license_to_test_all_features_by_filling_out_this_form"
|
|
||||||
)}
|
|
||||||
</p>
|
|
||||||
<Button asChild>
|
|
||||||
<Link
|
|
||||||
href="https://app.formbricks.com/s/clvupq3y205i5yrm3sm9v1xt5"
|
|
||||||
target="_blank"
|
|
||||||
rel="noopener noreferrer nofollow"
|
|
||||||
referrerPolicy="no-referrer">
|
|
||||||
{t("environments.settings.enterprise.request_30_day_trial_license")}
|
|
||||||
</Link>
|
|
||||||
</Button>
|
|
||||||
<p className="mt-2 text-xs text-slate-500">
|
|
||||||
{t("environments.settings.enterprise.no_credit_card_no_sales_call_just_test_it")}
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</PageContentWrapper>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default Page;
|
|
||||||
@@ -1,96 +0,0 @@
|
|||||||
import { AISettingsToggle } from "@/app/(app)/environments/[environmentId]/settings/(organization)/general/components/AISettingsToggle";
|
|
||||||
import { DeleteOrganization } from "@/app/(app)/environments/[environmentId]/settings/(organization)/general/components/DeleteOrganization";
|
|
||||||
import { EditOrganizationNameForm } from "@/app/(app)/environments/[environmentId]/settings/(organization)/general/components/EditOrganizationNameForm";
|
|
||||||
import { SecurityListTip } from "@/app/(app)/environments/[environmentId]/settings/(organization)/general/components/SecurityListTip";
|
|
||||||
import { SettingsCard } from "@/app/(app)/environments/[environmentId]/settings/components/SettingsCard";
|
|
||||||
import { isInstanceAIConfigured } from "@/lib/ai/service";
|
|
||||||
import { FB_LOGO_URL, IS_FORMBRICKS_CLOUD, IS_STORAGE_CONFIGURED } from "@/lib/constants";
|
|
||||||
import { getUser } from "@/lib/user/service";
|
|
||||||
import { getTranslate } from "@/lingodotdev/server";
|
|
||||||
import { getIsMultiOrgEnabled, getWhiteLabelPermission } from "@/modules/ee/license-check/lib/utils";
|
|
||||||
import { EmailCustomizationSettings } from "@/modules/ee/whitelabel/email-customization/components/email-customization-settings";
|
|
||||||
import { getEnvironmentAuth } from "@/modules/environments/lib/utils";
|
|
||||||
import { Alert, AlertDescription } from "@/modules/ui/components/alert";
|
|
||||||
import { IdBadge } from "@/modules/ui/components/id-badge";
|
|
||||||
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
|
||||||
import { PageHeader } from "@/modules/ui/components/page-header";
|
|
||||||
import packageJson from "@/package.json";
|
|
||||||
|
|
||||||
const Page = async (props: { params: Promise<{ environmentId: string }> }) => {
|
|
||||||
const params = await props.params;
|
|
||||||
const t = await getTranslate();
|
|
||||||
|
|
||||||
const { session, currentUserMembership, organization, isOwner, isManager } = await getEnvironmentAuth(
|
|
||||||
params.environmentId
|
|
||||||
);
|
|
||||||
|
|
||||||
const user = session?.user?.id ? await getUser(session.user.id) : null;
|
|
||||||
|
|
||||||
const isMultiOrgEnabled = await getIsMultiOrgEnabled();
|
|
||||||
const hasWhiteLabelPermission = await getWhiteLabelPermission(organization.id);
|
|
||||||
|
|
||||||
const isDeleteDisabled = !isOwner || !isMultiOrgEnabled;
|
|
||||||
const currentUserRole = currentUserMembership?.role;
|
|
||||||
|
|
||||||
const isOwnerOrManager = isManager || isOwner;
|
|
||||||
|
|
||||||
return (
|
|
||||||
<PageContentWrapper>
|
|
||||||
<PageHeader pageTitle={t("environments.settings.general.organization_settings")} />
|
|
||||||
{!IS_STORAGE_CONFIGURED && (
|
|
||||||
<div className="max-w-4xl">
|
|
||||||
<Alert variant="warning">
|
|
||||||
<AlertDescription>{t("common.storage_not_configured")}</AlertDescription>
|
|
||||||
</Alert>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
{!IS_FORMBRICKS_CLOUD && <SecurityListTip />}
|
|
||||||
<SettingsCard
|
|
||||||
title={t("environments.settings.general.organization_name")}
|
|
||||||
description={t("environments.settings.general.organization_name_description")}>
|
|
||||||
<EditOrganizationNameForm
|
|
||||||
organization={organization}
|
|
||||||
environmentId={params.environmentId}
|
|
||||||
membershipRole={currentUserMembership?.role}
|
|
||||||
/>
|
|
||||||
</SettingsCard>
|
|
||||||
<SettingsCard
|
|
||||||
title={t("environments.settings.general.ai_enabled")}
|
|
||||||
description={t("environments.settings.general.ai_enabled_description")}>
|
|
||||||
<AISettingsToggle
|
|
||||||
organization={organization}
|
|
||||||
membershipRole={currentUserMembership?.role}
|
|
||||||
isInstanceAIConfigured={isInstanceAIConfigured()}
|
|
||||||
/>
|
|
||||||
</SettingsCard>
|
|
||||||
<EmailCustomizationSettings
|
|
||||||
organization={organization}
|
|
||||||
hasWhiteLabelPermission={hasWhiteLabelPermission}
|
|
||||||
environmentId={params.environmentId}
|
|
||||||
isReadOnly={!isOwnerOrManager}
|
|
||||||
isFormbricksCloud={IS_FORMBRICKS_CLOUD}
|
|
||||||
fbLogoUrl={FB_LOGO_URL}
|
|
||||||
user={user}
|
|
||||||
isStorageConfigured={IS_STORAGE_CONFIGURED}
|
|
||||||
/>
|
|
||||||
{isMultiOrgEnabled && (
|
|
||||||
<SettingsCard
|
|
||||||
title={t("environments.settings.general.delete_organization")}
|
|
||||||
description={t("environments.settings.general.delete_organization_description")}>
|
|
||||||
<DeleteOrganization
|
|
||||||
organization={organization}
|
|
||||||
isDeleteDisabled={isDeleteDisabled}
|
|
||||||
isUserOwner={currentUserRole === "owner"}
|
|
||||||
/>
|
|
||||||
</SettingsCard>
|
|
||||||
)}
|
|
||||||
|
|
||||||
<div className="space-y-2">
|
|
||||||
<IdBadge id={organization.id} label={t("common.organization_id")} variant="column" />
|
|
||||||
<IdBadge id={packageJson.version} label={t("common.formbricks_version")} variant="column" />
|
|
||||||
</div>
|
|
||||||
</PageContentWrapper>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default Page;
|
|
||||||
@@ -1,53 +0,0 @@
|
|||||||
import { IS_FORMBRICKS_CLOUD, USER_MANAGEMENT_MINIMUM_ROLE } from "@/lib/constants";
|
|
||||||
import { getUserManagementAccess } from "@/lib/membership/utils";
|
|
||||||
import { getTranslate } from "@/lingodotdev/server";
|
|
||||||
import { getAccessControlPermission } from "@/modules/ee/license-check/lib/utils";
|
|
||||||
import { getTeamsWhereUserIsAdmin } from "@/modules/ee/teams/lib/roles";
|
|
||||||
import { TeamsView } from "@/modules/ee/teams/team-list/components/teams-view";
|
|
||||||
import { getEnvironmentAuth } from "@/modules/environments/lib/utils";
|
|
||||||
import { MembersView } from "@/modules/organization/settings/teams/components/members-view";
|
|
||||||
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
|
||||||
import { PageHeader } from "@/modules/ui/components/page-header";
|
|
||||||
|
|
||||||
const Page = async (props: { params: Promise<{ environmentId: string }> }) => {
|
|
||||||
const params = await props.params;
|
|
||||||
const t = await getTranslate();
|
|
||||||
|
|
||||||
const { session, currentUserMembership, organization } = await getEnvironmentAuth(params.environmentId);
|
|
||||||
|
|
||||||
const isAccessControlAllowed = await getAccessControlPermission(organization.id);
|
|
||||||
|
|
||||||
const hasStandardUserManagementAccess = getUserManagementAccess(
|
|
||||||
currentUserMembership?.role,
|
|
||||||
USER_MANAGEMENT_MINIMUM_ROLE
|
|
||||||
);
|
|
||||||
|
|
||||||
const userAdminTeamIds = await getTeamsWhereUserIsAdmin(session.user.id, organization.id);
|
|
||||||
const isTeamAdminUser = userAdminTeamIds.length > 0;
|
|
||||||
|
|
||||||
const hasUserManagementAccess =
|
|
||||||
hasStandardUserManagementAccess || (isAccessControlAllowed && isTeamAdminUser);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<PageContentWrapper>
|
|
||||||
<PageHeader pageTitle={t("environments.settings.general.organization_settings")} />
|
|
||||||
<MembersView
|
|
||||||
membershipRole={currentUserMembership?.role}
|
|
||||||
organization={organization}
|
|
||||||
currentUserId={session.user.id}
|
|
||||||
environmentId={params.environmentId}
|
|
||||||
isAccessControlAllowed={isAccessControlAllowed}
|
|
||||||
isUserManagementDisabledFromUi={!hasUserManagementAccess}
|
|
||||||
/>
|
|
||||||
<TeamsView
|
|
||||||
organizationId={organization.id}
|
|
||||||
membershipRole={currentUserMembership?.role}
|
|
||||||
currentUserId={session.user.id}
|
|
||||||
isAccessControlAllowed={isAccessControlAllowed}
|
|
||||||
environmentId={params.environmentId}
|
|
||||||
/>
|
|
||||||
</PageContentWrapper>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default Page;
|
|
||||||
@@ -1,3 +0,0 @@
|
|||||||
import { ProjectLookSettingsPage } from "@/modules/projects/settings/look/page";
|
|
||||||
|
|
||||||
export default ProjectLookSettingsPage;
|
|
||||||
@@ -1,3 +0,0 @@
|
|||||||
import { AppConnectionPage } from "@/modules/projects/settings/(setup)/app-connection/page";
|
|
||||||
|
|
||||||
export default AppConnectionPage;
|
|
||||||
@@ -1,3 +0,0 @@
|
|||||||
import { GeneralSettingsPage } from "@/modules/projects/settings/general/page";
|
|
||||||
|
|
||||||
export default GeneralSettingsPage;
|
|
||||||
@@ -1,62 +0,0 @@
|
|||||||
import { redirect } from "next/navigation";
|
|
||||||
import { TIntegrationItem } from "@formbricks/types/integration";
|
|
||||||
import { TIntegrationAirtable } from "@formbricks/types/integration/airtable";
|
|
||||||
import { AirtableWrapper } from "@/app/(app)/environments/[environmentId]/workspace/integrations/airtable/components/AirtableWrapper";
|
|
||||||
import { getSurveys } from "@/app/(app)/environments/[environmentId]/workspace/integrations/lib/surveys";
|
|
||||||
import { getAirtableTables } from "@/lib/airtable/service";
|
|
||||||
import { AIRTABLE_CLIENT_ID, DEFAULT_LOCALE, WEBAPP_URL } from "@/lib/constants";
|
|
||||||
import { getIntegrations } from "@/lib/integration/service";
|
|
||||||
import { getUserLocale } from "@/lib/user/service";
|
|
||||||
import { getTranslate } from "@/lingodotdev/server";
|
|
||||||
import { getEnvironmentAuth } from "@/modules/environments/lib/utils";
|
|
||||||
import { GoBackButton } from "@/modules/ui/components/go-back-button";
|
|
||||||
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
|
||||||
import { PageHeader } from "@/modules/ui/components/page-header";
|
|
||||||
|
|
||||||
const Page = async (props: { params: Promise<{ environmentId: string }> }) => {
|
|
||||||
const params = await props.params;
|
|
||||||
const t = await getTranslate();
|
|
||||||
const isEnabled = !!AIRTABLE_CLIENT_ID;
|
|
||||||
|
|
||||||
const { isReadOnly, environment, session } = await getEnvironmentAuth(params.environmentId);
|
|
||||||
|
|
||||||
const [surveys, integrations, locale] = await Promise.all([
|
|
||||||
getSurveys(params.environmentId),
|
|
||||||
getIntegrations(params.environmentId),
|
|
||||||
getUserLocale(session.user.id),
|
|
||||||
]);
|
|
||||||
|
|
||||||
const airtableIntegration: TIntegrationAirtable | undefined = integrations?.find(
|
|
||||||
(integration): integration is TIntegrationAirtable => integration.type === "airtable"
|
|
||||||
);
|
|
||||||
|
|
||||||
let airtableArray: TIntegrationItem[] = [];
|
|
||||||
if (airtableIntegration?.config.key) {
|
|
||||||
airtableArray = await getAirtableTables(params.environmentId);
|
|
||||||
}
|
|
||||||
if (isReadOnly) {
|
|
||||||
return redirect("./");
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<PageContentWrapper>
|
|
||||||
<GoBackButton
|
|
||||||
url={`${WEBAPP_URL}/environments/${params.environmentId}/settings/workspace/integrations`}
|
|
||||||
/>
|
|
||||||
<PageHeader pageTitle={t("environments.integrations.airtable.airtable_integration")} />
|
|
||||||
<div className="h-[75vh] w-full">
|
|
||||||
<AirtableWrapper
|
|
||||||
isEnabled={isEnabled}
|
|
||||||
airtableIntegration={airtableIntegration}
|
|
||||||
airtableArray={airtableArray}
|
|
||||||
environmentId={environment.id}
|
|
||||||
surveys={surveys}
|
|
||||||
webAppUrl={WEBAPP_URL}
|
|
||||||
locale={locale ?? DEFAULT_LOCALE}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</PageContentWrapper>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default Page;
|
|
||||||
@@ -1,60 +0,0 @@
|
|||||||
import { redirect } from "next/navigation";
|
|
||||||
import { TIntegrationGoogleSheets } from "@formbricks/types/integration/google-sheet";
|
|
||||||
import { GoogleSheetWrapper } from "@/app/(app)/environments/[environmentId]/workspace/integrations/google-sheets/components/GoogleSheetWrapper";
|
|
||||||
import { getSurveys } from "@/app/(app)/environments/[environmentId]/workspace/integrations/lib/surveys";
|
|
||||||
import {
|
|
||||||
DEFAULT_LOCALE,
|
|
||||||
GOOGLE_SHEETS_CLIENT_ID,
|
|
||||||
GOOGLE_SHEETS_CLIENT_SECRET,
|
|
||||||
GOOGLE_SHEETS_REDIRECT_URL,
|
|
||||||
WEBAPP_URL,
|
|
||||||
} from "@/lib/constants";
|
|
||||||
import { getIntegrations } from "@/lib/integration/service";
|
|
||||||
import { getUserLocale } from "@/lib/user/service";
|
|
||||||
import { getTranslate } from "@/lingodotdev/server";
|
|
||||||
import { getEnvironmentAuth } from "@/modules/environments/lib/utils";
|
|
||||||
import { GoBackButton } from "@/modules/ui/components/go-back-button";
|
|
||||||
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
|
||||||
import { PageHeader } from "@/modules/ui/components/page-header";
|
|
||||||
|
|
||||||
const Page = async (props: { params: Promise<{ environmentId: string }> }) => {
|
|
||||||
const params = await props.params;
|
|
||||||
const t = await getTranslate();
|
|
||||||
const isEnabled = !!(GOOGLE_SHEETS_CLIENT_ID && GOOGLE_SHEETS_CLIENT_SECRET && GOOGLE_SHEETS_REDIRECT_URL);
|
|
||||||
|
|
||||||
const { isReadOnly, environment, session } = await getEnvironmentAuth(params.environmentId);
|
|
||||||
|
|
||||||
const [surveys, integrations, locale] = await Promise.all([
|
|
||||||
getSurveys(params.environmentId),
|
|
||||||
getIntegrations(params.environmentId),
|
|
||||||
getUserLocale(session.user.id),
|
|
||||||
]);
|
|
||||||
|
|
||||||
const googleSheetIntegration: TIntegrationGoogleSheets | undefined = integrations?.find(
|
|
||||||
(integration): integration is TIntegrationGoogleSheets => integration.type === "googleSheets"
|
|
||||||
);
|
|
||||||
if (isReadOnly) {
|
|
||||||
return redirect("./");
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<PageContentWrapper>
|
|
||||||
<GoBackButton
|
|
||||||
url={`${WEBAPP_URL}/environments/${params.environmentId}/settings/workspace/integrations`}
|
|
||||||
/>
|
|
||||||
<PageHeader pageTitle={t("environments.integrations.google_sheets.google_sheets_integration")} />
|
|
||||||
<div className="h-[75vh] w-full">
|
|
||||||
<GoogleSheetWrapper
|
|
||||||
isEnabled={isEnabled}
|
|
||||||
environment={environment}
|
|
||||||
surveys={surveys}
|
|
||||||
googleSheetIntegration={googleSheetIntegration}
|
|
||||||
webAppUrl={WEBAPP_URL}
|
|
||||||
locale={locale ?? DEFAULT_LOCALE}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</PageContentWrapper>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default Page;
|
|
||||||
@@ -1,68 +0,0 @@
|
|||||||
import { redirect } from "next/navigation";
|
|
||||||
import { TIntegrationNotion, TIntegrationNotionDatabase } from "@formbricks/types/integration/notion";
|
|
||||||
import { getSurveys } from "@/app/(app)/environments/[environmentId]/workspace/integrations/lib/surveys";
|
|
||||||
import { NotionWrapper } from "@/app/(app)/environments/[environmentId]/workspace/integrations/notion/components/NotionWrapper";
|
|
||||||
import {
|
|
||||||
DEFAULT_LOCALE,
|
|
||||||
NOTION_AUTH_URL,
|
|
||||||
NOTION_OAUTH_CLIENT_ID,
|
|
||||||
NOTION_OAUTH_CLIENT_SECRET,
|
|
||||||
NOTION_REDIRECT_URI,
|
|
||||||
WEBAPP_URL,
|
|
||||||
} from "@/lib/constants";
|
|
||||||
import { getIntegrationByType } from "@/lib/integration/service";
|
|
||||||
import { getNotionDatabases } from "@/lib/notion/service";
|
|
||||||
import { getUserLocale } from "@/lib/user/service";
|
|
||||||
import { getTranslate } from "@/lingodotdev/server";
|
|
||||||
import { getEnvironmentAuth } from "@/modules/environments/lib/utils";
|
|
||||||
import { GoBackButton } from "@/modules/ui/components/go-back-button";
|
|
||||||
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
|
||||||
import { PageHeader } from "@/modules/ui/components/page-header";
|
|
||||||
|
|
||||||
const Page = async (props: { params: Promise<{ environmentId: string }> }) => {
|
|
||||||
const params = await props.params;
|
|
||||||
const t = await getTranslate();
|
|
||||||
const enabled = !!(
|
|
||||||
NOTION_OAUTH_CLIENT_ID &&
|
|
||||||
NOTION_OAUTH_CLIENT_SECRET &&
|
|
||||||
NOTION_AUTH_URL &&
|
|
||||||
NOTION_REDIRECT_URI
|
|
||||||
);
|
|
||||||
|
|
||||||
const { isReadOnly, environment, session } = await getEnvironmentAuth(params.environmentId);
|
|
||||||
|
|
||||||
const [surveys, notionIntegration, locale] = await Promise.all([
|
|
||||||
getSurveys(params.environmentId),
|
|
||||||
getIntegrationByType(params.environmentId, "notion"),
|
|
||||||
getUserLocale(session.user.id),
|
|
||||||
]);
|
|
||||||
|
|
||||||
let databasesArray: TIntegrationNotionDatabase[] = [];
|
|
||||||
if (notionIntegration && (notionIntegration as TIntegrationNotion).config.key?.bot_id) {
|
|
||||||
databasesArray = (await getNotionDatabases(environment.id)) ?? [];
|
|
||||||
}
|
|
||||||
|
|
||||||
if (isReadOnly) {
|
|
||||||
return redirect("./");
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<PageContentWrapper>
|
|
||||||
<GoBackButton
|
|
||||||
url={`${WEBAPP_URL}/environments/${params.environmentId}/settings/workspace/integrations`}
|
|
||||||
/>
|
|
||||||
<PageHeader pageTitle={t("environments.integrations.notion.notion_integration")} />
|
|
||||||
<NotionWrapper
|
|
||||||
enabled={enabled}
|
|
||||||
surveys={surveys}
|
|
||||||
environment={environment}
|
|
||||||
notionIntegration={notionIntegration as TIntegrationNotion}
|
|
||||||
webAppUrl={WEBAPP_URL}
|
|
||||||
databasesArray={databasesArray}
|
|
||||||
locale={locale ?? DEFAULT_LOCALE}
|
|
||||||
/>
|
|
||||||
</PageContentWrapper>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default Page;
|
|
||||||
@@ -1,237 +0,0 @@
|
|||||||
import { TFunction } from "i18next";
|
|
||||||
import Image from "next/image";
|
|
||||||
import { redirect } from "next/navigation";
|
|
||||||
import { TIntegrationType } from "@formbricks/types/integration";
|
|
||||||
import { getWebhookCountBySource } from "@/app/(app)/environments/[environmentId]/workspace/integrations/lib/webhook";
|
|
||||||
import ActivePiecesLogo from "@/images/activepieces.webp";
|
|
||||||
import AirtableLogo from "@/images/airtableLogo.svg";
|
|
||||||
import GoogleSheetsLogo from "@/images/googleSheetsLogo.png";
|
|
||||||
import JsLogo from "@/images/jslogo.png";
|
|
||||||
import MakeLogo from "@/images/make-small.png";
|
|
||||||
import n8nLogo from "@/images/n8n.png";
|
|
||||||
import notionLogo from "@/images/notion.png";
|
|
||||||
import SlackLogo from "@/images/slacklogo.png";
|
|
||||||
import WebhookLogo from "@/images/webhook.png";
|
|
||||||
import ZapierLogo from "@/images/zapier-small.png";
|
|
||||||
import { IS_FORMBRICKS_CLOUD } from "@/lib/constants";
|
|
||||||
import { getIntegrations } from "@/lib/integration/service";
|
|
||||||
import { getBillingFallbackPath } from "@/lib/membership/navigation";
|
|
||||||
import { getTranslate } from "@/lingodotdev/server";
|
|
||||||
import { getEnvironmentAuth } from "@/modules/environments/lib/utils";
|
|
||||||
import { Card } from "@/modules/ui/components/integration-card";
|
|
||||||
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
|
||||||
import { PageHeader } from "@/modules/ui/components/page-header";
|
|
||||||
|
|
||||||
const getStatusText = (count: number, t: TFunction, type: string) => {
|
|
||||||
if (count === 1) return `1 ${type}`;
|
|
||||||
if (count === 0) return t("common.not_connected");
|
|
||||||
return `${count} ${type}s`;
|
|
||||||
};
|
|
||||||
|
|
||||||
const Page = async (props: { params: Promise<{ environmentId: string }> }) => {
|
|
||||||
const params = await props.params;
|
|
||||||
const t = await getTranslate();
|
|
||||||
|
|
||||||
const { isReadOnly, environment, isBilling } = await getEnvironmentAuth(params.environmentId);
|
|
||||||
|
|
||||||
const [
|
|
||||||
integrations,
|
|
||||||
userWebhookCount,
|
|
||||||
zapierWebhookCount,
|
|
||||||
makeWebhookCount,
|
|
||||||
n8nwebhookCount,
|
|
||||||
activePiecesWebhookCount,
|
|
||||||
] = await Promise.all([
|
|
||||||
getIntegrations(params.environmentId),
|
|
||||||
getWebhookCountBySource(params.environmentId, "user"),
|
|
||||||
getWebhookCountBySource(params.environmentId, "zapier"),
|
|
||||||
getWebhookCountBySource(params.environmentId, "make"),
|
|
||||||
getWebhookCountBySource(params.environmentId, "n8n"),
|
|
||||||
getWebhookCountBySource(params.environmentId, "activepieces"),
|
|
||||||
]);
|
|
||||||
|
|
||||||
const isIntegrationConnected = (type: TIntegrationType) =>
|
|
||||||
integrations.some((integration) => integration.type === type);
|
|
||||||
|
|
||||||
if (isBilling) {
|
|
||||||
return redirect(getBillingFallbackPath(params.environmentId, IS_FORMBRICKS_CLOUD));
|
|
||||||
}
|
|
||||||
|
|
||||||
const isGoogleSheetsIntegrationConnected = isIntegrationConnected("googleSheets");
|
|
||||||
const isNotionIntegrationConnected = isIntegrationConnected("notion");
|
|
||||||
const isAirtableIntegrationConnected = isIntegrationConnected("airtable");
|
|
||||||
const isN8nIntegrationConnected = isIntegrationConnected("n8n");
|
|
||||||
const isSlackIntegrationConnected = isIntegrationConnected("slack");
|
|
||||||
|
|
||||||
const appSetupCompleted = !!environment?.appSetupCompleted;
|
|
||||||
const integrationCards = [
|
|
||||||
{
|
|
||||||
docsHref: "https://formbricks.com/docs/xm-and-surveys/core-features/integrations/zapier",
|
|
||||||
docsText: t("common.docs"),
|
|
||||||
docsNewTab: true,
|
|
||||||
connectHref: "https://zapier.com/apps/formbricks/integrations",
|
|
||||||
connectText: t("common.connect"),
|
|
||||||
connectNewTab: true,
|
|
||||||
label: "Zapier",
|
|
||||||
description: t("environments.integrations.zapier_integration_description"),
|
|
||||||
icon: <Image src={ZapierLogo} alt="Zapier Logo" />,
|
|
||||||
connected: zapierWebhookCount > 0,
|
|
||||||
statusText: getStatusText(zapierWebhookCount, t, "zap"),
|
|
||||||
disabled: isReadOnly,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
connectHref: `/environments/${params.environmentId}/settings/workspace/integrations/webhooks`,
|
|
||||||
connectText: t("environments.integrations.manage_webhooks"),
|
|
||||||
connectNewTab: false,
|
|
||||||
docsHref: "https://formbricks.com/docs/xm-and-surveys/core-features/integrations/webhooks",
|
|
||||||
docsText: t("common.docs"),
|
|
||||||
docsNewTab: true,
|
|
||||||
label: "Webhooks",
|
|
||||||
description: t("environments.integrations.webhook_integration_description"),
|
|
||||||
icon: <Image src={WebhookLogo} alt="Webhook Logo" />,
|
|
||||||
connected: userWebhookCount > 0,
|
|
||||||
statusText: getStatusText(userWebhookCount, t, "webhook"),
|
|
||||||
disabled: false,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
connectHref: `/environments/${params.environmentId}/settings/workspace/integrations/google-sheets`,
|
|
||||||
connectText: `${isGoogleSheetsIntegrationConnected ? t("common.manage") : t("common.connect")}`,
|
|
||||||
connectNewTab: false,
|
|
||||||
docsHref: "https://formbricks.com/docs/xm-and-surveys/core-features/integrations/google-sheets",
|
|
||||||
docsText: t("common.docs"),
|
|
||||||
docsNewTab: true,
|
|
||||||
label: "Google Sheets",
|
|
||||||
description: t("environments.integrations.google_sheet_integration_description"),
|
|
||||||
icon: <Image src={GoogleSheetsLogo} alt="Google sheets Logo" />,
|
|
||||||
connected: isGoogleSheetsIntegrationConnected,
|
|
||||||
statusText: isGoogleSheetsIntegrationConnected ? t("common.connected") : t("common.not_connected"),
|
|
||||||
disabled: isReadOnly,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
connectHref: `/environments/${params.environmentId}/settings/workspace/integrations/airtable`,
|
|
||||||
connectText: `${isAirtableIntegrationConnected ? t("common.manage") : t("common.connect")}`,
|
|
||||||
connectNewTab: false,
|
|
||||||
docsHref: "https://formbricks.com/docs/xm-and-surveys/core-features/integrations/airtable",
|
|
||||||
docsText: t("common.docs"),
|
|
||||||
docsNewTab: true,
|
|
||||||
label: "Airtable",
|
|
||||||
description: t("environments.integrations.airtable_integration_description"),
|
|
||||||
icon: <Image src={AirtableLogo} alt="Airtable Logo" />,
|
|
||||||
connected: isAirtableIntegrationConnected,
|
|
||||||
statusText: isAirtableIntegrationConnected ? t("common.connected") : t("common.not_connected"),
|
|
||||||
disabled: isReadOnly,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
connectHref: `/environments/${params.environmentId}/settings/workspace/integrations/slack`,
|
|
||||||
connectText: `${isSlackIntegrationConnected ? t("common.manage") : t("common.connect")}`,
|
|
||||||
connectNewTab: false,
|
|
||||||
docsHref: "https://formbricks.com/docs/xm-and-surveys/core-features/integrations/slack",
|
|
||||||
docsText: t("common.docs"),
|
|
||||||
docsNewTab: true,
|
|
||||||
label: "Slack",
|
|
||||||
description: t("environments.integrations.slack_integration_description"),
|
|
||||||
icon: <Image src={SlackLogo} alt="Slack Logo" />,
|
|
||||||
connected: isSlackIntegrationConnected,
|
|
||||||
statusText: isSlackIntegrationConnected ? t("common.connected") : t("common.not_connected"),
|
|
||||||
disabled: isReadOnly,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
docsHref: "https://formbricks.com/docs/xm-and-surveys/core-features/integrations/n8n",
|
|
||||||
connectText: `${isN8nIntegrationConnected ? t("common.manage") : t("common.connect")}`,
|
|
||||||
docsText: t("common.docs"),
|
|
||||||
docsNewTab: true,
|
|
||||||
connectHref: "https://n8n.io",
|
|
||||||
connectNewTab: true,
|
|
||||||
label: "n8n",
|
|
||||||
description: t("environments.integrations.n8n_integration_description"),
|
|
||||||
icon: <Image src={n8nLogo} alt="n8n Logo" />,
|
|
||||||
connected: n8nwebhookCount > 0,
|
|
||||||
statusText: getStatusText(n8nwebhookCount, t, t("common.integration")),
|
|
||||||
disabled: isReadOnly,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
docsHref: "https://formbricks.com/docs/xm-and-surveys/core-features/integrations/make",
|
|
||||||
docsText: t("common.docs"),
|
|
||||||
docsNewTab: true,
|
|
||||||
connectHref: "https://www.make.com/en/integrations/formbricks",
|
|
||||||
connectText: t("common.connect"),
|
|
||||||
connectNewTab: true,
|
|
||||||
label: "Make.com",
|
|
||||||
description: t("environments.integrations.make_integration_description"),
|
|
||||||
icon: <Image src={MakeLogo} alt="Make Logo" />,
|
|
||||||
connected: makeWebhookCount > 0,
|
|
||||||
statusText: getStatusText(makeWebhookCount, t, t("common.integration")),
|
|
||||||
disabled: isReadOnly,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
connectHref: `/environments/${params.environmentId}/settings/workspace/integrations/notion`,
|
|
||||||
connectText: `${isNotionIntegrationConnected ? t("common.manage") : t("common.connect")}`,
|
|
||||||
connectNewTab: false,
|
|
||||||
docsHref: "https://formbricks.com/docs/xm-and-surveys/core-features/integrations/notion",
|
|
||||||
docsText: t("common.docs"),
|
|
||||||
docsNewTab: true,
|
|
||||||
label: "Notion",
|
|
||||||
description: t("environments.integrations.notion_integration_description"),
|
|
||||||
icon: <Image src={notionLogo} alt="Notion Logo" />,
|
|
||||||
connected: isNotionIntegrationConnected,
|
|
||||||
statusText: isNotionIntegrationConnected ? t("common.connected") : t("common.not_connected"),
|
|
||||||
disabled: isReadOnly,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
docsHref: "https://formbricks.com/docs/xm-and-surveys/core-features/integrations/activepieces",
|
|
||||||
docsText: t("common.docs"),
|
|
||||||
docsNewTab: true,
|
|
||||||
connectHref: "https://www.activepieces.com/pieces/formbricks",
|
|
||||||
connectText: t("common.connect"),
|
|
||||||
connectNewTab: true,
|
|
||||||
label: "Activepieces",
|
|
||||||
description: t("environments.integrations.activepieces_integration_description"),
|
|
||||||
icon: <Image src={ActivePiecesLogo} alt="ActivePieces Logo" />,
|
|
||||||
connected: activePiecesWebhookCount > 0,
|
|
||||||
statusText: getStatusText(activePiecesWebhookCount, t, t("common.integration")),
|
|
||||||
disabled: isReadOnly,
|
|
||||||
},
|
|
||||||
];
|
|
||||||
|
|
||||||
integrationCards.unshift({
|
|
||||||
docsHref: "https://formbricks.com/docs/app-surveys/quickstart",
|
|
||||||
docsText: t("common.docs"),
|
|
||||||
docsNewTab: true,
|
|
||||||
connectHref: `/environments/${params.environmentId}/settings/workspace/connect`,
|
|
||||||
connectText: t("common.connect"),
|
|
||||||
connectNewTab: false,
|
|
||||||
label: "Javascript SDK",
|
|
||||||
description: t("environments.integrations.website_or_app_integration_description"),
|
|
||||||
icon: <Image src={JsLogo} alt="Javascript Logo" />,
|
|
||||||
connected: appSetupCompleted,
|
|
||||||
statusText: appSetupCompleted ? t("common.connected") : t("common.not_connected"),
|
|
||||||
disabled: false,
|
|
||||||
});
|
|
||||||
|
|
||||||
return (
|
|
||||||
<PageContentWrapper>
|
|
||||||
<PageHeader pageTitle={t("common.integrations")} />
|
|
||||||
<div className="grid grid-cols-3 place-content-stretch gap-4 lg:grid-cols-3">
|
|
||||||
{integrationCards.map((card) => (
|
|
||||||
<Card
|
|
||||||
key={card.label}
|
|
||||||
docsHref={card.docsHref}
|
|
||||||
docsText={card.docsText}
|
|
||||||
docsNewTab={card.docsNewTab}
|
|
||||||
connectHref={card.connectHref}
|
|
||||||
connectText={card.connectText}
|
|
||||||
connectNewTab={card.connectNewTab}
|
|
||||||
label={card.label}
|
|
||||||
description={card.description}
|
|
||||||
icon={card.icon}
|
|
||||||
connected={card.connected}
|
|
||||||
statusText={card.statusText}
|
|
||||||
disabled={card.disabled}
|
|
||||||
/>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</PageContentWrapper>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default Page;
|
|
||||||
@@ -1,52 +0,0 @@
|
|||||||
import { redirect } from "next/navigation";
|
|
||||||
import { TIntegrationSlack } from "@formbricks/types/integration/slack";
|
|
||||||
import { getSurveys } from "@/app/(app)/environments/[environmentId]/workspace/integrations/lib/surveys";
|
|
||||||
import { SlackWrapper } from "@/app/(app)/environments/[environmentId]/workspace/integrations/slack/components/SlackWrapper";
|
|
||||||
import { DEFAULT_LOCALE, SLACK_CLIENT_ID, SLACK_CLIENT_SECRET, WEBAPP_URL } from "@/lib/constants";
|
|
||||||
import { getIntegrationByType } from "@/lib/integration/service";
|
|
||||||
import { getUserLocale } from "@/lib/user/service";
|
|
||||||
import { getTranslate } from "@/lingodotdev/server";
|
|
||||||
import { getEnvironmentAuth } from "@/modules/environments/lib/utils";
|
|
||||||
import { GoBackButton } from "@/modules/ui/components/go-back-button";
|
|
||||||
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
|
||||||
import { PageHeader } from "@/modules/ui/components/page-header";
|
|
||||||
|
|
||||||
const Page = async (props: { params: Promise<{ environmentId: string }> }) => {
|
|
||||||
const params = await props.params;
|
|
||||||
const isEnabled = !!(SLACK_CLIENT_ID && SLACK_CLIENT_SECRET);
|
|
||||||
|
|
||||||
const t = await getTranslate();
|
|
||||||
|
|
||||||
const { isReadOnly, environment, session } = await getEnvironmentAuth(params.environmentId);
|
|
||||||
|
|
||||||
const [surveys, slackIntegration, locale] = await Promise.all([
|
|
||||||
getSurveys(params.environmentId),
|
|
||||||
getIntegrationByType(params.environmentId, "slack"),
|
|
||||||
getUserLocale(session.user.id),
|
|
||||||
]);
|
|
||||||
|
|
||||||
if (isReadOnly) {
|
|
||||||
return redirect("./");
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<PageContentWrapper>
|
|
||||||
<GoBackButton
|
|
||||||
url={`${WEBAPP_URL}/environments/${params.environmentId}/settings/workspace/integrations`}
|
|
||||||
/>
|
|
||||||
<PageHeader pageTitle={t("environments.integrations.slack.slack_integration")} />
|
|
||||||
<div className="h-[75vh] w-full">
|
|
||||||
<SlackWrapper
|
|
||||||
isEnabled={isEnabled}
|
|
||||||
environment={environment}
|
|
||||||
surveys={surveys}
|
|
||||||
slackIntegration={slackIntegration as TIntegrationSlack}
|
|
||||||
webAppUrl={WEBAPP_URL}
|
|
||||||
locale={locale ?? DEFAULT_LOCALE}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</PageContentWrapper>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default Page;
|
|
||||||
@@ -1,3 +0,0 @@
|
|||||||
import { WebhooksPage } from "@/modules/integrations/webhooks/page";
|
|
||||||
|
|
||||||
export default WebhooksPage;
|
|
||||||
@@ -1,3 +0,0 @@
|
|||||||
import { LanguagesPage } from "@/modules/projects/settings/languages/page";
|
|
||||||
|
|
||||||
export default LanguagesPage;
|
|
||||||
@@ -1,3 +0,0 @@
|
|||||||
import { TagsPage } from "@/modules/projects/settings/tags/page";
|
|
||||||
|
|
||||||
export default TagsPage;
|
|
||||||
@@ -1,3 +0,0 @@
|
|||||||
import { ProjectTeams } from "@/modules/ee/teams/project-teams/page";
|
|
||||||
|
|
||||||
export default ProjectTeams;
|
|
||||||
@@ -1,44 +0,0 @@
|
|||||||
"use server";
|
|
||||||
|
|
||||||
import { getActionClasses } from "@/lib/actionClass/service";
|
|
||||||
import { DEFAULT_LOCALE } from "@/lib/constants";
|
|
||||||
import { getEnvironments } from "@/lib/environment/service";
|
|
||||||
import { getUserLocale } from "@/lib/user/service";
|
|
||||||
import { getTranslate } from "@/lingodotdev/server";
|
|
||||||
import { getEnvironmentAuth } from "@/modules/environments/lib/utils";
|
|
||||||
import { ActionSettingsCard } from "@/modules/projects/settings/(setup)/components/action-settings-card";
|
|
||||||
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
|
||||||
import { PageHeader } from "@/modules/ui/components/page-header";
|
|
||||||
|
|
||||||
const Page = async (props: { params: Promise<{ environmentId: string }> }) => {
|
|
||||||
const params = await props.params;
|
|
||||||
const t = await getTranslate();
|
|
||||||
const { environmentId } = params;
|
|
||||||
|
|
||||||
const { environment, isReadOnly, session } = await getEnvironmentAuth(environmentId);
|
|
||||||
|
|
||||||
const [environments, actionClasses, locale] = await Promise.all([
|
|
||||||
getEnvironments(environment.projectId),
|
|
||||||
getActionClasses(environmentId),
|
|
||||||
getUserLocale(session.user.id),
|
|
||||||
]);
|
|
||||||
const otherEnvironment = environments.filter((env) => env.id !== environmentId)[0];
|
|
||||||
const otherEnvActionClasses = otherEnvironment ? await getActionClasses(otherEnvironment.id) : [];
|
|
||||||
|
|
||||||
return (
|
|
||||||
<PageContentWrapper>
|
|
||||||
<PageHeader pageTitle={t("common.actions")} />
|
|
||||||
<ActionSettingsCard
|
|
||||||
environment={environment}
|
|
||||||
otherEnvironment={otherEnvironment}
|
|
||||||
otherEnvActionClasses={otherEnvActionClasses}
|
|
||||||
environmentId={environmentId}
|
|
||||||
actionClasses={actionClasses}
|
|
||||||
isReadOnly={isReadOnly}
|
|
||||||
locale={locale ?? DEFAULT_LOCALE}
|
|
||||||
/>
|
|
||||||
</PageContentWrapper>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default Page;
|
|
||||||
@@ -2,11 +2,7 @@
|
|||||||
|
|
||||||
import { z } from "zod";
|
import { z } from "zod";
|
||||||
import { ZId } from "@formbricks/types/common";
|
import { ZId } from "@formbricks/types/common";
|
||||||
import {
|
import { AuthorizationError, OperationNotAllowedError } from "@formbricks/types/errors";
|
||||||
AuthorizationError,
|
|
||||||
OperationNotAllowedError,
|
|
||||||
ResourceNotFoundError,
|
|
||||||
} from "@formbricks/types/errors";
|
|
||||||
import { ZProjectUpdateInput } from "@formbricks/types/project";
|
import { ZProjectUpdateInput } from "@formbricks/types/project";
|
||||||
import { getMembershipByUserIdOrganizationId } from "@/lib/membership/service";
|
import { getMembershipByUserIdOrganizationId } from "@/lib/membership/service";
|
||||||
import { getOrganization } from "@/lib/organization/service";
|
import { getOrganization } from "@/lib/organization/service";
|
||||||
@@ -14,6 +10,7 @@ import { getOrganizationProjectsCount } from "@/lib/project/service";
|
|||||||
import { updateUser } from "@/lib/user/service";
|
import { updateUser } from "@/lib/user/service";
|
||||||
import { authenticatedActionClient } from "@/lib/utils/action-client";
|
import { authenticatedActionClient } from "@/lib/utils/action-client";
|
||||||
import { checkAuthorizationUpdated } from "@/lib/utils/action-client/action-client-middleware";
|
import { checkAuthorizationUpdated } from "@/lib/utils/action-client/action-client-middleware";
|
||||||
|
import { AuthenticatedActionClientCtx } from "@/lib/utils/action-client/types/context";
|
||||||
import { withAuditLogging } from "@/modules/ee/audit-logs/lib/handler";
|
import { withAuditLogging } from "@/modules/ee/audit-logs/lib/handler";
|
||||||
import {
|
import {
|
||||||
getAccessControlPermission,
|
getAccessControlPermission,
|
||||||
@@ -28,63 +25,67 @@ const ZCreateProjectAction = z.object({
|
|||||||
data: ZProjectUpdateInput,
|
data: ZProjectUpdateInput,
|
||||||
});
|
});
|
||||||
|
|
||||||
export const createProjectAction = authenticatedActionClient.inputSchema(ZCreateProjectAction).action(
|
export const createProjectAction = authenticatedActionClient.schema(ZCreateProjectAction).action(
|
||||||
withAuditLogging("created", "project", async ({ ctx, parsedInput }) => {
|
withAuditLogging(
|
||||||
const { user } = ctx;
|
"created",
|
||||||
|
"project",
|
||||||
|
async ({ ctx, parsedInput }: { ctx: AuthenticatedActionClientCtx; parsedInput: Record<string, any> }) => {
|
||||||
|
const { user } = ctx;
|
||||||
|
|
||||||
const organizationId = parsedInput.organizationId;
|
const organizationId = parsedInput.organizationId;
|
||||||
|
|
||||||
await checkAuthorizationUpdated({
|
await checkAuthorizationUpdated({
|
||||||
userId: user.id,
|
userId: user.id,
|
||||||
organizationId: parsedInput.organizationId,
|
organizationId: parsedInput.organizationId,
|
||||||
access: [
|
access: [
|
||||||
{
|
{
|
||||||
data: parsedInput.data,
|
data: parsedInput.data,
|
||||||
schema: ZProjectUpdateInput,
|
schema: ZProjectUpdateInput,
|
||||||
type: "organization",
|
type: "organization",
|
||||||
roles: ["owner", "manager"],
|
roles: ["owner", "manager"],
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
});
|
});
|
||||||
|
|
||||||
const organization = await getOrganization(organizationId);
|
const organization = await getOrganization(organizationId);
|
||||||
|
|
||||||
if (!organization) {
|
if (!organization) {
|
||||||
throw new ResourceNotFoundError("Organization", organizationId);
|
throw new Error("Organization not found");
|
||||||
}
|
|
||||||
|
|
||||||
const organizationProjectsLimit = await getOrganizationProjectsLimit(organization.id);
|
|
||||||
const organizationProjectsCount = await getOrganizationProjectsCount(organization.id);
|
|
||||||
|
|
||||||
if (organizationProjectsCount >= organizationProjectsLimit) {
|
|
||||||
throw new OperationNotAllowedError("Organization workspace limit reached");
|
|
||||||
}
|
|
||||||
|
|
||||||
if (parsedInput.data.teamIds && parsedInput.data.teamIds.length > 0) {
|
|
||||||
const isAccessControlAllowed = await getAccessControlPermission(organization.id);
|
|
||||||
|
|
||||||
if (!isAccessControlAllowed) {
|
|
||||||
throw new OperationNotAllowedError("You do not have permission to manage roles");
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const organizationProjectsLimit = await getOrganizationProjectsLimit(organization.billing.limits);
|
||||||
|
const organizationProjectsCount = await getOrganizationProjectsCount(organization.id);
|
||||||
|
|
||||||
|
if (organizationProjectsCount >= organizationProjectsLimit) {
|
||||||
|
throw new OperationNotAllowedError("Organization workspace limit reached");
|
||||||
|
}
|
||||||
|
|
||||||
|
if (parsedInput.data.teamIds && parsedInput.data.teamIds.length > 0) {
|
||||||
|
const isAccessControlAllowed = await getAccessControlPermission(organization.billing.plan);
|
||||||
|
|
||||||
|
if (!isAccessControlAllowed) {
|
||||||
|
throw new OperationNotAllowedError("You do not have permission to manage roles");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
const project = await createProject(parsedInput.organizationId, parsedInput.data);
|
||||||
|
const updatedNotificationSettings = {
|
||||||
|
...user.notificationSettings,
|
||||||
|
alert: {
|
||||||
|
...user.notificationSettings?.alert,
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
await updateUser(user.id, {
|
||||||
|
notificationSettings: updatedNotificationSettings,
|
||||||
|
});
|
||||||
|
|
||||||
|
ctx.auditLoggingCtx.organizationId = organizationId;
|
||||||
|
ctx.auditLoggingCtx.projectId = project.id;
|
||||||
|
ctx.auditLoggingCtx.newObject = project;
|
||||||
|
return project;
|
||||||
}
|
}
|
||||||
|
)
|
||||||
const project = await createProject(parsedInput.organizationId, parsedInput.data);
|
|
||||||
const updatedNotificationSettings = {
|
|
||||||
...user.notificationSettings,
|
|
||||||
alert: {
|
|
||||||
...user.notificationSettings?.alert,
|
|
||||||
},
|
|
||||||
};
|
|
||||||
|
|
||||||
await updateUser(user.id, {
|
|
||||||
notificationSettings: updatedNotificationSettings,
|
|
||||||
});
|
|
||||||
|
|
||||||
ctx.auditLoggingCtx.organizationId = organizationId;
|
|
||||||
ctx.auditLoggingCtx.projectId = project.id;
|
|
||||||
ctx.auditLoggingCtx.newObject = project;
|
|
||||||
return project;
|
|
||||||
})
|
|
||||||
);
|
);
|
||||||
|
|
||||||
const ZGetOrganizationsForSwitcherAction = z.object({
|
const ZGetOrganizationsForSwitcherAction = z.object({
|
||||||
@@ -96,7 +97,7 @@ const ZGetOrganizationsForSwitcherAction = z.object({
|
|||||||
* Called on-demand when user opens the organization switcher.
|
* Called on-demand when user opens the organization switcher.
|
||||||
*/
|
*/
|
||||||
export const getOrganizationsForSwitcherAction = authenticatedActionClient
|
export const getOrganizationsForSwitcherAction = authenticatedActionClient
|
||||||
.inputSchema(ZGetOrganizationsForSwitcherAction)
|
.schema(ZGetOrganizationsForSwitcherAction)
|
||||||
.action(async ({ ctx, parsedInput }) => {
|
.action(async ({ ctx, parsedInput }) => {
|
||||||
await checkAuthorizationUpdated({
|
await checkAuthorizationUpdated({
|
||||||
userId: ctx.user.id,
|
userId: ctx.user.id,
|
||||||
@@ -121,7 +122,7 @@ const ZGetProjectsForSwitcherAction = z.object({
|
|||||||
* Called on-demand when user opens the project switcher.
|
* Called on-demand when user opens the project switcher.
|
||||||
*/
|
*/
|
||||||
export const getProjectsForSwitcherAction = authenticatedActionClient
|
export const getProjectsForSwitcherAction = authenticatedActionClient
|
||||||
.inputSchema(ZGetProjectsForSwitcherAction)
|
.schema(ZGetProjectsForSwitcherAction)
|
||||||
.action(async ({ ctx, parsedInput }) => {
|
.action(async ({ ctx, parsedInput }) => {
|
||||||
await checkAuthorizationUpdated({
|
await checkAuthorizationUpdated({
|
||||||
userId: ctx.user.id,
|
userId: ctx.user.id,
|
||||||
|
|||||||
@@ -1,4 +1,3 @@
|
|||||||
import { ResourceNotFoundError } from "@formbricks/types/errors";
|
|
||||||
import { MainNavigation } from "@/app/(app)/environments/[environmentId]/components/MainNavigation";
|
import { MainNavigation } from "@/app/(app)/environments/[environmentId]/components/MainNavigation";
|
||||||
import { TopControlBar } from "@/app/(app)/environments/[environmentId]/components/TopControlBar";
|
import { TopControlBar } from "@/app/(app)/environments/[environmentId]/components/TopControlBar";
|
||||||
import { IS_DEVELOPMENT, IS_FORMBRICKS_CLOUD } from "@/lib/constants";
|
import { IS_DEVELOPMENT, IS_FORMBRICKS_CLOUD } from "@/lib/constants";
|
||||||
@@ -30,6 +29,7 @@ export const EnvironmentLayout = async ({ layoutData, children }: EnvironmentLay
|
|||||||
isAccessControlAllowed,
|
isAccessControlAllowed,
|
||||||
projectPermission,
|
projectPermission,
|
||||||
license,
|
license,
|
||||||
|
peopleCount,
|
||||||
responseCount,
|
responseCount,
|
||||||
} = layoutData;
|
} = layoutData;
|
||||||
|
|
||||||
@@ -38,12 +38,12 @@ export const EnvironmentLayout = async ({ layoutData, children }: EnvironmentLay
|
|||||||
|
|
||||||
const { features, lastChecked, isPendingDowngrade, active, status } = license;
|
const { features, lastChecked, isPendingDowngrade, active, status } = license;
|
||||||
const isMultiOrgEnabled = features?.isMultiOrgEnabled ?? false;
|
const isMultiOrgEnabled = features?.isMultiOrgEnabled ?? false;
|
||||||
const organizationProjectsLimit = await getOrganizationProjectsLimit(organization.id);
|
const organizationProjectsLimit = await getOrganizationProjectsLimit(organization.billing.limits);
|
||||||
const isOwnerOrManager = isOwner || isManager;
|
const isOwnerOrManager = isOwner || isManager;
|
||||||
|
|
||||||
// Validate that project permission exists for members
|
// Validate that project permission exists for members
|
||||||
if (isMember && !projectPermission) {
|
if (isMember && !projectPermission) {
|
||||||
throw new ResourceNotFoundError(t("common.workspace"), null);
|
throw new Error(t("common.workspace_permission_not_found"));
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@@ -52,6 +52,7 @@ export const EnvironmentLayout = async ({ layoutData, children }: EnvironmentLay
|
|||||||
<LimitsReachedBanner
|
<LimitsReachedBanner
|
||||||
organization={organization}
|
organization={organization}
|
||||||
environmentId={environment.id}
|
environmentId={environment.id}
|
||||||
|
peopleCount={peopleCount}
|
||||||
responseCount={responseCount}
|
responseCount={responseCount}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
@@ -75,10 +76,6 @@ export const EnvironmentLayout = async ({ layoutData, children }: EnvironmentLay
|
|||||||
isDevelopment={IS_DEVELOPMENT}
|
isDevelopment={IS_DEVELOPMENT}
|
||||||
membershipRole={membership.role}
|
membershipRole={membership.role}
|
||||||
publicDomain={publicDomain}
|
publicDomain={publicDomain}
|
||||||
isMultiOrgEnabled={isMultiOrgEnabled}
|
|
||||||
organizationProjectsLimit={organizationProjectsLimit}
|
|
||||||
isLicenseActive={active}
|
|
||||||
isAccessControlAllowed={isAccessControlAllowed}
|
|
||||||
/>
|
/>
|
||||||
<div id="mainContent" className="flex flex-1 flex-col overflow-hidden bg-slate-50">
|
<div id="mainContent" className="flex flex-1 flex-col overflow-hidden bg-slate-50">
|
||||||
<TopControlBar
|
<TopControlBar
|
||||||
|
|||||||
@@ -2,59 +2,40 @@
|
|||||||
|
|
||||||
import {
|
import {
|
||||||
ArrowUpRightIcon,
|
ArrowUpRightIcon,
|
||||||
Building2Icon,
|
|
||||||
ChevronRightIcon,
|
ChevronRightIcon,
|
||||||
Cog,
|
Cog,
|
||||||
FoldersIcon,
|
|
||||||
Loader2,
|
|
||||||
LogOutIcon,
|
LogOutIcon,
|
||||||
MessageCircle,
|
MessageCircle,
|
||||||
PanelLeftCloseIcon,
|
PanelLeftCloseIcon,
|
||||||
PanelLeftOpenIcon,
|
PanelLeftOpenIcon,
|
||||||
PlusIcon,
|
|
||||||
RocketIcon,
|
RocketIcon,
|
||||||
SettingsIcon,
|
|
||||||
UserCircleIcon,
|
UserCircleIcon,
|
||||||
UserIcon,
|
UserIcon,
|
||||||
} from "lucide-react";
|
} from "lucide-react";
|
||||||
import Image from "next/image";
|
import Image from "next/image";
|
||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
import { usePathname, useRouter } from "next/navigation";
|
import { usePathname, useRouter } from "next/navigation";
|
||||||
import { useCallback, useEffect, useMemo, useState, useTransition } from "react";
|
import { useEffect, useMemo, useState } from "react";
|
||||||
import { useTranslation } from "react-i18next";
|
import { useTranslation } from "react-i18next";
|
||||||
import { TEnvironment } from "@formbricks/types/environment";
|
import { TEnvironment } from "@formbricks/types/environment";
|
||||||
import { TOrganizationRole } from "@formbricks/types/memberships";
|
import { TOrganizationRole } from "@formbricks/types/memberships";
|
||||||
import { TOrganization } from "@formbricks/types/organizations";
|
import { TOrganization } from "@formbricks/types/organizations";
|
||||||
import { TUser } from "@formbricks/types/user";
|
import { TUser } from "@formbricks/types/user";
|
||||||
import {
|
|
||||||
getOrganizationsForSwitcherAction,
|
|
||||||
getProjectsForSwitcherAction,
|
|
||||||
} from "@/app/(app)/environments/[environmentId]/actions";
|
|
||||||
import { NavigationLink } from "@/app/(app)/environments/[environmentId]/components/NavigationLink";
|
import { NavigationLink } from "@/app/(app)/environments/[environmentId]/components/NavigationLink";
|
||||||
import { isNewerVersion } from "@/app/(app)/environments/[environmentId]/lib/utils";
|
import { isNewerVersion } from "@/app/(app)/environments/[environmentId]/lib/utils";
|
||||||
import FBLogo from "@/images/formbricks-wordmark.svg";
|
import FBLogo from "@/images/formbricks-wordmark.svg";
|
||||||
import { cn } from "@/lib/cn";
|
import { cn } from "@/lib/cn";
|
||||||
import { getBillingFallbackPath } from "@/lib/membership/navigation";
|
|
||||||
import { getAccessFlags } from "@/lib/membership/utils";
|
import { getAccessFlags } from "@/lib/membership/utils";
|
||||||
import { getFormattedErrorMessage } from "@/lib/utils/helper";
|
|
||||||
import { useSignOut } from "@/modules/auth/hooks/use-sign-out";
|
import { useSignOut } from "@/modules/auth/hooks/use-sign-out";
|
||||||
import { TrialAlert } from "@/modules/ee/billing/components/trial-alert";
|
|
||||||
import { CreateOrganizationModal } from "@/modules/organization/components/CreateOrganizationModal";
|
|
||||||
import { CreateProjectModal } from "@/modules/projects/components/create-project-modal";
|
|
||||||
import { ProjectLimitModal } from "@/modules/projects/components/project-limit-modal";
|
|
||||||
import { getLatestStableFbReleaseAction } from "@/modules/projects/settings/(setup)/app-connection/actions";
|
import { getLatestStableFbReleaseAction } from "@/modules/projects/settings/(setup)/app-connection/actions";
|
||||||
import { ProfileAvatar } from "@/modules/ui/components/avatars";
|
import { ProfileAvatar } from "@/modules/ui/components/avatars";
|
||||||
import { Button } from "@/modules/ui/components/button";
|
import { Button } from "@/modules/ui/components/button";
|
||||||
import {
|
import {
|
||||||
DropdownMenu,
|
DropdownMenu,
|
||||||
DropdownMenuCheckboxItem,
|
|
||||||
DropdownMenuContent,
|
DropdownMenuContent,
|
||||||
DropdownMenuGroup,
|
|
||||||
DropdownMenuItem,
|
DropdownMenuItem,
|
||||||
DropdownMenuSeparator,
|
|
||||||
DropdownMenuTrigger,
|
DropdownMenuTrigger,
|
||||||
} from "@/modules/ui/components/dropdown-menu";
|
} from "@/modules/ui/components/dropdown-menu";
|
||||||
import { ModalButton } from "@/modules/ui/components/upgrade-prompt";
|
|
||||||
import packageJson from "../../../../../package.json";
|
import packageJson from "../../../../../package.json";
|
||||||
|
|
||||||
interface NavigationProps {
|
interface NavigationProps {
|
||||||
@@ -66,10 +47,6 @@ interface NavigationProps {
|
|||||||
isDevelopment: boolean;
|
isDevelopment: boolean;
|
||||||
membershipRole?: TOrganizationRole;
|
membershipRole?: TOrganizationRole;
|
||||||
publicDomain: string;
|
publicDomain: string;
|
||||||
isMultiOrgEnabled: boolean;
|
|
||||||
organizationProjectsLimit: number;
|
|
||||||
isLicenseActive: boolean;
|
|
||||||
isAccessControlAllowed: boolean;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export const MainNavigation = ({
|
export const MainNavigation = ({
|
||||||
@@ -81,10 +58,6 @@ export const MainNavigation = ({
|
|||||||
isFormbricksCloud,
|
isFormbricksCloud,
|
||||||
isDevelopment,
|
isDevelopment,
|
||||||
publicDomain,
|
publicDomain,
|
||||||
isMultiOrgEnabled,
|
|
||||||
organizationProjectsLimit,
|
|
||||||
isLicenseActive,
|
|
||||||
isAccessControlAllowed,
|
|
||||||
}: NavigationProps) => {
|
}: NavigationProps) => {
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const pathname = usePathname();
|
const pathname = usePathname();
|
||||||
@@ -94,12 +67,7 @@ export const MainNavigation = ({
|
|||||||
const [latestVersion, setLatestVersion] = useState("");
|
const [latestVersion, setLatestVersion] = useState("");
|
||||||
const { signOut: signOutWithAudit } = useSignOut({ id: user.id, email: user.email });
|
const { signOut: signOutWithAudit } = useSignOut({ id: user.id, email: user.email });
|
||||||
|
|
||||||
const [isPending, startTransition] = useTransition();
|
const { isManager, isOwner, isBilling } = getAccessFlags(membershipRole);
|
||||||
const { isManager, isOwner, isBilling, isMember } = getAccessFlags(membershipRole);
|
|
||||||
const isMembershipPending = membershipRole === undefined;
|
|
||||||
const disabledNavigationMessage = isMembershipPending
|
|
||||||
? t("common.loading")
|
|
||||||
: t("common.you_are_not_authorized_to_perform_this_action");
|
|
||||||
|
|
||||||
const isOwnerOrManager = isManager || isOwner;
|
const isOwnerOrManager = isManager || isOwner;
|
||||||
|
|
||||||
@@ -136,7 +104,6 @@ export const MainNavigation = ({
|
|||||||
icon: MessageCircle,
|
icon: MessageCircle,
|
||||||
isActive: pathname?.includes("/surveys"),
|
isActive: pathname?.includes("/surveys"),
|
||||||
isHidden: false,
|
isHidden: false,
|
||||||
disabled: isMembershipPending || isBilling,
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
href: `/environments/${environment.id}/contacts`,
|
href: `/environments/${environment.id}/contacts`,
|
||||||
@@ -146,24 +113,22 @@ export const MainNavigation = ({
|
|||||||
pathname?.includes("/contacts") ||
|
pathname?.includes("/contacts") ||
|
||||||
pathname?.includes("/segments") ||
|
pathname?.includes("/segments") ||
|
||||||
pathname?.includes("/attributes"),
|
pathname?.includes("/attributes"),
|
||||||
disabled: isMembershipPending || isBilling,
|
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: t("common.settings"),
|
name: t("common.configuration"),
|
||||||
href: `/environments/${environment.id}/settings/workspace/general`,
|
href: `/environments/${environment.id}/workspace/general`,
|
||||||
icon: Cog,
|
icon: Cog,
|
||||||
isActive: pathname?.includes("/settings/"),
|
isActive: pathname?.includes("/project"),
|
||||||
disabled: isMembershipPending || isBilling,
|
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
[t, environment.id, pathname, isMembershipPending, isBilling]
|
[t, environment.id, pathname]
|
||||||
);
|
);
|
||||||
|
|
||||||
const dropdownNavigation = [
|
const dropdownNavigation = [
|
||||||
{
|
{
|
||||||
label: t("common.settings"),
|
label: t("common.account"),
|
||||||
href: `/environments/${environment.id}/settings/account/profile`,
|
href: `/environments/${environment.id}/settings/profile`,
|
||||||
icon: SettingsIcon,
|
icon: UserCircleIcon,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: t("common.documentation"),
|
label: t("common.documentation"),
|
||||||
@@ -179,111 +144,6 @@ export const MainNavigation = ({
|
|||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|
||||||
const [isWorkspaceDropdownOpen, setIsWorkspaceDropdownOpen] = useState(false);
|
|
||||||
const [isOrganizationDropdownOpen, setIsOrganizationDropdownOpen] = useState(false);
|
|
||||||
const [projects, setProjects] = useState<{ id: string; name: string }[]>([]);
|
|
||||||
const [organizations, setOrganizations] = useState<{ id: string; name: string }[]>([]);
|
|
||||||
const [isLoadingProjects, setIsLoadingProjects] = useState(false);
|
|
||||||
const [hasInitializedProjects, setHasInitializedProjects] = useState(false);
|
|
||||||
const [isLoadingOrganizations, setIsLoadingOrganizations] = useState(false);
|
|
||||||
const [workspaceLoadError, setWorkspaceLoadError] = useState<string | null>(null);
|
|
||||||
const [organizationLoadError, setOrganizationLoadError] = useState<string | null>(null);
|
|
||||||
const [openCreateProjectModal, setOpenCreateProjectModal] = useState(false);
|
|
||||||
const [openCreateOrganizationModal, setOpenCreateOrganizationModal] = useState(false);
|
|
||||||
const [openProjectLimitModal, setOpenProjectLimitModal] = useState(false);
|
|
||||||
|
|
||||||
const renderSwitcherError = (error: string, onRetry: () => void, retryLabel: string) => (
|
|
||||||
<div className="px-2 py-4">
|
|
||||||
<p className="mb-2 text-sm text-red-600">{error}</p>
|
|
||||||
<button onClick={onRetry} className="text-xs text-slate-600 underline hover:text-slate-800">
|
|
||||||
{retryLabel}
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
|
|
||||||
const workspaceSettingsHref = `/environments/${environment.id}/settings/workspace/general`;
|
|
||||||
const organizationSettingsHref = `/environments/${environment.id}/settings/organization/general`;
|
|
||||||
|
|
||||||
const loadProjects = useCallback(async () => {
|
|
||||||
setIsLoadingProjects(true);
|
|
||||||
setWorkspaceLoadError(null);
|
|
||||||
|
|
||||||
try {
|
|
||||||
const result = await getProjectsForSwitcherAction({ organizationId: organization.id });
|
|
||||||
if (result?.data) {
|
|
||||||
const sorted = [...result.data].sort((a, b) => a.name.localeCompare(b.name));
|
|
||||||
setProjects(sorted);
|
|
||||||
} else {
|
|
||||||
setWorkspaceLoadError(getFormattedErrorMessage(result) || t("common.failed_to_load_workspaces"));
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
const formattedError =
|
|
||||||
typeof error === "object" && error !== null
|
|
||||||
? getFormattedErrorMessage(error as { serverError?: string; validationErrors?: unknown })
|
|
||||||
: "";
|
|
||||||
setWorkspaceLoadError(
|
|
||||||
formattedError || (error instanceof Error ? error.message : t("common.failed_to_load_workspaces"))
|
|
||||||
);
|
|
||||||
} finally {
|
|
||||||
setIsLoadingProjects(false);
|
|
||||||
setHasInitializedProjects(true);
|
|
||||||
}
|
|
||||||
}, [organization.id, t]);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (!isWorkspaceDropdownOpen || projects.length > 0 || isLoadingProjects || workspaceLoadError) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
loadProjects();
|
|
||||||
}, [isWorkspaceDropdownOpen, projects.length, isLoadingProjects, workspaceLoadError, loadProjects]);
|
|
||||||
|
|
||||||
const loadOrganizations = useCallback(async () => {
|
|
||||||
setIsLoadingOrganizations(true);
|
|
||||||
setOrganizationLoadError(null);
|
|
||||||
|
|
||||||
try {
|
|
||||||
const result = await getOrganizationsForSwitcherAction({ organizationId: organization.id });
|
|
||||||
if (result?.data) {
|
|
||||||
const sorted = [...result.data].sort((a, b) => a.name.localeCompare(b.name));
|
|
||||||
setOrganizations(sorted);
|
|
||||||
} else {
|
|
||||||
setOrganizationLoadError(
|
|
||||||
getFormattedErrorMessage(result) || t("common.failed_to_load_organizations")
|
|
||||||
);
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
const formattedError =
|
|
||||||
typeof error === "object" && error !== null
|
|
||||||
? getFormattedErrorMessage(error as { serverError?: string; validationErrors?: unknown })
|
|
||||||
: "";
|
|
||||||
setOrganizationLoadError(
|
|
||||||
formattedError || (error instanceof Error ? error.message : t("common.failed_to_load_organizations"))
|
|
||||||
);
|
|
||||||
} finally {
|
|
||||||
setIsLoadingOrganizations(false);
|
|
||||||
}
|
|
||||||
}, [organization.id, t]);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (
|
|
||||||
!isOrganizationDropdownOpen ||
|
|
||||||
organizations.length > 0 ||
|
|
||||||
isLoadingOrganizations ||
|
|
||||||
organizationLoadError
|
|
||||||
) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
loadOrganizations();
|
|
||||||
}, [
|
|
||||||
isOrganizationDropdownOpen,
|
|
||||||
organizations.length,
|
|
||||||
isLoadingOrganizations,
|
|
||||||
organizationLoadError,
|
|
||||||
loadOrganizations,
|
|
||||||
]);
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
async function loadReleases() {
|
async function loadReleases() {
|
||||||
const res = await getLatestStableFbReleaseAction();
|
const res = await getLatestStableFbReleaseAction();
|
||||||
@@ -299,93 +159,7 @@ export const MainNavigation = ({
|
|||||||
if (isOwnerOrManager) loadReleases();
|
if (isOwnerOrManager) loadReleases();
|
||||||
}, [isOwnerOrManager]);
|
}, [isOwnerOrManager]);
|
||||||
|
|
||||||
const trialDaysRemaining = useMemo(() => {
|
const mainNavigationLink = `/environments/${environment.id}/${isBilling ? "settings/billing/" : "surveys/"}`;
|
||||||
if (!isFormbricksCloud || organization.billing?.stripe?.subscriptionStatus !== "trialing") return null;
|
|
||||||
const trialEnd = organization.billing.stripe.trialEnd;
|
|
||||||
if (!trialEnd) return null;
|
|
||||||
const ts = new Date(trialEnd).getTime();
|
|
||||||
if (!Number.isFinite(ts)) return null;
|
|
||||||
const msPerDay = 86_400_000;
|
|
||||||
return Math.ceil((ts - Date.now()) / msPerDay);
|
|
||||||
}, [
|
|
||||||
isFormbricksCloud,
|
|
||||||
organization.billing?.stripe?.subscriptionStatus,
|
|
||||||
organization.billing?.stripe?.trialEnd,
|
|
||||||
]);
|
|
||||||
|
|
||||||
const mainNavigationLink = isBilling
|
|
||||||
? getBillingFallbackPath(environment.id, isFormbricksCloud)
|
|
||||||
: `/environments/${environment.id}/surveys/`;
|
|
||||||
|
|
||||||
const handleProjectChange = (projectId: string) => {
|
|
||||||
if (projectId === project.id) return;
|
|
||||||
startTransition(() => {
|
|
||||||
router.push(`/workspaces/${projectId}/`);
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleOrganizationChange = (organizationId: string) => {
|
|
||||||
if (organizationId === organization.id) return;
|
|
||||||
startTransition(() => {
|
|
||||||
router.push(`/organizations/${organizationId}/`);
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleSettingNavigation = (href: string) => {
|
|
||||||
startTransition(() => {
|
|
||||||
router.push(href);
|
|
||||||
});
|
|
||||||
};
|
|
||||||
|
|
||||||
const handleProjectCreate = () => {
|
|
||||||
if (!hasInitializedProjects || isLoadingProjects) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (projects.length >= organizationProjectsLimit) {
|
|
||||||
setOpenProjectLimitModal(true);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
setOpenCreateProjectModal(true);
|
|
||||||
};
|
|
||||||
|
|
||||||
const projectLimitModalButtons = (): [ModalButton, ModalButton] => {
|
|
||||||
if (isFormbricksCloud) {
|
|
||||||
return [
|
|
||||||
{
|
|
||||||
text: t("environments.settings.billing.upgrade"),
|
|
||||||
href: `/environments/${environment.id}/settings/billing`,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
text: t("common.cancel"),
|
|
||||||
onClick: () => setOpenProjectLimitModal(false),
|
|
||||||
},
|
|
||||||
];
|
|
||||||
}
|
|
||||||
|
|
||||||
return [
|
|
||||||
{
|
|
||||||
text: t("environments.settings.billing.upgrade"),
|
|
||||||
href: isLicenseActive
|
|
||||||
? `/environments/${environment.id}/settings/enterprise`
|
|
||||||
: "https://formbricks.com/upgrade-self-hosted-license",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
text: t("common.cancel"),
|
|
||||||
onClick: () => setOpenProjectLimitModal(false),
|
|
||||||
},
|
|
||||||
];
|
|
||||||
};
|
|
||||||
|
|
||||||
const switcherTriggerClasses = cn(
|
|
||||||
"w-full border-t px-3 py-3 text-left transition-colors duration-200 hover:bg-slate-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-slate-500 focus-visible:ring-inset",
|
|
||||||
isCollapsed ? "flex items-center justify-center" : ""
|
|
||||||
);
|
|
||||||
|
|
||||||
const switcherIconClasses =
|
|
||||||
"flex h-9 w-9 items-center justify-center rounded-full bg-slate-100 text-slate-600";
|
|
||||||
const isInitialProjectsLoading = isWorkspaceDropdownOpen && !hasInitializedProjects && !workspaceLoadError;
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
@@ -414,7 +188,7 @@ export const MainNavigation = ({
|
|||||||
size="icon"
|
size="icon"
|
||||||
onClick={toggleSidebar}
|
onClick={toggleSidebar}
|
||||||
className={cn(
|
className={cn(
|
||||||
"rounded-xl bg-slate-50 p-1 text-slate-600 transition-all hover:bg-slate-100 focus:outline-none focus:ring-0 focus:ring-transparent"
|
"rounded-xl bg-slate-50 p-1 text-slate-600 transition-all hover:bg-slate-100 focus:ring-0 focus:ring-transparent focus:outline-none"
|
||||||
)}>
|
)}>
|
||||||
{isCollapsed ? (
|
{isCollapsed ? (
|
||||||
<PanelLeftOpenIcon strokeWidth={1.5} />
|
<PanelLeftOpenIcon strokeWidth={1.5} />
|
||||||
@@ -425,24 +199,24 @@ export const MainNavigation = ({
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Main Nav Switch */}
|
{/* Main Nav Switch */}
|
||||||
<ul>
|
{!isBilling && (
|
||||||
{mainNavigation.map(
|
<ul>
|
||||||
(item) =>
|
{mainNavigation.map(
|
||||||
!item.isHidden && (
|
(item) =>
|
||||||
<NavigationLink
|
!item.isHidden && (
|
||||||
key={item.name}
|
<NavigationLink
|
||||||
href={item.href}
|
key={item.name}
|
||||||
isActive={item.isActive}
|
href={item.href}
|
||||||
isCollapsed={isCollapsed}
|
isActive={item.isActive}
|
||||||
isTextVisible={isTextVisible}
|
isCollapsed={isCollapsed}
|
||||||
disabled={item.disabled}
|
isTextVisible={isTextVisible}
|
||||||
disabledMessage={item.disabled ? disabledNavigationMessage : undefined}
|
linkText={item.name}>
|
||||||
linkText={item.name}>
|
<item.icon strokeWidth={1.5} />
|
||||||
<item.icon strokeWidth={1.5} />
|
</NavigationLink>
|
||||||
</NavigationLink>
|
)
|
||||||
)
|
)}
|
||||||
)}
|
</ul>
|
||||||
</ul>
|
)}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
@@ -459,200 +233,38 @@ export const MainNavigation = ({
|
|||||||
</Link>
|
</Link>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{/* Trial Days Remaining */}
|
{/* User Switch */}
|
||||||
{!isCollapsed && isFormbricksCloud && trialDaysRemaining !== null && (
|
<div className="flex items-center">
|
||||||
<Link href={`/environments/${environment.id}/settings/billing`} className="m-2 block">
|
|
||||||
<TrialAlert trialDaysRemaining={trialDaysRemaining} size="small" />
|
|
||||||
</Link>
|
|
||||||
)}
|
|
||||||
|
|
||||||
<div className="flex flex-col">
|
|
||||||
<DropdownMenu onOpenChange={setIsWorkspaceDropdownOpen}>
|
|
||||||
<DropdownMenuTrigger asChild id="workspaceDropdownTrigger" className={switcherTriggerClasses}>
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
aria-label={isCollapsed ? t("common.change_workspace") : undefined}
|
|
||||||
className={cn("flex w-full items-center gap-3", isCollapsed && "justify-center")}>
|
|
||||||
<span className={switcherIconClasses}>
|
|
||||||
<FoldersIcon className="h-4 w-4" strokeWidth={1.5} />
|
|
||||||
</span>
|
|
||||||
{!isCollapsed && !isTextVisible && (
|
|
||||||
<>
|
|
||||||
<div className="grow overflow-hidden">
|
|
||||||
<p className="truncate text-sm font-bold text-slate-700">{project.name}</p>
|
|
||||||
<p className="text-sm text-slate-500">{t("common.workspace")}</p>
|
|
||||||
</div>
|
|
||||||
{isPending && (
|
|
||||||
<Loader2 className="h-4 w-4 animate-spin text-slate-600" strokeWidth={1.5} />
|
|
||||||
)}
|
|
||||||
<ChevronRightIcon className="h-4 w-4 shrink-0 text-slate-600" strokeWidth={1.5} />
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
</button>
|
|
||||||
</DropdownMenuTrigger>
|
|
||||||
<DropdownMenuContent side="right" sideOffset={10} alignOffset={5} align="end">
|
|
||||||
<div className="px-2 py-1.5 text-sm font-medium text-slate-500">
|
|
||||||
<FoldersIcon className="mr-2 inline h-4 w-4" strokeWidth={1.5} />
|
|
||||||
{t("common.change_workspace")}
|
|
||||||
</div>
|
|
||||||
{(isLoadingProjects || isInitialProjectsLoading) && (
|
|
||||||
<div className="flex items-center justify-center py-2">
|
|
||||||
<Loader2 className="h-4 w-4 animate-spin" />
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
{!isLoadingProjects &&
|
|
||||||
!isInitialProjectsLoading &&
|
|
||||||
workspaceLoadError &&
|
|
||||||
renderSwitcherError(
|
|
||||||
workspaceLoadError,
|
|
||||||
() => {
|
|
||||||
setWorkspaceLoadError(null);
|
|
||||||
setProjects([]);
|
|
||||||
},
|
|
||||||
t("common.try_again")
|
|
||||||
)}
|
|
||||||
{!isLoadingProjects && !isInitialProjectsLoading && !workspaceLoadError && (
|
|
||||||
<>
|
|
||||||
<DropdownMenuGroup className="max-h-[300px] overflow-y-auto">
|
|
||||||
{projects.map((proj) => (
|
|
||||||
<DropdownMenuCheckboxItem
|
|
||||||
key={proj.id}
|
|
||||||
checked={proj.id === project.id}
|
|
||||||
onClick={() => handleProjectChange(proj.id)}
|
|
||||||
className="cursor-pointer">
|
|
||||||
{proj.name}
|
|
||||||
</DropdownMenuCheckboxItem>
|
|
||||||
))}
|
|
||||||
</DropdownMenuGroup>
|
|
||||||
{isOwnerOrManager && (
|
|
||||||
<DropdownMenuCheckboxItem
|
|
||||||
onClick={handleProjectCreate}
|
|
||||||
className="w-full cursor-pointer justify-between">
|
|
||||||
<span>{t("common.add_new_workspace")}</span>
|
|
||||||
<PlusIcon className="ml-2 h-4 w-4" strokeWidth={1.5} />
|
|
||||||
</DropdownMenuCheckboxItem>
|
|
||||||
)}
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
<DropdownMenuSeparator />
|
|
||||||
<DropdownMenuGroup>
|
|
||||||
<DropdownMenuItem
|
|
||||||
onClick={() => handleSettingNavigation(workspaceSettingsHref)}
|
|
||||||
className="cursor-pointer">
|
|
||||||
<SettingsIcon className="mr-2 h-4 w-4" strokeWidth={1.5} />
|
|
||||||
{t("common.settings")}
|
|
||||||
</DropdownMenuItem>
|
|
||||||
</DropdownMenuGroup>
|
|
||||||
</DropdownMenuContent>
|
|
||||||
</DropdownMenu>
|
|
||||||
|
|
||||||
<DropdownMenu onOpenChange={setIsOrganizationDropdownOpen}>
|
|
||||||
<DropdownMenuTrigger
|
|
||||||
asChild
|
|
||||||
id="organizationDropdownTriggerSidebar"
|
|
||||||
className={switcherTriggerClasses}>
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
aria-label={isCollapsed ? t("common.change_organization") : undefined}
|
|
||||||
className={cn("flex w-full items-center gap-3", isCollapsed && "justify-center")}>
|
|
||||||
<span className={switcherIconClasses}>
|
|
||||||
<Building2Icon className="h-4 w-4" strokeWidth={1.5} />
|
|
||||||
</span>
|
|
||||||
{!isCollapsed && !isTextVisible && (
|
|
||||||
<>
|
|
||||||
<div className="grow overflow-hidden">
|
|
||||||
<p className="truncate text-sm font-bold text-slate-700">{organization.name}</p>
|
|
||||||
<p className="text-sm text-slate-500">{t("common.organization")}</p>
|
|
||||||
</div>
|
|
||||||
{isPending && (
|
|
||||||
<Loader2 className="h-4 w-4 animate-spin text-slate-600" strokeWidth={1.5} />
|
|
||||||
)}
|
|
||||||
<ChevronRightIcon className="h-4 w-4 shrink-0 text-slate-600" strokeWidth={1.5} />
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
</button>
|
|
||||||
</DropdownMenuTrigger>
|
|
||||||
<DropdownMenuContent side="right" sideOffset={10} alignOffset={5} align="end">
|
|
||||||
<div className="px-2 py-1.5 text-sm font-medium text-slate-500">
|
|
||||||
<Building2Icon className="mr-2 inline h-4 w-4" strokeWidth={1.5} />
|
|
||||||
{t("common.change_organization")}
|
|
||||||
</div>
|
|
||||||
{isLoadingOrganizations && (
|
|
||||||
<div className="flex items-center justify-center py-2">
|
|
||||||
<Loader2 className="h-4 w-4 animate-spin" />
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
{!isLoadingOrganizations &&
|
|
||||||
organizationLoadError &&
|
|
||||||
renderSwitcherError(
|
|
||||||
organizationLoadError,
|
|
||||||
() => {
|
|
||||||
setOrganizationLoadError(null);
|
|
||||||
setOrganizations([]);
|
|
||||||
},
|
|
||||||
t("common.try_again")
|
|
||||||
)}
|
|
||||||
{!isLoadingOrganizations && !organizationLoadError && (
|
|
||||||
<>
|
|
||||||
<DropdownMenuGroup className="max-h-[300px] overflow-y-auto">
|
|
||||||
{organizations.map((org) => (
|
|
||||||
<DropdownMenuCheckboxItem
|
|
||||||
key={org.id}
|
|
||||||
checked={org.id === organization.id}
|
|
||||||
onClick={() => handleOrganizationChange(org.id)}
|
|
||||||
className="cursor-pointer">
|
|
||||||
{org.name}
|
|
||||||
</DropdownMenuCheckboxItem>
|
|
||||||
))}
|
|
||||||
</DropdownMenuGroup>
|
|
||||||
{isMultiOrgEnabled && (
|
|
||||||
<DropdownMenuCheckboxItem
|
|
||||||
onClick={() => setOpenCreateOrganizationModal(true)}
|
|
||||||
className="w-full cursor-pointer justify-between">
|
|
||||||
<span>{t("common.create_new_organization")}</span>
|
|
||||||
<PlusIcon className="ml-2 h-4 w-4" strokeWidth={1.5} />
|
|
||||||
</DropdownMenuCheckboxItem>
|
|
||||||
)}
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
<DropdownMenuSeparator />
|
|
||||||
<DropdownMenuGroup>
|
|
||||||
<DropdownMenuItem
|
|
||||||
onClick={() => handleSettingNavigation(organizationSettingsHref)}
|
|
||||||
className="cursor-pointer">
|
|
||||||
<SettingsIcon className="mr-2 h-4 w-4" strokeWidth={1.5} />
|
|
||||||
{t("common.settings")}
|
|
||||||
</DropdownMenuItem>
|
|
||||||
</DropdownMenuGroup>
|
|
||||||
</DropdownMenuContent>
|
|
||||||
</DropdownMenu>
|
|
||||||
|
|
||||||
<DropdownMenu>
|
<DropdownMenu>
|
||||||
<DropdownMenuTrigger
|
<DropdownMenuTrigger
|
||||||
asChild
|
asChild
|
||||||
id="userDropdownTrigger"
|
id="userDropdownTrigger"
|
||||||
className={cn(switcherTriggerClasses, "rounded-br-xl")}>
|
className="w-full rounded-br-xl border-t py-4 transition-colors duration-200 hover:bg-slate-50 focus:outline-none">
|
||||||
<button
|
<div
|
||||||
type="button"
|
className={cn(
|
||||||
aria-label={isCollapsed ? t("common.account_settings") : undefined}
|
"flex cursor-pointer flex-row items-center gap-3",
|
||||||
className={cn("flex w-full items-center gap-3", isCollapsed && "justify-center")}>
|
isCollapsed ? "justify-center px-2" : "px-4"
|
||||||
<span className={switcherIconClasses}>
|
)}>
|
||||||
<ProfileAvatar userId={user.id} />
|
<ProfileAvatar userId={user.id} />
|
||||||
</span>
|
|
||||||
{!isCollapsed && !isTextVisible && (
|
{!isCollapsed && !isTextVisible && (
|
||||||
<>
|
<>
|
||||||
<div className="grow overflow-hidden">
|
<div
|
||||||
|
className={cn(isTextVisible ? "opacity-0" : "opacity-100", "grow overflow-hidden")}>
|
||||||
<p
|
<p
|
||||||
title={user?.email}
|
title={user?.email}
|
||||||
className="ph-no-capture ph-no-capture -mb-0.5 truncate text-sm font-bold text-slate-700">
|
className={cn(
|
||||||
|
"ph-no-capture ph-no-capture -mb-0.5 truncate text-sm font-bold text-slate-700"
|
||||||
|
)}>
|
||||||
{user?.name ? <span>{user?.name}</span> : <span>{user?.email}</span>}
|
{user?.name ? <span>{user?.name}</span> : <span>{user?.email}</span>}
|
||||||
</p>
|
</p>
|
||||||
<p className="text-sm text-slate-500">{t("common.account")}</p>
|
<p className="text-sm text-slate-700">{t("common.account")}</p>
|
||||||
</div>
|
</div>
|
||||||
<ChevronRightIcon className="h-4 w-4 shrink-0 text-slate-600" strokeWidth={1.5} />
|
<ChevronRightIcon
|
||||||
|
className={cn("h-5 w-5 shrink-0 text-slate-700 hover:text-slate-500")}
|
||||||
|
/>
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
</button>
|
</div>
|
||||||
</DropdownMenuTrigger>
|
</DropdownMenuTrigger>
|
||||||
|
|
||||||
<DropdownMenuContent
|
<DropdownMenuContent
|
||||||
@@ -661,6 +273,8 @@ export const MainNavigation = ({
|
|||||||
sideOffset={10}
|
sideOffset={10}
|
||||||
alignOffset={5}
|
alignOffset={5}
|
||||||
align="end">
|
align="end">
|
||||||
|
{/* Dropdown Items */}
|
||||||
|
|
||||||
{dropdownNavigation.map((link) => (
|
{dropdownNavigation.map((link) => (
|
||||||
<Link
|
<Link
|
||||||
href={link.href}
|
href={link.href}
|
||||||
@@ -674,6 +288,7 @@ export const MainNavigation = ({
|
|||||||
</DropdownMenuItem>
|
</DropdownMenuItem>
|
||||||
</Link>
|
</Link>
|
||||||
))}
|
))}
|
||||||
|
{/* Logout */}
|
||||||
<DropdownMenuItem
|
<DropdownMenuItem
|
||||||
onClick={async () => {
|
onClick={async () => {
|
||||||
const loginUrl = `${publicDomain}/auth/login`;
|
const loginUrl = `${publicDomain}/auth/login`;
|
||||||
@@ -696,28 +311,6 @@ export const MainNavigation = ({
|
|||||||
</div>
|
</div>
|
||||||
</aside>
|
</aside>
|
||||||
)}
|
)}
|
||||||
{openProjectLimitModal && (
|
|
||||||
<ProjectLimitModal
|
|
||||||
open={openProjectLimitModal}
|
|
||||||
setOpen={setOpenProjectLimitModal}
|
|
||||||
buttons={projectLimitModalButtons()}
|
|
||||||
projectLimit={organizationProjectsLimit}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
{openCreateProjectModal && (
|
|
||||||
<CreateProjectModal
|
|
||||||
open={openCreateProjectModal}
|
|
||||||
setOpen={setOpenCreateProjectModal}
|
|
||||||
organizationId={organization.id}
|
|
||||||
isAccessControlAllowed={isAccessControlAllowed}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
{openCreateOrganizationModal && (
|
|
||||||
<CreateOrganizationModal
|
|
||||||
open={openCreateOrganizationModal}
|
|
||||||
setOpen={setOpenCreateOrganizationModal}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -1,7 +1,6 @@
|
|||||||
import Link from "next/link";
|
import Link from "next/link";
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import { cn } from "@/lib/cn";
|
import { cn } from "@/lib/cn";
|
||||||
import { Popover, PopoverContent, PopoverTrigger } from "@/modules/ui/components/popover";
|
|
||||||
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/modules/ui/components/tooltip";
|
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/modules/ui/components/tooltip";
|
||||||
|
|
||||||
interface NavigationLinkProps {
|
interface NavigationLinkProps {
|
||||||
@@ -11,8 +10,6 @@ interface NavigationLinkProps {
|
|||||||
children: React.ReactNode;
|
children: React.ReactNode;
|
||||||
linkText: string;
|
linkText: string;
|
||||||
isTextVisible: boolean;
|
isTextVisible: boolean;
|
||||||
disabled?: boolean;
|
|
||||||
disabledMessage?: string;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export const NavigationLink = ({
|
export const NavigationLink = ({
|
||||||
@@ -22,34 +19,10 @@ export const NavigationLink = ({
|
|||||||
children,
|
children,
|
||||||
linkText,
|
linkText,
|
||||||
isTextVisible = true,
|
isTextVisible = true,
|
||||||
disabled = false,
|
|
||||||
disabledMessage,
|
|
||||||
}: NavigationLinkProps) => {
|
}: NavigationLinkProps) => {
|
||||||
const tooltipText = disabled ? disabledMessage || linkText : linkText;
|
|
||||||
const activeClass = "bg-slate-50 border-r-4 border-brand-dark font-semibold text-slate-900";
|
const activeClass = "bg-slate-50 border-r-4 border-brand-dark font-semibold text-slate-900";
|
||||||
const inactiveClass =
|
const inactiveClass =
|
||||||
"hover:bg-slate-50 border-r-4 border-transparent hover:border-slate-300 transition-all duration-150 ease-in-out";
|
"hover:bg-slate-50 border-r-4 border-transparent hover:border-slate-300 transition-all duration-150 ease-in-out";
|
||||||
const disabledClass = "cursor-not-allowed border-r-4 border-transparent text-slate-400";
|
|
||||||
const getColorClass = (baseClass: string) => {
|
|
||||||
if (disabled) {
|
|
||||||
return disabledClass;
|
|
||||||
}
|
|
||||||
|
|
||||||
return cn(baseClass, isActive ? activeClass : inactiveClass);
|
|
||||||
};
|
|
||||||
|
|
||||||
const collapsedColorClass = getColorClass("text-slate-700 hover:text-slate-900");
|
|
||||||
const expandedColorClass = getColorClass("text-slate-600 hover:text-slate-900");
|
|
||||||
|
|
||||||
const label = (
|
|
||||||
<span
|
|
||||||
className={cn(
|
|
||||||
"ml-2 flex transition-opacity duration-100",
|
|
||||||
isTextVisible ? "opacity-0" : "opacity-100"
|
|
||||||
)}>
|
|
||||||
{linkText}
|
|
||||||
</span>
|
|
||||||
);
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
@@ -57,37 +30,35 @@ export const NavigationLink = ({
|
|||||||
<TooltipProvider delayDuration={0}>
|
<TooltipProvider delayDuration={0}>
|
||||||
<Tooltip>
|
<Tooltip>
|
||||||
<TooltipTrigger asChild>
|
<TooltipTrigger asChild>
|
||||||
<li className={cn("mb-1 ml-2 rounded-l-md py-2 pl-2 text-sm", collapsedColorClass)}>
|
<li
|
||||||
{disabled ? (
|
className={cn(
|
||||||
<div className="flex items-center">{children}</div>
|
"mb-1 ml-2 rounded-l-md py-2 pl-2 text-sm text-slate-700 hover:text-slate-900",
|
||||||
) : (
|
isActive ? activeClass : inactiveClass
|
||||||
<Link href={href}>{children}</Link>
|
)}>
|
||||||
)}
|
<Link href={href} className="flex items-center">
|
||||||
|
{children}
|
||||||
|
</Link>
|
||||||
</li>
|
</li>
|
||||||
</TooltipTrigger>
|
</TooltipTrigger>
|
||||||
<TooltipContent side="right">{tooltipText}</TooltipContent>
|
<TooltipContent side="right">{linkText}</TooltipContent>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
</TooltipProvider>
|
</TooltipProvider>
|
||||||
) : (
|
) : (
|
||||||
<li className={cn("mb-1 rounded-l-md py-2 pl-5 text-sm", expandedColorClass)}>
|
<li
|
||||||
{disabled ? (
|
className={cn(
|
||||||
<Popover>
|
"mb-1 rounded-l-md py-2 pl-5 text-sm text-slate-600 hover:text-slate-900",
|
||||||
<PopoverTrigger asChild>
|
isActive ? activeClass : inactiveClass
|
||||||
<div className="flex items-center">
|
)}>
|
||||||
{children}
|
<Link href={href} className="flex items-center">
|
||||||
{label}
|
{children}
|
||||||
</div>
|
<span
|
||||||
</PopoverTrigger>
|
className={cn(
|
||||||
<PopoverContent className="w-fit max-w-72 px-3 py-2 text-sm text-slate-700">
|
"ml-2 flex transition-opacity duration-100",
|
||||||
{disabledMessage || linkText}
|
isTextVisible ? "opacity-0" : "opacity-100"
|
||||||
</PopoverContent>
|
)}>
|
||||||
</Popover>
|
{linkText}
|
||||||
) : (
|
</span>
|
||||||
<Link href={href} className="flex items-center">
|
</Link>
|
||||||
{children}
|
|
||||||
{label}
|
|
||||||
</Link>
|
|
||||||
)}
|
|
||||||
</li>
|
</li>
|
||||||
)}
|
)}
|
||||||
</>
|
</>
|
||||||
|
|||||||
@@ -31,8 +31,7 @@ export const TopControlBar = ({
|
|||||||
isAccessControlAllowed,
|
isAccessControlAllowed,
|
||||||
membershipRole,
|
membershipRole,
|
||||||
}: TopControlBarProps) => {
|
}: TopControlBarProps) => {
|
||||||
const { isBilling } = getAccessFlags(membershipRole);
|
const { isMember } = getAccessFlags(membershipRole);
|
||||||
const isMembershipPending = membershipRole === undefined;
|
|
||||||
const { environment } = useEnvironment();
|
const { environment } = useEnvironment();
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@@ -49,8 +48,7 @@ export const TopControlBar = ({
|
|||||||
isFormbricksCloud={isFormbricksCloud}
|
isFormbricksCloud={isFormbricksCloud}
|
||||||
isLicenseActive={isLicenseActive}
|
isLicenseActive={isLicenseActive}
|
||||||
isOwnerOrManager={isOwnerOrManager}
|
isOwnerOrManager={isOwnerOrManager}
|
||||||
isBilling={isBilling}
|
isMember={isMember}
|
||||||
isMembershipPending={isMembershipPending}
|
|
||||||
isAccessControlAllowed={isAccessControlAllowed}
|
isAccessControlAllowed={isAccessControlAllowed}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -53,7 +53,7 @@ export const WidgetStatusIndicator = ({ environment }: WidgetStatusIndicatorProp
|
|||||||
<currentStatus.icon />
|
<currentStatus.icon />
|
||||||
</div>
|
</div>
|
||||||
<p className="text-md font-bold text-slate-800 md:text-xl">{currentStatus.title}</p>
|
<p className="text-md font-bold text-slate-800 md:text-xl">{currentStatus.title}</p>
|
||||||
<p className="w-2/3 text-balance text-sm text-slate-600">{currentStatus.subtitle}</p>
|
<p className="w-2/3 text-sm text-balance text-slate-600">{currentStatus.subtitle}</p>
|
||||||
{status === "notImplemented" && (
|
{status === "notImplemented" && (
|
||||||
<Button variant="outline" size="sm" className="bg-white" onClick={() => router.refresh()}>
|
<Button variant="outline" size="sm" className="bg-white" onClick={() => router.refresh()}>
|
||||||
<RotateCcwIcon />
|
<RotateCcwIcon />
|
||||||
|
|||||||
@@ -1,8 +1,15 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import * as Sentry from "@sentry/nextjs";
|
import * as Sentry from "@sentry/nextjs";
|
||||||
import { Building2Icon, ChevronDownIcon, ChevronRightIcon, Loader2, PlusIcon } from "lucide-react";
|
import {
|
||||||
import { useRouter } from "next/navigation";
|
Building2Icon,
|
||||||
|
ChevronDownIcon,
|
||||||
|
ChevronRightIcon,
|
||||||
|
Loader2,
|
||||||
|
PlusIcon,
|
||||||
|
SettingsIcon,
|
||||||
|
} from "lucide-react";
|
||||||
|
import { usePathname, useRouter } from "next/navigation";
|
||||||
import { useEffect, useState, useTransition } from "react";
|
import { useEffect, useState, useTransition } from "react";
|
||||||
import { useTranslation } from "react-i18next";
|
import { useTranslation } from "react-i18next";
|
||||||
import { logger } from "@formbricks/logger";
|
import { logger } from "@formbricks/logger";
|
||||||
@@ -15,46 +22,69 @@ import {
|
|||||||
DropdownMenuCheckboxItem,
|
DropdownMenuCheckboxItem,
|
||||||
DropdownMenuContent,
|
DropdownMenuContent,
|
||||||
DropdownMenuGroup,
|
DropdownMenuGroup,
|
||||||
|
DropdownMenuSeparator,
|
||||||
DropdownMenuTrigger,
|
DropdownMenuTrigger,
|
||||||
} from "@/modules/ui/components/dropdown-menu";
|
} from "@/modules/ui/components/dropdown-menu";
|
||||||
import { useOrganization } from "../context/environment-context";
|
import { useOrganization } from "../context/environment-context";
|
||||||
|
|
||||||
interface OrganizationBreadcrumbProps {
|
interface OrganizationBreadcrumbProps {
|
||||||
currentOrganizationId: string;
|
currentOrganizationId: string;
|
||||||
currentOrganizationName?: string;
|
currentOrganizationName?: string; // Optional: pass directly if context not available
|
||||||
isMultiOrgEnabled: boolean;
|
isMultiOrgEnabled: boolean;
|
||||||
currentEnvironmentId?: string;
|
currentEnvironmentId?: string;
|
||||||
isMembershipPending: boolean;
|
isFormbricksCloud: boolean;
|
||||||
|
isMember: boolean;
|
||||||
|
isOwnerOrManager: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const isActiveOrganizationSetting = (pathname: string, settingId: string): boolean => {
|
||||||
|
// Match /settings/{settingId} or /settings/{settingId}/... but exclude account settings
|
||||||
|
// Exclude paths with /(account)/
|
||||||
|
if (pathname.includes("/(account)/")) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
// Check if path matches /settings/{settingId} (with optional trailing path)
|
||||||
|
const pattern = new RegExp(`/settings/${settingId}(?:/|$)`);
|
||||||
|
return pattern.test(pathname);
|
||||||
|
};
|
||||||
|
|
||||||
export const OrganizationBreadcrumb = ({
|
export const OrganizationBreadcrumb = ({
|
||||||
currentOrganizationId,
|
currentOrganizationId,
|
||||||
currentOrganizationName,
|
currentOrganizationName,
|
||||||
isMultiOrgEnabled,
|
isMultiOrgEnabled,
|
||||||
currentEnvironmentId,
|
currentEnvironmentId,
|
||||||
isMembershipPending,
|
isFormbricksCloud,
|
||||||
|
isMember,
|
||||||
|
isOwnerOrManager,
|
||||||
}: OrganizationBreadcrumbProps) => {
|
}: OrganizationBreadcrumbProps) => {
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
const [isOrganizationDropdownOpen, setIsOrganizationDropdownOpen] = useState(false);
|
const [isOrganizationDropdownOpen, setIsOrganizationDropdownOpen] = useState(false);
|
||||||
const [openCreateOrganizationModal, setOpenCreateOrganizationModal] = useState(false);
|
const [openCreateOrganizationModal, setOpenCreateOrganizationModal] = useState(false);
|
||||||
|
const pathname = usePathname();
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const [isPending, startTransition] = useTransition();
|
const [isPending, startTransition] = useTransition();
|
||||||
const [isLoadingOrganizations, setIsLoadingOrganizations] = useState(false);
|
const [isLoadingOrganizations, setIsLoadingOrganizations] = useState(false);
|
||||||
const [organizations, setOrganizations] = useState<{ id: string; name: string }[]>([]);
|
const [organizations, setOrganizations] = useState<{ id: string; name: string }[]>([]);
|
||||||
const [loadError, setLoadError] = useState<string | null>(null);
|
const [loadError, setLoadError] = useState<string | null>(null);
|
||||||
|
|
||||||
|
// Get current organization name from context OR prop
|
||||||
|
// Context is preferred, but prop is fallback for pages without EnvironmentContextWrapper
|
||||||
const { organization: currentOrganization } = useOrganization();
|
const { organization: currentOrganization } = useOrganization();
|
||||||
const organizationName = currentOrganization?.name || currentOrganizationName || "";
|
const organizationName = currentOrganization?.name || currentOrganizationName || "";
|
||||||
|
|
||||||
|
// Lazy-load organizations when dropdown opens
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
// Only fetch when dropdown opened for first time (and no error state)
|
||||||
if (isOrganizationDropdownOpen && organizations.length === 0 && !isLoadingOrganizations && !loadError) {
|
if (isOrganizationDropdownOpen && organizations.length === 0 && !isLoadingOrganizations && !loadError) {
|
||||||
setIsLoadingOrganizations(true);
|
setIsLoadingOrganizations(true);
|
||||||
setLoadError(null);
|
setLoadError(null); // Clear any previous errors
|
||||||
getOrganizationsForSwitcherAction({ organizationId: currentOrganizationId }).then((result) => {
|
getOrganizationsForSwitcherAction({ organizationId: currentOrganizationId }).then((result) => {
|
||||||
if (result?.data) {
|
if (result?.data) {
|
||||||
const sorted = [...result.data].sort((a, b) => a.name.localeCompare(b.name));
|
// Sort organizations by name
|
||||||
|
const sorted = result.data.toSorted((a, b) => a.name.localeCompare(b.name));
|
||||||
setOrganizations(sorted);
|
setOrganizations(sorted);
|
||||||
} else {
|
} else {
|
||||||
|
// Handle server errors or validation errors
|
||||||
const errorMessage = getFormattedErrorMessage(result);
|
const errorMessage = getFormattedErrorMessage(result);
|
||||||
const error = new Error(errorMessage);
|
const error = new Error(errorMessage);
|
||||||
logger.error(error, "Failed to load organizations");
|
logger.error(error, "Failed to load organizations");
|
||||||
@@ -87,8 +117,53 @@ export const OrganizationBreadcrumb = ({
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
// Hide organization dropdown for single org setups (on-premise)
|
||||||
const showOrganizationDropdown = isMultiOrgEnabled || organizations.length > 1;
|
const showOrganizationDropdown = isMultiOrgEnabled || organizations.length > 1;
|
||||||
|
|
||||||
|
const handleSettingChange = (href: string) => {
|
||||||
|
startTransition(() => {
|
||||||
|
setIsOrganizationDropdownOpen(false);
|
||||||
|
router.push(href);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
const organizationSettings = [
|
||||||
|
{
|
||||||
|
id: "general",
|
||||||
|
label: t("common.general"),
|
||||||
|
href: `/environments/${currentEnvironmentId}/settings/general`,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "teams",
|
||||||
|
label: t("common.members_and_teams"),
|
||||||
|
href: `/environments/${currentEnvironmentId}/settings/teams`,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "api-keys",
|
||||||
|
label: t("common.api_keys"),
|
||||||
|
href: `/environments/${currentEnvironmentId}/settings/api-keys`,
|
||||||
|
hidden: !isOwnerOrManager,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "domain",
|
||||||
|
label: t("common.domain"),
|
||||||
|
href: `/environments/${currentEnvironmentId}/settings/domain`,
|
||||||
|
hidden: isFormbricksCloud,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "billing",
|
||||||
|
label: t("common.billing"),
|
||||||
|
href: `/environments/${currentEnvironmentId}/settings/billing`,
|
||||||
|
hidden: !isFormbricksCloud,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "enterprise",
|
||||||
|
label: t("common.enterprise_license"),
|
||||||
|
href: `/environments/${currentEnvironmentId}/settings/enterprise`,
|
||||||
|
hidden: isFormbricksCloud || isMember,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<BreadcrumbItem isActive={isOrganizationDropdownOpen}>
|
<BreadcrumbItem isActive={isOrganizationDropdownOpen}>
|
||||||
<DropdownMenu onOpenChange={setIsOrganizationDropdownOpen}>
|
<DropdownMenu onOpenChange={setIsOrganizationDropdownOpen}>
|
||||||
@@ -157,6 +232,28 @@ export const OrganizationBreadcrumb = ({
|
|||||||
)}
|
)}
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
|
{currentEnvironmentId && (
|
||||||
|
<div>
|
||||||
|
{showOrganizationDropdown && <DropdownMenuSeparator />}
|
||||||
|
<div className="px-2 py-1.5 text-sm font-medium text-slate-500">
|
||||||
|
<SettingsIcon className="mr-2 inline h-4 w-4" />
|
||||||
|
{t("common.organization_settings")}
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{organizationSettings.map((setting) => {
|
||||||
|
return setting.hidden ? null : (
|
||||||
|
<DropdownMenuCheckboxItem
|
||||||
|
key={setting.id}
|
||||||
|
checked={isActiveOrganizationSetting(pathname, setting.id)}
|
||||||
|
hidden={setting.hidden}
|
||||||
|
onClick={() => handleSettingChange(setting.href)}
|
||||||
|
className="cursor-pointer">
|
||||||
|
{setting.label}
|
||||||
|
</DropdownMenuCheckboxItem>
|
||||||
|
);
|
||||||
|
})}
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
</DropdownMenuContent>
|
</DropdownMenuContent>
|
||||||
</DropdownMenu>
|
</DropdownMenu>
|
||||||
{openCreateOrganizationModal && (
|
{openCreateOrganizationModal && (
|
||||||
|
|||||||
@@ -17,8 +17,7 @@ interface ProjectAndOrgSwitchProps {
|
|||||||
isFormbricksCloud: boolean;
|
isFormbricksCloud: boolean;
|
||||||
isLicenseActive: boolean;
|
isLicenseActive: boolean;
|
||||||
isOwnerOrManager: boolean;
|
isOwnerOrManager: boolean;
|
||||||
isBilling: boolean;
|
isMember: boolean;
|
||||||
isMembershipPending: boolean;
|
|
||||||
isAccessControlAllowed: boolean;
|
isAccessControlAllowed: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -35,8 +34,7 @@ export const ProjectAndOrgSwitch = ({
|
|||||||
isLicenseActive,
|
isLicenseActive,
|
||||||
isOwnerOrManager,
|
isOwnerOrManager,
|
||||||
isAccessControlAllowed,
|
isAccessControlAllowed,
|
||||||
isBilling,
|
isMember,
|
||||||
isMembershipPending,
|
|
||||||
}: ProjectAndOrgSwitchProps) => {
|
}: ProjectAndOrgSwitchProps) => {
|
||||||
const currentEnvironment = environments.find((env) => env.id === currentEnvironmentId);
|
const currentEnvironment = environments.find((env) => env.id === currentEnvironmentId);
|
||||||
const showEnvironmentBreadcrumb = currentEnvironment?.type === "development";
|
const showEnvironmentBreadcrumb = currentEnvironment?.type === "development";
|
||||||
@@ -49,7 +47,9 @@ export const ProjectAndOrgSwitch = ({
|
|||||||
currentOrganizationName={currentOrganizationName}
|
currentOrganizationName={currentOrganizationName}
|
||||||
currentEnvironmentId={currentEnvironmentId}
|
currentEnvironmentId={currentEnvironmentId}
|
||||||
isMultiOrgEnabled={isMultiOrgEnabled}
|
isMultiOrgEnabled={isMultiOrgEnabled}
|
||||||
isMembershipPending={isMembershipPending}
|
isFormbricksCloud={isFormbricksCloud}
|
||||||
|
isMember={isMember}
|
||||||
|
isOwnerOrManager={isOwnerOrManager}
|
||||||
/>
|
/>
|
||||||
{currentProjectId && currentEnvironmentId && (
|
{currentProjectId && currentEnvironmentId && (
|
||||||
<ProjectBreadcrumb
|
<ProjectBreadcrumb
|
||||||
@@ -63,8 +63,6 @@ export const ProjectAndOrgSwitch = ({
|
|||||||
isLicenseActive={isLicenseActive}
|
isLicenseActive={isLicenseActive}
|
||||||
isAccessControlAllowed={isAccessControlAllowed}
|
isAccessControlAllowed={isAccessControlAllowed}
|
||||||
isEnvironmentBreadcrumbVisible={showEnvironmentBreadcrumb}
|
isEnvironmentBreadcrumbVisible={showEnvironmentBreadcrumb}
|
||||||
isBilling={isBilling}
|
|
||||||
isMembershipPending={isMembershipPending}
|
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
{showEnvironmentBreadcrumb && (
|
{showEnvironmentBreadcrumb && (
|
||||||
|
|||||||
@@ -1,8 +1,8 @@
|
|||||||
"use client";
|
"use client";
|
||||||
|
|
||||||
import * as Sentry from "@sentry/nextjs";
|
import * as Sentry from "@sentry/nextjs";
|
||||||
import { ChevronDownIcon, ChevronRightIcon, FoldersIcon, Loader2, PlusIcon } from "lucide-react";
|
import { ChevronDownIcon, ChevronRightIcon, CogIcon, HotelIcon, Loader2, PlusIcon } from "lucide-react";
|
||||||
import { useRouter } from "next/navigation";
|
import { usePathname, useRouter } from "next/navigation";
|
||||||
import { useEffect, useState, useTransition } from "react";
|
import { useEffect, useState, useTransition } from "react";
|
||||||
import { useTranslation } from "react-i18next";
|
import { useTranslation } from "react-i18next";
|
||||||
import { logger } from "@formbricks/logger";
|
import { logger } from "@formbricks/logger";
|
||||||
@@ -16,15 +16,15 @@ import {
|
|||||||
DropdownMenuCheckboxItem,
|
DropdownMenuCheckboxItem,
|
||||||
DropdownMenuContent,
|
DropdownMenuContent,
|
||||||
DropdownMenuGroup,
|
DropdownMenuGroup,
|
||||||
|
DropdownMenuSeparator,
|
||||||
DropdownMenuTrigger,
|
DropdownMenuTrigger,
|
||||||
} from "@/modules/ui/components/dropdown-menu";
|
} from "@/modules/ui/components/dropdown-menu";
|
||||||
import { Popover, PopoverContent, PopoverTrigger } from "@/modules/ui/components/popover";
|
|
||||||
import { ModalButton } from "@/modules/ui/components/upgrade-prompt";
|
import { ModalButton } from "@/modules/ui/components/upgrade-prompt";
|
||||||
import { useProject } from "../context/environment-context";
|
import { useProject } from "../context/environment-context";
|
||||||
|
|
||||||
interface ProjectBreadcrumbProps {
|
interface ProjectBreadcrumbProps {
|
||||||
currentProjectId: string;
|
currentProjectId: string;
|
||||||
currentProjectName?: string;
|
currentProjectName?: string; // Optional: pass directly if context not available
|
||||||
isOwnerOrManager: boolean;
|
isOwnerOrManager: boolean;
|
||||||
organizationProjectsLimit: number;
|
organizationProjectsLimit: number;
|
||||||
isFormbricksCloud: boolean;
|
isFormbricksCloud: boolean;
|
||||||
@@ -33,10 +33,18 @@ interface ProjectBreadcrumbProps {
|
|||||||
currentEnvironmentId: string;
|
currentEnvironmentId: string;
|
||||||
isAccessControlAllowed: boolean;
|
isAccessControlAllowed: boolean;
|
||||||
isEnvironmentBreadcrumbVisible: boolean;
|
isEnvironmentBreadcrumbVisible: boolean;
|
||||||
isBilling: boolean;
|
|
||||||
isMembershipPending: boolean;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const isActiveProjectSetting = (pathname: string, settingId: string): boolean => {
|
||||||
|
// Match /workspace/{settingId} or /workspace/{settingId}/... but exclude settings paths
|
||||||
|
if (pathname.includes("/settings/")) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
// Check if path matches /workspace/{settingId} (with optional trailing path)
|
||||||
|
const pattern = new RegExp(`/workspace/${settingId}(?:/|$)`);
|
||||||
|
return pattern.test(pathname);
|
||||||
|
};
|
||||||
|
|
||||||
export const ProjectBreadcrumb = ({
|
export const ProjectBreadcrumb = ({
|
||||||
currentProjectId,
|
currentProjectId,
|
||||||
currentProjectName,
|
currentProjectName,
|
||||||
@@ -48,7 +56,6 @@ export const ProjectBreadcrumb = ({
|
|||||||
currentEnvironmentId,
|
currentEnvironmentId,
|
||||||
isAccessControlAllowed,
|
isAccessControlAllowed,
|
||||||
isEnvironmentBreadcrumbVisible,
|
isEnvironmentBreadcrumbVisible,
|
||||||
isMembershipPending,
|
|
||||||
}: ProjectBreadcrumbProps) => {
|
}: ProjectBreadcrumbProps) => {
|
||||||
const { t } = useTranslation();
|
const { t } = useTranslation();
|
||||||
const [isProjectDropdownOpen, setIsProjectDropdownOpen] = useState(false);
|
const [isProjectDropdownOpen, setIsProjectDropdownOpen] = useState(false);
|
||||||
@@ -59,19 +66,26 @@ export const ProjectBreadcrumb = ({
|
|||||||
const [projects, setProjects] = useState<{ id: string; name: string }[]>([]);
|
const [projects, setProjects] = useState<{ id: string; name: string }[]>([]);
|
||||||
const [loadError, setLoadError] = useState<string | null>(null);
|
const [loadError, setLoadError] = useState<string | null>(null);
|
||||||
const [isPending, startTransition] = useTransition();
|
const [isPending, startTransition] = useTransition();
|
||||||
|
const pathname = usePathname();
|
||||||
|
|
||||||
|
// Get current project name from context OR prop
|
||||||
|
// Context is preferred, but prop is fallback for pages without EnvironmentContextWrapper
|
||||||
const { project: currentProject } = useProject();
|
const { project: currentProject } = useProject();
|
||||||
const projectName = currentProject?.name || currentProjectName || "";
|
const projectName = currentProject?.name || currentProjectName || "";
|
||||||
|
|
||||||
|
// Lazy-load projects when dropdown opens
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
|
// Only fetch when dropdown opened for first time (and no error state)
|
||||||
if (isProjectDropdownOpen && projects.length === 0 && !isLoadingProjects && !loadError) {
|
if (isProjectDropdownOpen && projects.length === 0 && !isLoadingProjects && !loadError) {
|
||||||
setIsLoadingProjects(true);
|
setIsLoadingProjects(true);
|
||||||
setLoadError(null);
|
setLoadError(null); // Clear any previous errors
|
||||||
getProjectsForSwitcherAction({ organizationId: currentOrganizationId }).then((result) => {
|
getProjectsForSwitcherAction({ organizationId: currentOrganizationId }).then((result) => {
|
||||||
if (result?.data) {
|
if (result?.data) {
|
||||||
const sorted = [...result.data].sort((a, b) => a.name.localeCompare(b.name));
|
// Sort projects by name
|
||||||
|
const sorted = result.data.toSorted((a, b) => a.name.localeCompare(b.name));
|
||||||
setProjects(sorted);
|
setProjects(sorted);
|
||||||
} else {
|
} else {
|
||||||
|
// Handle server errors or validation errors
|
||||||
const errorMessage = getFormattedErrorMessage(result);
|
const errorMessage = getFormattedErrorMessage(result);
|
||||||
const error = new Error(errorMessage);
|
const error = new Error(errorMessage);
|
||||||
logger.error(error, "Failed to load projects");
|
logger.error(error, "Failed to load projects");
|
||||||
@@ -83,6 +97,44 @@ export const ProjectBreadcrumb = ({
|
|||||||
}
|
}
|
||||||
}, [isProjectDropdownOpen, currentOrganizationId, projects.length, isLoadingProjects, loadError, t]);
|
}, [isProjectDropdownOpen, currentOrganizationId, projects.length, isLoadingProjects, loadError, t]);
|
||||||
|
|
||||||
|
const projectSettings = [
|
||||||
|
{
|
||||||
|
id: "general",
|
||||||
|
label: t("common.general"),
|
||||||
|
href: `/environments/${currentEnvironmentId}/workspace/general`,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "look",
|
||||||
|
label: t("common.look_and_feel"),
|
||||||
|
href: `/environments/${currentEnvironmentId}/workspace/look`,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "app-connection",
|
||||||
|
label: t("common.website_and_app_connection"),
|
||||||
|
href: `/environments/${currentEnvironmentId}/workspace/app-connection`,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "integrations",
|
||||||
|
label: t("common.integrations"),
|
||||||
|
href: `/environments/${currentEnvironmentId}/workspace/integrations`,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "teams",
|
||||||
|
label: t("common.team_access"),
|
||||||
|
href: `/environments/${currentEnvironmentId}/workspace/teams`,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "languages",
|
||||||
|
label: t("common.survey_languages"),
|
||||||
|
href: `/environments/${currentEnvironmentId}/workspace/languages`,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "tags",
|
||||||
|
label: t("common.tags"),
|
||||||
|
href: `/environments/${currentEnvironmentId}/workspace/tags`,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
if (!currentProject) {
|
if (!currentProject) {
|
||||||
const errorMessage = `Workspace not found for workspace id: ${currentProjectId}`;
|
const errorMessage = `Workspace not found for workspace id: ${currentProjectId}`;
|
||||||
logger.error(errorMessage);
|
logger.error(errorMessage);
|
||||||
@@ -105,12 +157,18 @@ export const ProjectBreadcrumb = ({
|
|||||||
setOpenCreateProjectModal(true);
|
setOpenCreateProjectModal(true);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const handleProjectSettingsNavigation = (settingId: string) => {
|
||||||
|
startTransition(() => {
|
||||||
|
router.push(`/environments/${currentEnvironmentId}/workspace/${settingId}`);
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
const LimitModalButtons = (): [ModalButton, ModalButton] => {
|
const LimitModalButtons = (): [ModalButton, ModalButton] => {
|
||||||
if (isFormbricksCloud) {
|
if (isFormbricksCloud) {
|
||||||
return [
|
return [
|
||||||
{
|
{
|
||||||
text: t("environments.settings.billing.upgrade"),
|
text: t("environments.settings.billing.upgrade"),
|
||||||
href: `/environments/${currentEnvironmentId}/settings/organization/billing`,
|
href: `/environments/${currentEnvironmentId}/settings/billing`,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
text: t("common.cancel"),
|
text: t("common.cancel"),
|
||||||
@@ -123,7 +181,7 @@ export const ProjectBreadcrumb = ({
|
|||||||
{
|
{
|
||||||
text: t("environments.settings.billing.upgrade"),
|
text: t("environments.settings.billing.upgrade"),
|
||||||
href: isLicenseActive
|
href: isLicenseActive
|
||||||
? `/environments/${currentEnvironmentId}/settings/organization/enterprise`
|
? `/environments/${currentEnvironmentId}/settings/enterprise`
|
||||||
: "https://formbricks.com/upgrade-self-hosted-license",
|
: "https://formbricks.com/upgrade-self-hosted-license",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@@ -132,7 +190,6 @@ export const ProjectBreadcrumb = ({
|
|||||||
},
|
},
|
||||||
];
|
];
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<BreadcrumbItem isActive={isProjectDropdownOpen}>
|
<BreadcrumbItem isActive={isProjectDropdownOpen}>
|
||||||
<DropdownMenu onOpenChange={setIsProjectDropdownOpen}>
|
<DropdownMenu onOpenChange={setIsProjectDropdownOpen}>
|
||||||
@@ -141,7 +198,7 @@ export const ProjectBreadcrumb = ({
|
|||||||
id="projectDropdownTrigger"
|
id="projectDropdownTrigger"
|
||||||
asChild>
|
asChild>
|
||||||
<div className="flex items-center gap-1">
|
<div className="flex items-center gap-1">
|
||||||
<FoldersIcon className="h-3 w-3" strokeWidth={1.5} />
|
<HotelIcon className="h-3 w-3" strokeWidth={1.5} />
|
||||||
<span>{projectName}</span>
|
<span>{projectName}</span>
|
||||||
{isPending && <Loader2 className="h-3 w-3 animate-spin" strokeWidth={1.5} />}
|
{isPending && <Loader2 className="h-3 w-3 animate-spin" strokeWidth={1.5} />}
|
||||||
{isEnvironmentBreadcrumbVisible && !isProjectDropdownOpen ? (
|
{isEnvironmentBreadcrumbVisible && !isProjectDropdownOpen ? (
|
||||||
@@ -154,7 +211,7 @@ export const ProjectBreadcrumb = ({
|
|||||||
|
|
||||||
<DropdownMenuContent align="start" className="mt-2">
|
<DropdownMenuContent align="start" className="mt-2">
|
||||||
<div className="px-2 py-1.5 text-sm font-medium text-slate-500">
|
<div className="px-2 py-1.5 text-sm font-medium text-slate-500">
|
||||||
<FoldersIcon className="mr-2 inline h-4 w-4" strokeWidth={1.5} />
|
<HotelIcon className="mr-2 inline h-4 w-4" strokeWidth={1.5} />
|
||||||
{t("common.choose_workspace")}
|
{t("common.choose_workspace")}
|
||||||
</div>
|
</div>
|
||||||
{isLoadingProjects && (
|
{isLoadingProjects && (
|
||||||
@@ -190,24 +247,7 @@ export const ProjectBreadcrumb = ({
|
|||||||
</DropdownMenuCheckboxItem>
|
</DropdownMenuCheckboxItem>
|
||||||
))}
|
))}
|
||||||
</DropdownMenuGroup>
|
</DropdownMenuGroup>
|
||||||
{isMembershipPending || !isOwnerOrManager ? (
|
{isOwnerOrManager && (
|
||||||
<Popover>
|
|
||||||
<PopoverTrigger asChild>
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
aria-disabled="true"
|
|
||||||
className="relative flex w-full cursor-not-allowed select-none items-center justify-between rounded-lg py-1.5 pl-8 pr-2 text-sm font-medium text-slate-400">
|
|
||||||
<span>{t("common.add_new_workspace")}</span>
|
|
||||||
<PlusIcon className="ml-2 h-4 w-4" strokeWidth={1.5} />
|
|
||||||
</button>
|
|
||||||
</PopoverTrigger>
|
|
||||||
<PopoverContent className="w-fit max-w-72 px-3 py-2 text-sm text-slate-700">
|
|
||||||
{isMembershipPending
|
|
||||||
? t("common.loading")
|
|
||||||
: t("common.you_are_not_authorized_to_perform_this_action")}
|
|
||||||
</PopoverContent>
|
|
||||||
</Popover>
|
|
||||||
) : (
|
|
||||||
<DropdownMenuCheckboxItem
|
<DropdownMenuCheckboxItem
|
||||||
onClick={handleAddProject}
|
onClick={handleAddProject}
|
||||||
className="w-full cursor-pointer justify-between">
|
className="w-full cursor-pointer justify-between">
|
||||||
@@ -217,8 +257,25 @@ export const ProjectBreadcrumb = ({
|
|||||||
)}
|
)}
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
|
<DropdownMenuGroup>
|
||||||
|
<DropdownMenuSeparator />
|
||||||
|
<div className="px-2 py-1.5 text-sm font-medium text-slate-500">
|
||||||
|
<CogIcon className="mr-2 inline h-4 w-4" strokeWidth={1.5} />
|
||||||
|
{t("common.workspace_configuration")}
|
||||||
|
</div>
|
||||||
|
{projectSettings.map((setting) => (
|
||||||
|
<DropdownMenuCheckboxItem
|
||||||
|
key={setting.id}
|
||||||
|
checked={isActiveProjectSetting(pathname, setting.id)}
|
||||||
|
onClick={() => handleProjectSettingsNavigation(setting.id)}
|
||||||
|
className="cursor-pointer">
|
||||||
|
{setting.label}
|
||||||
|
</DropdownMenuCheckboxItem>
|
||||||
|
))}
|
||||||
|
</DropdownMenuGroup>
|
||||||
</DropdownMenuContent>
|
</DropdownMenuContent>
|
||||||
</DropdownMenu>
|
</DropdownMenu>
|
||||||
|
{/* Modals */}
|
||||||
{openLimitModal && (
|
{openLimitModal && (
|
||||||
<ProjectLimitModal
|
<ProjectLimitModal
|
||||||
open={openLimitModal}
|
open={openLimitModal}
|
||||||
|
|||||||
@@ -1,5 +1,6 @@
|
|||||||
import { getServerSession } from "next-auth";
|
import { getServerSession } from "next-auth";
|
||||||
import { redirect } from "next/navigation";
|
import { redirect } from "next/navigation";
|
||||||
|
import { EnvironmentLayout } from "@/app/(app)/environments/[environmentId]/components/EnvironmentLayout";
|
||||||
import { EnvironmentContextWrapper } from "@/app/(app)/environments/[environmentId]/context/environment-context";
|
import { EnvironmentContextWrapper } from "@/app/(app)/environments/[environmentId]/context/environment-context";
|
||||||
import { authOptions } from "@/modules/auth/lib/authOptions";
|
import { authOptions } from "@/modules/auth/lib/authOptions";
|
||||||
import { getEnvironmentLayoutData } from "@/modules/environments/lib/utils";
|
import { getEnvironmentLayoutData } from "@/modules/environments/lib/utils";
|
||||||
@@ -12,11 +13,13 @@ const EnvLayout = async (props: {
|
|||||||
const params = await props.params;
|
const params = await props.params;
|
||||||
const { children } = props;
|
const { children } = props;
|
||||||
|
|
||||||
|
// Check session first (required for userId)
|
||||||
const session = await getServerSession(authOptions);
|
const session = await getServerSession(authOptions);
|
||||||
if (!session?.user) {
|
if (!session?.user) {
|
||||||
return redirect(`/auth/login`);
|
return redirect(`/auth/login`);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Single consolidated data fetch (replaces ~12 individual fetches)
|
||||||
const layoutData = await getEnvironmentLayoutData(params.environmentId, session.user.id);
|
const layoutData = await getEnvironmentLayoutData(params.environmentId, session.user.id);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@@ -26,7 +29,7 @@ const EnvLayout = async (props: {
|
|||||||
environment={layoutData.environment}
|
environment={layoutData.environment}
|
||||||
project={layoutData.project}
|
project={layoutData.project}
|
||||||
organization={layoutData.organization}>
|
organization={layoutData.organization}>
|
||||||
{children}
|
<EnvironmentLayout layoutData={layoutData}>{children}</EnvironmentLayout>
|
||||||
</EnvironmentContextWrapper>
|
</EnvironmentContextWrapper>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -1,11 +1,10 @@
|
|||||||
import { redirect } from "next/navigation";
|
import { redirect } from "next/navigation";
|
||||||
import { IS_FORMBRICKS_CLOUD } from "@/lib/constants";
|
import { IS_FORMBRICKS_CLOUD } from "@/lib/constants";
|
||||||
import { getBillingFallbackPath } from "@/lib/membership/navigation";
|
|
||||||
import { getMembershipByUserIdOrganizationId } from "@/lib/membership/service";
|
import { getMembershipByUserIdOrganizationId } from "@/lib/membership/service";
|
||||||
import { getAccessFlags } from "@/lib/membership/utils";
|
import { getAccessFlags } from "@/lib/membership/utils";
|
||||||
import { getEnvironmentAuth } from "@/modules/environments/lib/utils";
|
import { getEnvironmentAuth } from "@/modules/environments/lib/utils";
|
||||||
|
|
||||||
const EnvironmentPage = async (props: { params: Promise<{ environmentId: string }> }) => {
|
const EnvironmentPage = async (props) => {
|
||||||
const params = await props.params;
|
const params = await props.params;
|
||||||
const { session, organization } = await getEnvironmentAuth(params.environmentId);
|
const { session, organization } = await getEnvironmentAuth(params.environmentId);
|
||||||
|
|
||||||
@@ -13,7 +12,11 @@ const EnvironmentPage = async (props: { params: Promise<{ environmentId: string
|
|||||||
const { isBilling } = getAccessFlags(currentUserMembership?.role);
|
const { isBilling } = getAccessFlags(currentUserMembership?.role);
|
||||||
|
|
||||||
if (isBilling) {
|
if (isBilling) {
|
||||||
return redirect(getBillingFallbackPath(params.environmentId, IS_FORMBRICKS_CLOUD));
|
if (IS_FORMBRICKS_CLOUD) {
|
||||||
|
return redirect(`/environments/${params.environmentId}/settings/billing`);
|
||||||
|
} else {
|
||||||
|
return redirect(`/environments/${params.environmentId}/settings/enterprise`);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
return redirect(`/environments/${params.environmentId}/surveys`);
|
return redirect(`/environments/${params.environmentId}/surveys`);
|
||||||
|
|||||||
@@ -0,0 +1,32 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import { usePathname } from "next/navigation";
|
||||||
|
import { useTranslation } from "react-i18next";
|
||||||
|
import { SecondaryNavigation } from "@/modules/ui/components/secondary-navigation";
|
||||||
|
|
||||||
|
interface AccountSettingsNavbarProps {
|
||||||
|
environmentId?: string;
|
||||||
|
activeId: string;
|
||||||
|
loading?: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
export const AccountSettingsNavbar = ({ environmentId, activeId, loading }: AccountSettingsNavbarProps) => {
|
||||||
|
const pathname = usePathname();
|
||||||
|
const { t } = useTranslation();
|
||||||
|
const navigation = [
|
||||||
|
{
|
||||||
|
id: "profile",
|
||||||
|
label: t("common.profile"),
|
||||||
|
href: `/environments/${environmentId}/settings/profile`,
|
||||||
|
current: pathname?.includes("/profile"),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "notifications",
|
||||||
|
label: t("common.notifications"),
|
||||||
|
href: `/environments/${environmentId}/settings/notifications`,
|
||||||
|
current: pathname?.includes("/notifications"),
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
return <SecondaryNavigation navigation={navigation} activeId={activeId} loading={loading} />;
|
||||||
|
};
|
||||||
@@ -1,14 +1,10 @@
|
|||||||
import { getServerSession } from "next-auth";
|
import { getServerSession } from "next-auth";
|
||||||
import { AuthenticationError, ResourceNotFoundError } from "@formbricks/types/errors";
|
|
||||||
import { getOrganizationByEnvironmentId } from "@/lib/organization/service";
|
import { getOrganizationByEnvironmentId } from "@/lib/organization/service";
|
||||||
import { getProjectByEnvironmentId } from "@/lib/project/service";
|
import { getProjectByEnvironmentId } from "@/lib/project/service";
|
||||||
import { getTranslate } from "@/lingodotdev/server";
|
import { getTranslate } from "@/lingodotdev/server";
|
||||||
import { authOptions } from "@/modules/auth/lib/authOptions";
|
import { authOptions } from "@/modules/auth/lib/authOptions";
|
||||||
|
|
||||||
const AccountSettingsLayout = async (props: {
|
const AccountSettingsLayout = async (props) => {
|
||||||
params: Promise<{ environmentId: string }>;
|
|
||||||
children: React.ReactNode;
|
|
||||||
}) => {
|
|
||||||
const params = await props.params;
|
const params = await props.params;
|
||||||
|
|
||||||
const { children } = props;
|
const { children } = props;
|
||||||
@@ -21,15 +17,15 @@ const AccountSettingsLayout = async (props: {
|
|||||||
]);
|
]);
|
||||||
|
|
||||||
if (!organization) {
|
if (!organization) {
|
||||||
throw new ResourceNotFoundError(t("common.organization"), null);
|
throw new Error(t("common.organization_not_found"));
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!project) {
|
if (!project) {
|
||||||
throw new ResourceNotFoundError(t("common.workspace"), null);
|
throw new Error(t("common.workspace_not_found"));
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!session) {
|
if (!session) {
|
||||||
throw new AuthenticationError(t("common.not_authenticated"));
|
throw new Error(t("common.session_not_found"));
|
||||||
}
|
}
|
||||||
|
|
||||||
return <>{children}</>;
|
return <>{children}</>;
|
||||||
|
|||||||
@@ -4,6 +4,7 @@ import { z } from "zod";
|
|||||||
import { ZUserNotificationSettings } from "@formbricks/types/user";
|
import { ZUserNotificationSettings } from "@formbricks/types/user";
|
||||||
import { getUser, updateUser } from "@/lib/user/service";
|
import { getUser, updateUser } from "@/lib/user/service";
|
||||||
import { authenticatedActionClient } from "@/lib/utils/action-client";
|
import { authenticatedActionClient } from "@/lib/utils/action-client";
|
||||||
|
import { AuthenticatedActionClientCtx } from "@/lib/utils/action-client/types/context";
|
||||||
import { withAuditLogging } from "@/modules/ee/audit-logs/lib/handler";
|
import { withAuditLogging } from "@/modules/ee/audit-logs/lib/handler";
|
||||||
|
|
||||||
const ZUpdateNotificationSettingsAction = z.object({
|
const ZUpdateNotificationSettingsAction = z.object({
|
||||||
@@ -11,16 +12,26 @@ const ZUpdateNotificationSettingsAction = z.object({
|
|||||||
});
|
});
|
||||||
|
|
||||||
export const updateNotificationSettingsAction = authenticatedActionClient
|
export const updateNotificationSettingsAction = authenticatedActionClient
|
||||||
.inputSchema(ZUpdateNotificationSettingsAction)
|
.schema(ZUpdateNotificationSettingsAction)
|
||||||
.action(
|
.action(
|
||||||
withAuditLogging("updated", "user", async ({ ctx, parsedInput }) => {
|
withAuditLogging(
|
||||||
const oldObject = await getUser(ctx.user.id);
|
"updated",
|
||||||
const result = await updateUser(ctx.user.id, {
|
"user",
|
||||||
notificationSettings: parsedInput.notificationSettings,
|
async ({
|
||||||
});
|
ctx,
|
||||||
ctx.auditLoggingCtx.userId = ctx.user.id;
|
parsedInput,
|
||||||
ctx.auditLoggingCtx.oldObject = oldObject;
|
}: {
|
||||||
ctx.auditLoggingCtx.newObject = result;
|
ctx: AuthenticatedActionClientCtx;
|
||||||
return result;
|
parsedInput: Record<string, any>;
|
||||||
})
|
}) => {
|
||||||
|
const oldObject = await getUser(ctx.user.id);
|
||||||
|
const result = await updateUser(ctx.user.id, {
|
||||||
|
notificationSettings: parsedInput.notificationSettings,
|
||||||
|
});
|
||||||
|
ctx.auditLoggingCtx.userId = ctx.user.id;
|
||||||
|
ctx.auditLoggingCtx.oldObject = oldObject;
|
||||||
|
ctx.auditLoggingCtx.newObject = result;
|
||||||
|
return result;
|
||||||
|
}
|
||||||
|
)
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -30,7 +30,7 @@ export const NotificationSwitch = ({
|
|||||||
const isChecked =
|
const isChecked =
|
||||||
notificationType === "unsubscribedOrganizationIds"
|
notificationType === "unsubscribedOrganizationIds"
|
||||||
? !notificationSettings.unsubscribedOrganizationIds?.includes(surveyOrProjectOrOrganizationId)
|
? !notificationSettings.unsubscribedOrganizationIds?.includes(surveyOrProjectOrOrganizationId)
|
||||||
: notificationSettings[notificationType]?.[surveyOrProjectOrOrganizationId] === true;
|
: notificationSettings[notificationType][surveyOrProjectOrOrganizationId] === true;
|
||||||
|
|
||||||
const handleSwitchChange = async () => {
|
const handleSwitchChange = async () => {
|
||||||
setIsLoading(true);
|
setIsLoading(true);
|
||||||
@@ -49,11 +49,8 @@ export const NotificationSwitch = ({
|
|||||||
];
|
];
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
updatedNotificationSettings[notificationType] = {
|
updatedNotificationSettings[notificationType][surveyOrProjectOrOrganizationId] =
|
||||||
...updatedNotificationSettings[notificationType],
|
!updatedNotificationSettings[notificationType][surveyOrProjectOrOrganizationId];
|
||||||
[surveyOrProjectOrOrganizationId]:
|
|
||||||
!updatedNotificationSettings[notificationType]?.[surveyOrProjectOrOrganizationId],
|
|
||||||
};
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const updatedNotificationSettingsActionResponse = await updateNotificationSettingsAction({
|
const updatedNotificationSettingsActionResponse = await updateNotificationSettingsAction({
|
||||||
@@ -81,7 +78,7 @@ export const NotificationSwitch = ({
|
|||||||
) {
|
) {
|
||||||
switch (notificationType) {
|
switch (notificationType) {
|
||||||
case "alert":
|
case "alert":
|
||||||
if (notificationSettings[notificationType]?.[surveyOrProjectOrOrganizationId] === true) {
|
if (notificationSettings[notificationType][surveyOrProjectOrOrganizationId] === true) {
|
||||||
handleSwitchChange();
|
handleSwitchChange();
|
||||||
toast.success(
|
toast.success(
|
||||||
t(
|
t(
|
||||||
|
|||||||
@@ -2,6 +2,7 @@
|
|||||||
|
|
||||||
import { useTranslation } from "react-i18next";
|
import { useTranslation } from "react-i18next";
|
||||||
import { LoadingCard } from "@/app/(app)/components/LoadingCard";
|
import { LoadingCard } from "@/app/(app)/components/LoadingCard";
|
||||||
|
import { AccountSettingsNavbar } from "@/app/(app)/environments/[environmentId]/settings/(account)/components/AccountSettingsNavbar";
|
||||||
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
||||||
import { PageHeader } from "@/modules/ui/components/page-header";
|
import { PageHeader } from "@/modules/ui/components/page-header";
|
||||||
|
|
||||||
@@ -17,7 +18,9 @@ const Loading = () => {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<PageContentWrapper>
|
<PageContentWrapper>
|
||||||
<PageHeader pageTitle={t("common.account_settings")} />
|
<PageHeader pageTitle={t("common.account_settings")}>
|
||||||
|
<AccountSettingsNavbar activeId="notifications" loading />
|
||||||
|
</PageHeader>
|
||||||
{cards.map((card, index) => (
|
{cards.map((card, index) => (
|
||||||
<LoadingCard key={index} {...card} />
|
<LoadingCard key={index} {...card} />
|
||||||
))}
|
))}
|
||||||
|
|||||||
@@ -1,8 +1,185 @@
|
|||||||
import { redirect } from "next/navigation";
|
import { getServerSession } from "next-auth";
|
||||||
|
import { prisma } from "@formbricks/database";
|
||||||
|
import { TUserNotificationSettings } from "@formbricks/types/user";
|
||||||
|
import { AccountSettingsNavbar } from "@/app/(app)/environments/[environmentId]/settings/(account)/components/AccountSettingsNavbar";
|
||||||
|
import { SettingsCard } from "@/app/(app)/environments/[environmentId]/settings/components/SettingsCard";
|
||||||
|
import { getUser } from "@/lib/user/service";
|
||||||
|
import { getTranslate } from "@/lingodotdev/server";
|
||||||
|
import { authOptions } from "@/modules/auth/lib/authOptions";
|
||||||
|
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
||||||
|
import { PageHeader } from "@/modules/ui/components/page-header";
|
||||||
|
import { EditAlerts } from "./components/EditAlerts";
|
||||||
|
import { IntegrationsTip } from "./components/IntegrationsTip";
|
||||||
|
import type { Membership } from "./types";
|
||||||
|
|
||||||
const Page = async (props: { params: Promise<{ environmentId: string }> }) => {
|
const setCompleteNotificationSettings = (
|
||||||
|
notificationSettings: TUserNotificationSettings,
|
||||||
|
memberships: Membership[]
|
||||||
|
): TUserNotificationSettings => {
|
||||||
|
const newNotificationSettings = {
|
||||||
|
alert: {},
|
||||||
|
unsubscribedOrganizationIds: notificationSettings.unsubscribedOrganizationIds || [],
|
||||||
|
};
|
||||||
|
for (const membership of memberships) {
|
||||||
|
for (const project of membership.organization.projects) {
|
||||||
|
// set default values for alerts
|
||||||
|
for (const environment of project.environments) {
|
||||||
|
for (const survey of environment.surveys) {
|
||||||
|
newNotificationSettings.alert[survey.id] =
|
||||||
|
notificationSettings[survey.id]?.responseFinished ||
|
||||||
|
(notificationSettings.alert && notificationSettings.alert[survey.id]) ||
|
||||||
|
false; // check for legacy notification settings w/o "alerts" key
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return newNotificationSettings;
|
||||||
|
};
|
||||||
|
|
||||||
|
const getMemberships = async (userId: string): Promise<Membership[]> => {
|
||||||
|
const memberships = await prisma.membership.findMany({
|
||||||
|
where: {
|
||||||
|
userId,
|
||||||
|
role: {
|
||||||
|
not: "billing",
|
||||||
|
},
|
||||||
|
OR: [
|
||||||
|
{
|
||||||
|
// Fetch all projects if user role is owner or manager
|
||||||
|
role: {
|
||||||
|
in: ["owner", "manager"],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
// Filter projects based on team membership if user is not owner or manager
|
||||||
|
organization: {
|
||||||
|
projects: {
|
||||||
|
some: {
|
||||||
|
projectTeams: {
|
||||||
|
some: {
|
||||||
|
team: {
|
||||||
|
teamUsers: {
|
||||||
|
some: {
|
||||||
|
userId,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
select: {
|
||||||
|
organization: {
|
||||||
|
select: {
|
||||||
|
id: true,
|
||||||
|
name: true,
|
||||||
|
projects: {
|
||||||
|
// Apply conditional filtering based on user's role
|
||||||
|
where: {
|
||||||
|
OR: [
|
||||||
|
{
|
||||||
|
// Fetch all projects if user is owner or manager
|
||||||
|
organization: {
|
||||||
|
memberships: {
|
||||||
|
some: {
|
||||||
|
userId,
|
||||||
|
role: {
|
||||||
|
in: ["owner", "manager"],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
// Only include projects accessible through teams if user is not owner or manager
|
||||||
|
projectTeams: {
|
||||||
|
some: {
|
||||||
|
team: {
|
||||||
|
teamUsers: {
|
||||||
|
some: {
|
||||||
|
userId,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
select: {
|
||||||
|
id: true,
|
||||||
|
name: true,
|
||||||
|
environments: {
|
||||||
|
where: {
|
||||||
|
type: "production",
|
||||||
|
},
|
||||||
|
select: {
|
||||||
|
id: true,
|
||||||
|
surveys: {
|
||||||
|
select: {
|
||||||
|
id: true,
|
||||||
|
name: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
});
|
||||||
|
return memberships;
|
||||||
|
};
|
||||||
|
|
||||||
|
const Page = async (props) => {
|
||||||
|
const searchParams = await props.searchParams;
|
||||||
const params = await props.params;
|
const params = await props.params;
|
||||||
return redirect(`/environments/${params.environmentId}/settings/account/notifications`);
|
const t = await getTranslate();
|
||||||
|
const session = await getServerSession(authOptions);
|
||||||
|
if (!session) {
|
||||||
|
throw new Error(t("common.session_not_found"));
|
||||||
|
}
|
||||||
|
const autoDisableNotificationType = searchParams["type"];
|
||||||
|
const autoDisableNotificationElementId = searchParams["elementId"];
|
||||||
|
|
||||||
|
const [user, memberships] = await Promise.all([getUser(session.user.id), getMemberships(session.user.id)]);
|
||||||
|
if (!user) {
|
||||||
|
throw new Error(t("common.user_not_found"));
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!memberships) {
|
||||||
|
throw new Error(t("common.membership_not_found"));
|
||||||
|
}
|
||||||
|
|
||||||
|
if (user?.notificationSettings) {
|
||||||
|
user.notificationSettings = setCompleteNotificationSettings(user.notificationSettings, memberships);
|
||||||
|
}
|
||||||
|
return (
|
||||||
|
<PageContentWrapper>
|
||||||
|
<PageHeader pageTitle={t("common.account_settings")}>
|
||||||
|
<AccountSettingsNavbar environmentId={params.environmentId} activeId="notifications" />
|
||||||
|
</PageHeader>
|
||||||
|
<SettingsCard
|
||||||
|
title={t("environments.settings.notifications.email_alerts_surveys")}
|
||||||
|
description={t(
|
||||||
|
"environments.settings.notifications.set_up_an_alert_to_get_an_email_on_new_responses"
|
||||||
|
)}>
|
||||||
|
<EditAlerts
|
||||||
|
memberships={memberships}
|
||||||
|
user={user}
|
||||||
|
environmentId={params.environmentId}
|
||||||
|
autoDisableNotificationType={autoDisableNotificationType}
|
||||||
|
autoDisableNotificationElementId={autoDisableNotificationElementId}
|
||||||
|
/>
|
||||||
|
</SettingsCard>
|
||||||
|
<IntegrationsTip environmentId={params.environmentId} />
|
||||||
|
</PageContentWrapper>
|
||||||
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export default Page;
|
export default Page;
|
||||||
|
|||||||
@@ -10,18 +10,17 @@ import {
|
|||||||
getIsEmailUnique,
|
getIsEmailUnique,
|
||||||
verifyUserPassword,
|
verifyUserPassword,
|
||||||
} from "@/app/(app)/environments/[environmentId]/settings/(account)/profile/lib/user";
|
} from "@/app/(app)/environments/[environmentId]/settings/(account)/profile/lib/user";
|
||||||
import { EMAIL_VERIFICATION_DISABLED, PASSWORD_RESET_DISABLED } from "@/lib/constants";
|
import { EMAIL_VERIFICATION_DISABLED } from "@/lib/constants";
|
||||||
import { getUser, updateUser } from "@/lib/user/service";
|
import { getUser, updateUser } from "@/lib/user/service";
|
||||||
import { authenticatedActionClient } from "@/lib/utils/action-client";
|
import { authenticatedActionClient } from "@/lib/utils/action-client";
|
||||||
import { AuthenticatedActionClientCtx } from "@/lib/utils/action-client/types/context";
|
import { AuthenticatedActionClientCtx } from "@/lib/utils/action-client/types/context";
|
||||||
import { requestPasswordReset } from "@/modules/auth/forgot-password/lib/password-reset-service";
|
|
||||||
import { updateBrevoCustomer } from "@/modules/auth/lib/brevo";
|
import { updateBrevoCustomer } from "@/modules/auth/lib/brevo";
|
||||||
import { applyRateLimit } from "@/modules/core/rate-limit/helpers";
|
import { applyRateLimit } from "@/modules/core/rate-limit/helpers";
|
||||||
import { rateLimitConfigs } from "@/modules/core/rate-limit/rate-limit-configs";
|
import { rateLimitConfigs } from "@/modules/core/rate-limit/rate-limit-configs";
|
||||||
import { withAuditLogging } from "@/modules/ee/audit-logs/lib/handler";
|
import { withAuditLogging } from "@/modules/ee/audit-logs/lib/handler";
|
||||||
import { sendVerificationNewEmail } from "@/modules/email";
|
import { sendForgotPasswordEmail, sendVerificationNewEmail } from "@/modules/email";
|
||||||
|
|
||||||
function buildUserUpdatePayload(parsedInput: TUserPersonalInfoUpdateInput): TUserUpdateInput {
|
function buildUserUpdatePayload(parsedInput: any): TUserUpdateInput {
|
||||||
return {
|
return {
|
||||||
...(parsedInput.name && { name: parsedInput.name }),
|
...(parsedInput.name && { name: parsedInput.name }),
|
||||||
...(parsedInput.locale && { locale: parsedInput.locale }),
|
...(parsedInput.locale && { locale: parsedInput.locale }),
|
||||||
@@ -64,40 +63,50 @@ async function handleEmailUpdate({
|
|||||||
return payload;
|
return payload;
|
||||||
}
|
}
|
||||||
|
|
||||||
export const updateUserAction = authenticatedActionClient.inputSchema(ZUserPersonalInfoUpdateInput).action(
|
export const updateUserAction = authenticatedActionClient.schema(ZUserPersonalInfoUpdateInput).action(
|
||||||
withAuditLogging("updated", "user", async ({ ctx, parsedInput }) => {
|
withAuditLogging(
|
||||||
const oldObject = await getUser(ctx.user.id);
|
"updated",
|
||||||
let payload = buildUserUpdatePayload(parsedInput);
|
"user",
|
||||||
payload = await handleEmailUpdate({ ctx, parsedInput, payload });
|
async ({
|
||||||
|
ctx,
|
||||||
|
parsedInput,
|
||||||
|
}: {
|
||||||
|
ctx: AuthenticatedActionClientCtx;
|
||||||
|
parsedInput: TUserPersonalInfoUpdateInput;
|
||||||
|
}) => {
|
||||||
|
const oldObject = await getUser(ctx.user.id);
|
||||||
|
let payload = buildUserUpdatePayload(parsedInput);
|
||||||
|
payload = await handleEmailUpdate({ ctx, parsedInput, payload });
|
||||||
|
|
||||||
// Only proceed with updateUser if we have actual changes to make
|
// Only proceed with updateUser if we have actual changes to make
|
||||||
let newObject = oldObject;
|
let newObject = oldObject;
|
||||||
if (Object.keys(payload).length > 0) {
|
if (Object.keys(payload).length > 0) {
|
||||||
newObject = await updateUser(ctx.user.id, payload);
|
newObject = await updateUser(ctx.user.id, payload);
|
||||||
|
}
|
||||||
|
|
||||||
|
ctx.auditLoggingCtx.userId = ctx.user.id;
|
||||||
|
ctx.auditLoggingCtx.oldObject = oldObject;
|
||||||
|
ctx.auditLoggingCtx.newObject = newObject;
|
||||||
|
|
||||||
|
return true;
|
||||||
}
|
}
|
||||||
|
)
|
||||||
ctx.auditLoggingCtx.userId = ctx.user.id;
|
|
||||||
ctx.auditLoggingCtx.oldObject = oldObject;
|
|
||||||
ctx.auditLoggingCtx.newObject = newObject;
|
|
||||||
|
|
||||||
return true;
|
|
||||||
})
|
|
||||||
);
|
);
|
||||||
|
|
||||||
export const resetPasswordAction = authenticatedActionClient.action(
|
export const resetPasswordAction = authenticatedActionClient.action(
|
||||||
withAuditLogging("passwordReset", "user", async ({ ctx }) => {
|
withAuditLogging(
|
||||||
if (PASSWORD_RESET_DISABLED) {
|
"passwordReset",
|
||||||
throw new OperationNotAllowedError("Password reset is disabled");
|
"user",
|
||||||
|
async ({ ctx }: { ctx: AuthenticatedActionClientCtx; parsedInput: undefined }) => {
|
||||||
|
if (ctx.user.identityProvider !== "email") {
|
||||||
|
throw new OperationNotAllowedError("Password reset is not allowed for this user.");
|
||||||
|
}
|
||||||
|
|
||||||
|
await sendForgotPasswordEmail(ctx.user);
|
||||||
|
|
||||||
|
ctx.auditLoggingCtx.userId = ctx.user.id;
|
||||||
|
|
||||||
|
return { success: true };
|
||||||
}
|
}
|
||||||
|
)
|
||||||
if (ctx.user.identityProvider !== "email") {
|
|
||||||
throw new OperationNotAllowedError("Password reset is not allowed for this user.");
|
|
||||||
}
|
|
||||||
|
|
||||||
await requestPasswordReset(ctx.user, "profile");
|
|
||||||
|
|
||||||
ctx.auditLoggingCtx.userId = ctx.user.id;
|
|
||||||
|
|
||||||
return { success: true };
|
|
||||||
})
|
|
||||||
);
|
);
|
||||||
|
|||||||
@@ -9,7 +9,7 @@ import { useTranslation } from "react-i18next";
|
|||||||
import { z } from "zod";
|
import { z } from "zod";
|
||||||
import { TUser, TUserUpdateInput, ZUser, ZUserEmail } from "@formbricks/types/user";
|
import { TUser, TUserUpdateInput, ZUser, ZUserEmail } from "@formbricks/types/user";
|
||||||
import { PasswordConfirmationModal } from "@/app/(app)/environments/[environmentId]/settings/(account)/profile/components/password-confirmation-modal";
|
import { PasswordConfirmationModal } from "@/app/(app)/environments/[environmentId]/settings/(account)/profile/components/password-confirmation-modal";
|
||||||
import { appLanguages, sortedAppLanguages } from "@/lib/i18n/utils";
|
import { appLanguages } from "@/lib/i18n/utils";
|
||||||
import { getFormattedErrorMessage } from "@/lib/utils/helper";
|
import { getFormattedErrorMessage } from "@/lib/utils/helper";
|
||||||
import { useSignOut } from "@/modules/auth/hooks/use-sign-out";
|
import { useSignOut } from "@/modules/auth/hooks/use-sign-out";
|
||||||
import { Button } from "@/modules/ui/components/button";
|
import { Button } from "@/modules/ui/components/button";
|
||||||
@@ -116,14 +116,10 @@ export const EditProfileDetailsForm = ({
|
|||||||
setShowModal(true);
|
setShowModal(true);
|
||||||
} else {
|
} else {
|
||||||
try {
|
try {
|
||||||
const result = await updateUserAction({
|
await updateUserAction({
|
||||||
...data,
|
...data,
|
||||||
name: data.name.trim(),
|
name: data.name.trim(),
|
||||||
});
|
});
|
||||||
if (result?.serverError) {
|
|
||||||
toast.error(getFormattedErrorMessage(result));
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
toast.success(t("environments.settings.profile.profile_updated_successfully"));
|
toast.success(t("environments.settings.profile.profile_updated_successfully"));
|
||||||
window.location.reload();
|
window.location.reload();
|
||||||
form.reset(data);
|
form.reset(data);
|
||||||
@@ -202,54 +198,41 @@ export const EditProfileDetailsForm = ({
|
|||||||
<FormField
|
<FormField
|
||||||
control={form.control}
|
control={form.control}
|
||||||
name="locale"
|
name="locale"
|
||||||
render={({ field }) => {
|
render={({ field }) => (
|
||||||
const selectedLanguage = appLanguages.find((l) => l.code === field.value);
|
<FormItem className="mt-4">
|
||||||
|
<FormLabel>{t("common.language")}</FormLabel>
|
||||||
return (
|
<FormControl>
|
||||||
<FormItem className="mt-4">
|
<DropdownMenu>
|
||||||
<FormLabel>{t("common.language")}</FormLabel>
|
<DropdownMenuTrigger asChild>
|
||||||
<FormControl>
|
<Button
|
||||||
<DropdownMenu>
|
type="button"
|
||||||
<DropdownMenuTrigger asChild>
|
variant="ghost"
|
||||||
<Button
|
className="h-10 w-full border border-slate-300 px-3 text-left">
|
||||||
type="button"
|
<div className="flex w-full items-center justify-between">
|
||||||
variant="ghost"
|
{appLanguages.find((l) => l.code === field.value)?.label["en-US"] ?? "NA"}
|
||||||
className="h-10 w-full border border-slate-300 px-3 text-left">
|
<ChevronDownIcon className="h-4 w-4 text-slate-500" />
|
||||||
<div className="flex w-full items-center justify-between">
|
</div>
|
||||||
{selectedLanguage ? (
|
</Button>
|
||||||
<>
|
</DropdownMenuTrigger>
|
||||||
{selectedLanguage.label["en-US"]}
|
<DropdownMenuContent
|
||||||
{selectedLanguage.label.native !== selectedLanguage.label["en-US"] &&
|
className="min-w-[var(--radix-dropdown-menu-trigger-width)] bg-white text-slate-700"
|
||||||
` (${selectedLanguage.label.native})`}
|
align="start">
|
||||||
</>
|
<DropdownMenuRadioGroup value={field.value} onValueChange={field.onChange}>
|
||||||
) : (
|
{appLanguages.map((lang) => (
|
||||||
t("common.select")
|
<DropdownMenuRadioItem
|
||||||
)}
|
key={lang.code}
|
||||||
<ChevronDownIcon className="h-4 w-4 text-slate-500" />
|
value={lang.code}
|
||||||
</div>
|
className="min-h-8 cursor-pointer">
|
||||||
</Button>
|
{lang.label["en-US"]}
|
||||||
</DropdownMenuTrigger>
|
</DropdownMenuRadioItem>
|
||||||
<DropdownMenuContent
|
))}
|
||||||
className="min-w-[var(--radix-dropdown-menu-trigger-width)] bg-white text-slate-700"
|
</DropdownMenuRadioGroup>
|
||||||
align="start">
|
</DropdownMenuContent>
|
||||||
<DropdownMenuRadioGroup value={field.value} onValueChange={field.onChange}>
|
</DropdownMenu>
|
||||||
{sortedAppLanguages.map((lang) => (
|
</FormControl>
|
||||||
<DropdownMenuRadioItem
|
<FormError />
|
||||||
key={lang.code}
|
</FormItem>
|
||||||
value={lang.code}
|
)}
|
||||||
className="min-h-8 cursor-pointer">
|
|
||||||
{lang.label["en-US"]}
|
|
||||||
{lang.label.native !== lang.label["en-US"] && ` (${lang.label.native})`}
|
|
||||||
</DropdownMenuRadioItem>
|
|
||||||
))}
|
|
||||||
</DropdownMenuRadioGroup>
|
|
||||||
</DropdownMenuContent>
|
|
||||||
</DropdownMenu>
|
|
||||||
</FormControl>
|
|
||||||
<FormError />
|
|
||||||
</FormItem>
|
|
||||||
);
|
|
||||||
}}
|
|
||||||
/>
|
/>
|
||||||
|
|
||||||
{isPasswordResetEnabled && (
|
{isPasswordResetEnabled && (
|
||||||
|
|||||||
@@ -98,7 +98,7 @@ export const PasswordConfirmationModal = ({
|
|||||||
aria-label="password"
|
aria-label="password"
|
||||||
aria-required="true"
|
aria-required="true"
|
||||||
required
|
required
|
||||||
className="block w-full rounded-md border-slate-300 shadow-sm focus:border-brand-dark focus:ring-brand-dark sm:text-sm"
|
className="focus:border-brand-dark focus:ring-brand-dark block w-full rounded-md border-slate-300 shadow-sm sm:text-sm"
|
||||||
value={field.value}
|
value={field.value}
|
||||||
onChange={(password) => field.onChange(password)}
|
onChange={(password) => field.onChange(password)}
|
||||||
/>
|
/>
|
||||||
|
|||||||
@@ -2,6 +2,7 @@
|
|||||||
|
|
||||||
import { useTranslation } from "react-i18next";
|
import { useTranslation } from "react-i18next";
|
||||||
import { LoadingCard } from "@/app/(app)/components/LoadingCard";
|
import { LoadingCard } from "@/app/(app)/components/LoadingCard";
|
||||||
|
import { AccountSettingsNavbar } from "@/app/(app)/environments/[environmentId]/settings/(account)/components/AccountSettingsNavbar";
|
||||||
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
||||||
import { PageHeader } from "@/modules/ui/components/page-header";
|
import { PageHeader } from "@/modules/ui/components/page-header";
|
||||||
|
|
||||||
@@ -27,7 +28,9 @@ const Loading = () => {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<PageContentWrapper>
|
<PageContentWrapper>
|
||||||
<PageHeader pageTitle={t("common.account_settings")} />
|
<PageHeader pageTitle={t("common.account_settings")}>
|
||||||
|
<AccountSettingsNavbar activeId="profile" loading />
|
||||||
|
</PageHeader>
|
||||||
{cards.map((card, index) => (
|
{cards.map((card, index) => (
|
||||||
<LoadingCard key={index} {...card} />
|
<LoadingCard key={index} {...card} />
|
||||||
))}
|
))}
|
||||||
|
|||||||
@@ -1,8 +1,101 @@
|
|||||||
import { redirect } from "next/navigation";
|
import { AccountSettingsNavbar } from "@/app/(app)/environments/[environmentId]/settings/(account)/components/AccountSettingsNavbar";
|
||||||
|
import { AccountSecurity } from "@/app/(app)/environments/[environmentId]/settings/(account)/profile/components/AccountSecurity";
|
||||||
|
import { EMAIL_VERIFICATION_DISABLED, IS_FORMBRICKS_CLOUD, PASSWORD_RESET_DISABLED } from "@/lib/constants";
|
||||||
|
import { getOrganizationsWhereUserIsSingleOwner } from "@/lib/organization/service";
|
||||||
|
import { getUser } from "@/lib/user/service";
|
||||||
|
import { getTranslate } from "@/lingodotdev/server";
|
||||||
|
import { getIsMultiOrgEnabled, getIsTwoFactorAuthEnabled } from "@/modules/ee/license-check/lib/utils";
|
||||||
|
import { getEnvironmentAuth } from "@/modules/environments/lib/utils";
|
||||||
|
import { IdBadge } from "@/modules/ui/components/id-badge";
|
||||||
|
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
||||||
|
import { PageHeader } from "@/modules/ui/components/page-header";
|
||||||
|
import { UpgradePrompt } from "@/modules/ui/components/upgrade-prompt";
|
||||||
|
import { SettingsCard } from "../../components/SettingsCard";
|
||||||
|
import { DeleteAccount } from "./components/DeleteAccount";
|
||||||
|
import { EditProfileDetailsForm } from "./components/EditProfileDetailsForm";
|
||||||
|
|
||||||
const Page = async (props: { params: Promise<{ environmentId: string }> }) => {
|
const Page = async (props: { params: Promise<{ environmentId: string }> }) => {
|
||||||
|
const isTwoFactorAuthEnabled = await getIsTwoFactorAuthEnabled();
|
||||||
|
const isMultiOrgEnabled = await getIsMultiOrgEnabled();
|
||||||
const params = await props.params;
|
const params = await props.params;
|
||||||
return redirect(`/environments/${params.environmentId}/settings/account/profile`);
|
const t = await getTranslate();
|
||||||
|
const { environmentId } = params;
|
||||||
|
|
||||||
|
const { session } = await getEnvironmentAuth(params.environmentId);
|
||||||
|
|
||||||
|
const organizationsWithSingleOwner = await getOrganizationsWhereUserIsSingleOwner(session.user.id);
|
||||||
|
|
||||||
|
const user = session?.user ? await getUser(session.user.id) : null;
|
||||||
|
|
||||||
|
if (!user) {
|
||||||
|
throw new Error(t("common.user_not_found"));
|
||||||
|
}
|
||||||
|
|
||||||
|
const isPasswordResetEnabled = !PASSWORD_RESET_DISABLED && user.identityProvider === "email";
|
||||||
|
|
||||||
|
return (
|
||||||
|
<PageContentWrapper>
|
||||||
|
<PageHeader pageTitle={t("common.account_settings")}>
|
||||||
|
<AccountSettingsNavbar environmentId={environmentId} activeId="profile" />
|
||||||
|
</PageHeader>
|
||||||
|
{user && (
|
||||||
|
<div>
|
||||||
|
<SettingsCard
|
||||||
|
title={t("environments.settings.profile.personal_information")}
|
||||||
|
description={t("environments.settings.profile.update_personal_info")}>
|
||||||
|
<EditProfileDetailsForm
|
||||||
|
user={user}
|
||||||
|
emailVerificationDisabled={EMAIL_VERIFICATION_DISABLED}
|
||||||
|
isPasswordResetEnabled={isPasswordResetEnabled}
|
||||||
|
/>
|
||||||
|
</SettingsCard>
|
||||||
|
{user.identityProvider === "email" && (
|
||||||
|
<SettingsCard
|
||||||
|
title={t("common.security")}
|
||||||
|
description={t("environments.settings.profile.security_description")}>
|
||||||
|
{!isTwoFactorAuthEnabled && !user.twoFactorEnabled ? (
|
||||||
|
<UpgradePrompt
|
||||||
|
title={t("environments.settings.profile.unlock_two_factor_authentication")}
|
||||||
|
description={t("environments.settings.profile.two_factor_authentication_description")}
|
||||||
|
buttons={[
|
||||||
|
{
|
||||||
|
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",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
text: t("common.learn_more"),
|
||||||
|
href: IS_FORMBRICKS_CLOUD
|
||||||
|
? `/environments/${params.environmentId}/settings/billing`
|
||||||
|
: "https://formbricks.com/learn-more-self-hosting-license",
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
/>
|
||||||
|
) : (
|
||||||
|
<AccountSecurity user={user} />
|
||||||
|
)}
|
||||||
|
</SettingsCard>
|
||||||
|
)}
|
||||||
|
|
||||||
|
<SettingsCard
|
||||||
|
title={t("environments.settings.profile.delete_account")}
|
||||||
|
description={t("environments.settings.profile.confirm_delete_account")}>
|
||||||
|
<DeleteAccount
|
||||||
|
session={session}
|
||||||
|
IS_FORMBRICKS_CLOUD={IS_FORMBRICKS_CLOUD}
|
||||||
|
user={user}
|
||||||
|
organizationsWithSingleOwner={organizationsWithSingleOwner}
|
||||||
|
isMultiOrgEnabled={isMultiOrgEnabled}
|
||||||
|
/>
|
||||||
|
</SettingsCard>
|
||||||
|
<IdBadge id={user.id} label={t("common.profile_id")} variant="column" />
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</PageContentWrapper>
|
||||||
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export default Page;
|
export default Page;
|
||||||
|
|||||||
@@ -1,8 +1,3 @@
|
|||||||
import { redirect } from "next/navigation";
|
import { APIKeysPage } from "@/modules/organization/settings/api-keys/page";
|
||||||
|
|
||||||
const Page = async (props: { params: Promise<{ environmentId: string }> }) => {
|
export default APIKeysPage;
|
||||||
const params = await props.params;
|
|
||||||
return redirect(`/environments/${params.environmentId}/settings/organization/api-keys`);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default Page;
|
|
||||||
|
|||||||
@@ -1,3 +1,5 @@
|
|||||||
|
import { OrganizationSettingsNavbar } from "@/app/(app)/environments/[environmentId]/settings/(organization)/components/OrganizationSettingsNavbar";
|
||||||
|
import { IS_FORMBRICKS_CLOUD } from "@/lib/constants";
|
||||||
import { getTranslate } from "@/lingodotdev/server";
|
import { getTranslate } from "@/lingodotdev/server";
|
||||||
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
||||||
import { PageHeader } from "@/modules/ui/components/page-header";
|
import { PageHeader } from "@/modules/ui/components/page-header";
|
||||||
@@ -6,7 +8,9 @@ const Loading = async () => {
|
|||||||
const t = await getTranslate();
|
const t = await getTranslate();
|
||||||
return (
|
return (
|
||||||
<PageContentWrapper>
|
<PageContentWrapper>
|
||||||
<PageHeader pageTitle={t("environments.settings.general.organization_settings")} />
|
<PageHeader pageTitle={t("environments.settings.general.organization_settings")}>
|
||||||
|
<OrganizationSettingsNavbar isFormbricksCloud={IS_FORMBRICKS_CLOUD} activeId="billing" loading />
|
||||||
|
</PageHeader>
|
||||||
<div className="my-8 h-64 animate-pulse rounded-xl bg-slate-200"></div>
|
<div className="my-8 h-64 animate-pulse rounded-xl bg-slate-200"></div>
|
||||||
<div className="my-8 h-96 animate-pulse rounded-md bg-slate-200"></div>
|
<div className="my-8 h-96 animate-pulse rounded-md bg-slate-200"></div>
|
||||||
</PageContentWrapper>
|
</PageContentWrapper>
|
||||||
|
|||||||
@@ -1,8 +1,3 @@
|
|||||||
import { redirect } from "next/navigation";
|
import { PricingPage } from "@/modules/ee/billing/page";
|
||||||
|
|
||||||
const Page = async (props: { params: Promise<{ environmentId: string }> }) => {
|
export default PricingPage;
|
||||||
const params = await props.params;
|
|
||||||
return redirect(`/environments/${params.environmentId}/settings/organization/billing`);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default Page;
|
|
||||||
|
|||||||
@@ -0,0 +1,74 @@
|
|||||||
|
"use client";
|
||||||
|
|
||||||
|
import { usePathname } from "next/navigation";
|
||||||
|
import { useTranslation } from "react-i18next";
|
||||||
|
import { TOrganizationRole } from "@formbricks/types/memberships";
|
||||||
|
import { getAccessFlags } from "@/lib/membership/utils";
|
||||||
|
import { SecondaryNavigation } from "@/modules/ui/components/secondary-navigation";
|
||||||
|
|
||||||
|
interface OrganizationSettingsNavbarProps {
|
||||||
|
environmentId?: string;
|
||||||
|
isFormbricksCloud: boolean;
|
||||||
|
membershipRole?: TOrganizationRole;
|
||||||
|
activeId: string;
|
||||||
|
loading?: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
export const OrganizationSettingsNavbar = ({
|
||||||
|
environmentId,
|
||||||
|
isFormbricksCloud,
|
||||||
|
membershipRole,
|
||||||
|
activeId,
|
||||||
|
loading,
|
||||||
|
}: OrganizationSettingsNavbarProps) => {
|
||||||
|
const pathname = usePathname();
|
||||||
|
const { isMember, isOwner } = getAccessFlags(membershipRole);
|
||||||
|
const isPricingDisabled = isMember;
|
||||||
|
const { t } = useTranslation();
|
||||||
|
|
||||||
|
const navigation = [
|
||||||
|
{
|
||||||
|
id: "general",
|
||||||
|
label: t("common.general"),
|
||||||
|
href: `/environments/${environmentId}/settings/general`,
|
||||||
|
current: pathname?.includes("/general"),
|
||||||
|
hidden: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "teams",
|
||||||
|
label: t("common.members_and_teams"),
|
||||||
|
href: `/environments/${environmentId}/settings/teams`,
|
||||||
|
current: pathname?.includes("/teams"),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "api-keys",
|
||||||
|
label: t("common.api_keys"),
|
||||||
|
href: `/environments/${environmentId}/settings/api-keys`,
|
||||||
|
current: pathname?.includes("/api-keys"),
|
||||||
|
hidden: !isOwner,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "domain",
|
||||||
|
label: t("common.domain"),
|
||||||
|
href: `/environments/${environmentId}/settings/domain`,
|
||||||
|
current: pathname?.includes("/domain"),
|
||||||
|
hidden: isFormbricksCloud,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "billing",
|
||||||
|
label: t("common.billing"),
|
||||||
|
href: `/environments/${environmentId}/settings/billing`,
|
||||||
|
hidden: !isFormbricksCloud || loading,
|
||||||
|
current: pathname?.includes("/billing"),
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "enterprise",
|
||||||
|
label: t("common.enterprise_license"),
|
||||||
|
href: `/environments/${environmentId}/settings/enterprise`,
|
||||||
|
hidden: isFormbricksCloud || isPricingDisabled,
|
||||||
|
current: pathname?.includes("/enterprise"),
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
return <SecondaryNavigation navigation={navigation} activeId={activeId} loading={loading} />;
|
||||||
|
};
|
||||||
@@ -1,8 +1,72 @@
|
|||||||
import { redirect } from "next/navigation";
|
import { notFound } from "next/navigation";
|
||||||
|
import { IS_FORMBRICKS_CLOUD, IS_STORAGE_CONFIGURED } from "@/lib/constants";
|
||||||
|
import { getTranslate } from "@/lingodotdev/server";
|
||||||
|
import { getWhiteLabelPermission } from "@/modules/ee/license-check/lib/utils";
|
||||||
|
import { FaviconCustomizationSettings } from "@/modules/ee/whitelabel/favicon-customization/components/favicon-customization-settings";
|
||||||
|
import { getEnvironmentAuth } from "@/modules/environments/lib/utils";
|
||||||
|
import { getSurveysWithSlugsByOrganizationId } from "@/modules/survey/lib/slug";
|
||||||
|
import { Alert, AlertDescription } from "@/modules/ui/components/alert";
|
||||||
|
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
||||||
|
import { PageHeader } from "@/modules/ui/components/page-header";
|
||||||
|
import { SettingsCard } from "../../components/SettingsCard";
|
||||||
|
import { OrganizationSettingsNavbar } from "../components/OrganizationSettingsNavbar";
|
||||||
|
import { PrettyUrlsTable } from "./components/pretty-urls-table";
|
||||||
|
|
||||||
const Page = async (props: { params: Promise<{ environmentId: string }> }) => {
|
const Page = async (props: { params: Promise<{ environmentId: string }> }) => {
|
||||||
const params = await props.params;
|
const params = await props.params;
|
||||||
return redirect(`/environments/${params.environmentId}/settings/organization/domain`);
|
const t = await getTranslate();
|
||||||
|
|
||||||
|
if (IS_FORMBRICKS_CLOUD) {
|
||||||
|
return notFound();
|
||||||
|
}
|
||||||
|
|
||||||
|
const { session, currentUserMembership, organization, isOwner, isManager } = await getEnvironmentAuth(
|
||||||
|
params.environmentId
|
||||||
|
);
|
||||||
|
|
||||||
|
if (!session) {
|
||||||
|
throw new Error(t("common.session_not_found"));
|
||||||
|
}
|
||||||
|
|
||||||
|
const hasWhiteLabelPermission = await getWhiteLabelPermission(organization.billing.plan);
|
||||||
|
const isOwnerOrManager = isManager || isOwner;
|
||||||
|
|
||||||
|
const surveys = await getSurveysWithSlugsByOrganizationId(organization.id);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<PageContentWrapper>
|
||||||
|
<PageHeader pageTitle={t("environments.settings.general.organization_settings")}>
|
||||||
|
<OrganizationSettingsNavbar
|
||||||
|
environmentId={params.environmentId}
|
||||||
|
isFormbricksCloud={IS_FORMBRICKS_CLOUD}
|
||||||
|
membershipRole={currentUserMembership?.role}
|
||||||
|
activeId="domain"
|
||||||
|
/>
|
||||||
|
</PageHeader>
|
||||||
|
|
||||||
|
{!IS_STORAGE_CONFIGURED && (
|
||||||
|
<div className="max-w-4xl">
|
||||||
|
<Alert variant="warning">
|
||||||
|
<AlertDescription>{t("common.storage_not_configured")}</AlertDescription>
|
||||||
|
</Alert>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
|
||||||
|
<FaviconCustomizationSettings
|
||||||
|
organization={organization}
|
||||||
|
hasWhiteLabelPermission={hasWhiteLabelPermission}
|
||||||
|
environmentId={params.environmentId}
|
||||||
|
isReadOnly={!isOwnerOrManager}
|
||||||
|
isStorageConfigured={IS_STORAGE_CONFIGURED}
|
||||||
|
/>
|
||||||
|
|
||||||
|
<SettingsCard
|
||||||
|
title={t("environments.settings.domain.title")}
|
||||||
|
description={t("environments.settings.domain.description")}>
|
||||||
|
<PrettyUrlsTable surveys={surveys} />
|
||||||
|
</SettingsCard>
|
||||||
|
</PageContentWrapper>
|
||||||
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export default Page;
|
export default Page;
|
||||||
|
|||||||
@@ -1,146 +0,0 @@
|
|||||||
"use client";
|
|
||||||
|
|
||||||
import type { TFunction } from "i18next";
|
|
||||||
import Link from "next/link";
|
|
||||||
import { useTranslation } from "react-i18next";
|
|
||||||
import { SettingsCard } from "@/app/(app)/environments/[environmentId]/settings/components/SettingsCard";
|
|
||||||
import type { TEnterpriseLicenseFeatures } from "@/modules/ee/license-check/types/enterprise-license";
|
|
||||||
import { Badge } from "@/modules/ui/components/badge";
|
|
||||||
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/modules/ui/components/table";
|
|
||||||
|
|
||||||
type TPublicLicenseFeatureKey = Exclude<keyof TEnterpriseLicenseFeatures, "isMultiOrgEnabled" | "ai">;
|
|
||||||
|
|
||||||
type TFeatureDefinition = {
|
|
||||||
key: TPublicLicenseFeatureKey;
|
|
||||||
labelKey: string;
|
|
||||||
docsUrl: string;
|
|
||||||
};
|
|
||||||
|
|
||||||
const getFeatureDefinitions = (t: TFunction): TFeatureDefinition[] => {
|
|
||||||
return [
|
|
||||||
{
|
|
||||||
key: "contacts",
|
|
||||||
labelKey: t("environments.settings.enterprise.license_feature_contacts"),
|
|
||||||
docsUrl:
|
|
||||||
"https://formbricks.com/docs/self-hosting/advanced/enterprise-features/contact-management-segments",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: "projects",
|
|
||||||
labelKey: t("environments.settings.enterprise.license_feature_projects"),
|
|
||||||
docsUrl: "https://formbricks.com/docs/self-hosting/advanced/license",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: "whitelabel",
|
|
||||||
labelKey: t("environments.settings.enterprise.license_feature_whitelabel"),
|
|
||||||
docsUrl:
|
|
||||||
"https://formbricks.com/docs/self-hosting/advanced/enterprise-features/whitelabel-email-follow-ups",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: "removeBranding",
|
|
||||||
labelKey: t("environments.settings.enterprise.license_feature_remove_branding"),
|
|
||||||
docsUrl:
|
|
||||||
"https://formbricks.com/docs/self-hosting/advanced/enterprise-features/hide-powered-by-formbricks",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: "twoFactorAuth",
|
|
||||||
labelKey: t("environments.settings.enterprise.license_feature_two_factor_auth"),
|
|
||||||
docsUrl: "https://formbricks.com/docs/xm-and-surveys/core-features/user-management/two-factor-auth",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: "sso",
|
|
||||||
labelKey: t("environments.settings.enterprise.license_feature_sso"),
|
|
||||||
docsUrl: "https://formbricks.com/docs/self-hosting/advanced/enterprise-features/oidc-sso",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: "saml",
|
|
||||||
labelKey: t("environments.settings.enterprise.license_feature_saml"),
|
|
||||||
docsUrl: "https://formbricks.com/docs/self-hosting/advanced/enterprise-features/saml-sso",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: "spamProtection",
|
|
||||||
labelKey: t("environments.settings.enterprise.license_feature_spam_protection"),
|
|
||||||
docsUrl: "https://formbricks.com/docs/xm-and-surveys/surveys/general-features/spam-protection",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: "auditLogs",
|
|
||||||
labelKey: t("environments.settings.enterprise.license_feature_audit_logs"),
|
|
||||||
docsUrl: "https://formbricks.com/docs/self-hosting/advanced/enterprise-features/audit-logging",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: "accessControl",
|
|
||||||
labelKey: t("environments.settings.enterprise.license_feature_access_control"),
|
|
||||||
docsUrl: "https://formbricks.com/docs/self-hosting/advanced/enterprise-features/team-access",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
key: "quotas",
|
|
||||||
labelKey: t("environments.settings.enterprise.license_feature_quotas"),
|
|
||||||
docsUrl: "https://formbricks.com/docs/xm-and-surveys/surveys/general-features/quota-management",
|
|
||||||
},
|
|
||||||
];
|
|
||||||
};
|
|
||||||
|
|
||||||
interface EnterpriseLicenseFeaturesTableProps {
|
|
||||||
features: TEnterpriseLicenseFeatures;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const EnterpriseLicenseFeaturesTable = ({ features }: EnterpriseLicenseFeaturesTableProps) => {
|
|
||||||
const { t } = useTranslation();
|
|
||||||
|
|
||||||
return (
|
|
||||||
<SettingsCard
|
|
||||||
title={t("environments.settings.enterprise.license_features_table_title")}
|
|
||||||
description={t("environments.settings.enterprise.license_features_table_description")}
|
|
||||||
noPadding>
|
|
||||||
<Table>
|
|
||||||
<TableHeader>
|
|
||||||
<TableRow className="hover:bg-white">
|
|
||||||
<TableHead>{t("environments.settings.enterprise.license_features_table_feature")}</TableHead>
|
|
||||||
<TableHead>{t("environments.settings.enterprise.license_features_table_access")}</TableHead>
|
|
||||||
<TableHead>{t("environments.settings.enterprise.license_features_table_value")}</TableHead>
|
|
||||||
<TableHead>{t("common.documentation")}</TableHead>
|
|
||||||
</TableRow>
|
|
||||||
</TableHeader>
|
|
||||||
<TableBody>
|
|
||||||
{getFeatureDefinitions(t).map((feature) => {
|
|
||||||
const value = features[feature.key];
|
|
||||||
const isEnabled = typeof value === "boolean" ? value : value === null || value > 0;
|
|
||||||
let displayValue: number | string = "—";
|
|
||||||
|
|
||||||
if (typeof value === "number") {
|
|
||||||
displayValue = value;
|
|
||||||
} else if (value === null) {
|
|
||||||
displayValue = t("environments.settings.enterprise.license_features_table_unlimited");
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<TableRow key={feature.key} className="hover:bg-white">
|
|
||||||
<TableCell className="font-medium text-slate-900">{t(feature.labelKey)}</TableCell>
|
|
||||||
<TableCell>
|
|
||||||
<Badge
|
|
||||||
type={isEnabled ? "success" : "gray"}
|
|
||||||
size="normal"
|
|
||||||
text={
|
|
||||||
isEnabled
|
|
||||||
? t("environments.settings.enterprise.license_features_table_enabled")
|
|
||||||
: t("environments.settings.enterprise.license_features_table_disabled")
|
|
||||||
}
|
|
||||||
/>
|
|
||||||
</TableCell>
|
|
||||||
<TableCell className="text-slate-600">{displayValue}</TableCell>
|
|
||||||
<TableCell>
|
|
||||||
<Link
|
|
||||||
href={feature.docsUrl}
|
|
||||||
target="_blank"
|
|
||||||
rel="noopener noreferrer"
|
|
||||||
className="text-sm font-medium text-slate-700 underline underline-offset-2 hover:text-slate-900">
|
|
||||||
{t("common.read_docs")}
|
|
||||||
</Link>
|
|
||||||
</TableCell>
|
|
||||||
</TableRow>
|
|
||||||
);
|
|
||||||
})}
|
|
||||||
</TableBody>
|
|
||||||
</Table>
|
|
||||||
</SettingsCard>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
@@ -6,23 +6,22 @@ import { useRouter } from "next/navigation";
|
|||||||
import { useState } from "react";
|
import { useState } from "react";
|
||||||
import toast from "react-hot-toast";
|
import toast from "react-hot-toast";
|
||||||
import { useTranslation } from "react-i18next";
|
import { useTranslation } from "react-i18next";
|
||||||
import { formatDateForDisplay, formatDateTimeForDisplay } from "@/lib/utils/datetime";
|
|
||||||
import { recheckLicenseAction } from "@/modules/ee/license-check/actions";
|
import { recheckLicenseAction } from "@/modules/ee/license-check/actions";
|
||||||
import type { TLicenseStatus } from "@/modules/ee/license-check/types/enterprise-license";
|
|
||||||
import { Alert, AlertDescription } from "@/modules/ui/components/alert";
|
import { Alert, AlertDescription } from "@/modules/ui/components/alert";
|
||||||
import { Badge } from "@/modules/ui/components/badge";
|
import { Badge } from "@/modules/ui/components/badge";
|
||||||
import { Button } from "@/modules/ui/components/button";
|
import { Button } from "@/modules/ui/components/button";
|
||||||
import { SettingsCard } from "../../../components/SettingsCard";
|
import { SettingsCard } from "../../../components/SettingsCard";
|
||||||
|
|
||||||
|
type LicenseStatus = "active" | "expired" | "unreachable" | "invalid_license";
|
||||||
|
|
||||||
interface EnterpriseLicenseStatusProps {
|
interface EnterpriseLicenseStatusProps {
|
||||||
status: TLicenseStatus;
|
status: LicenseStatus;
|
||||||
lastChecked: Date;
|
|
||||||
gracePeriodEnd?: Date;
|
gracePeriodEnd?: Date;
|
||||||
environmentId: string;
|
environmentId: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
const getBadgeConfig = (
|
const getBadgeConfig = (
|
||||||
status: TLicenseStatus,
|
status: LicenseStatus,
|
||||||
t: TFunction
|
t: TFunction
|
||||||
): { type: "success" | "error" | "warning" | "gray"; label: string } => {
|
): { type: "success" | "error" | "warning" | "gray"; label: string } => {
|
||||||
switch (status) {
|
switch (status) {
|
||||||
@@ -30,11 +29,6 @@ const getBadgeConfig = (
|
|||||||
return { type: "success", label: t("environments.settings.enterprise.license_status_active") };
|
return { type: "success", label: t("environments.settings.enterprise.license_status_active") };
|
||||||
case "expired":
|
case "expired":
|
||||||
return { type: "error", label: t("environments.settings.enterprise.license_status_expired") };
|
return { type: "error", label: t("environments.settings.enterprise.license_status_expired") };
|
||||||
case "instance_mismatch":
|
|
||||||
return {
|
|
||||||
type: "error",
|
|
||||||
label: t("environments.settings.enterprise.license_status_instance_mismatch"),
|
|
||||||
};
|
|
||||||
case "unreachable":
|
case "unreachable":
|
||||||
return { type: "warning", label: t("environments.settings.enterprise.license_status_unreachable") };
|
return { type: "warning", label: t("environments.settings.enterprise.license_status_unreachable") };
|
||||||
case "invalid_license":
|
case "invalid_license":
|
||||||
@@ -46,12 +40,10 @@ const getBadgeConfig = (
|
|||||||
|
|
||||||
export const EnterpriseLicenseStatus = ({
|
export const EnterpriseLicenseStatus = ({
|
||||||
status,
|
status,
|
||||||
lastChecked,
|
|
||||||
gracePeriodEnd,
|
gracePeriodEnd,
|
||||||
environmentId,
|
environmentId,
|
||||||
}: EnterpriseLicenseStatusProps) => {
|
}: EnterpriseLicenseStatusProps) => {
|
||||||
const { t, i18n } = useTranslation();
|
const { t } = useTranslation();
|
||||||
const locale = i18n.resolvedLanguage ?? i18n.language ?? "en-US";
|
|
||||||
const router = useRouter();
|
const router = useRouter();
|
||||||
const [isRechecking, setIsRechecking] = useState(false);
|
const [isRechecking, setIsRechecking] = useState(false);
|
||||||
|
|
||||||
@@ -67,8 +59,6 @@ export const EnterpriseLicenseStatus = ({
|
|||||||
if (result?.data) {
|
if (result?.data) {
|
||||||
if (result.data.status === "unreachable") {
|
if (result.data.status === "unreachable") {
|
||||||
toast.error(t("environments.settings.enterprise.recheck_license_unreachable"));
|
toast.error(t("environments.settings.enterprise.recheck_license_unreachable"));
|
||||||
} else if (result.data.status === "instance_mismatch") {
|
|
||||||
toast.error(t("environments.settings.enterprise.recheck_license_instance_mismatch"));
|
|
||||||
} else if (result.data.status === "invalid_license") {
|
} else if (result.data.status === "invalid_license") {
|
||||||
toast.error(t("environments.settings.enterprise.recheck_license_invalid"));
|
toast.error(t("environments.settings.enterprise.recheck_license_invalid"));
|
||||||
} else {
|
} else {
|
||||||
@@ -96,12 +86,7 @@ export const EnterpriseLicenseStatus = ({
|
|||||||
<div className="flex flex-col gap-4">
|
<div className="flex flex-col gap-4">
|
||||||
<div className="flex items-center justify-between gap-3">
|
<div className="flex items-center justify-between gap-3">
|
||||||
<div className="flex flex-col gap-1.5">
|
<div className="flex flex-col gap-1.5">
|
||||||
<div className="flex flex-wrap items-center gap-3">
|
<Badge type={badgeConfig.type} text={badgeConfig.label} size="normal" className="w-fit" />
|
||||||
<Badge type={badgeConfig.type} text={badgeConfig.label} size="normal" className="w-fit" />
|
|
||||||
<span className="text-sm text-slate-500">
|
|
||||||
{t("common.updated_at")} {formatDateTimeForDisplay(new Date(lastChecked), locale)}
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<Button
|
<Button
|
||||||
type="button"
|
type="button"
|
||||||
@@ -127,7 +112,7 @@ export const EnterpriseLicenseStatus = ({
|
|||||||
<Alert variant="warning" size="small">
|
<Alert variant="warning" size="small">
|
||||||
<AlertDescription className="overflow-visible whitespace-normal">
|
<AlertDescription className="overflow-visible whitespace-normal">
|
||||||
{t("environments.settings.enterprise.license_unreachable_grace_period", {
|
{t("environments.settings.enterprise.license_unreachable_grace_period", {
|
||||||
gracePeriodEnd: formatDateForDisplay(new Date(gracePeriodEnd), locale, {
|
gracePeriodEnd: new Date(gracePeriodEnd).toLocaleDateString(undefined, {
|
||||||
year: "numeric",
|
year: "numeric",
|
||||||
month: "short",
|
month: "short",
|
||||||
day: "numeric",
|
day: "numeric",
|
||||||
@@ -143,13 +128,6 @@ export const EnterpriseLicenseStatus = ({
|
|||||||
</AlertDescription>
|
</AlertDescription>
|
||||||
</Alert>
|
</Alert>
|
||||||
)}
|
)}
|
||||||
{status === "instance_mismatch" && (
|
|
||||||
<Alert variant="error" size="small">
|
|
||||||
<AlertDescription className="overflow-visible whitespace-normal">
|
|
||||||
{t("environments.settings.enterprise.license_instance_mismatch_description")}
|
|
||||||
</AlertDescription>
|
|
||||||
</Alert>
|
|
||||||
)}
|
|
||||||
<p className="border-t border-slate-100 pt-4 text-sm text-slate-500">
|
<p className="border-t border-slate-100 pt-4 text-sm text-slate-500">
|
||||||
{t("environments.settings.enterprise.questions_please_reach_out_to")}{" "}
|
{t("environments.settings.enterprise.questions_please_reach_out_to")}{" "}
|
||||||
<a
|
<a
|
||||||
|
|||||||
@@ -1,3 +1,5 @@
|
|||||||
|
import { OrganizationSettingsNavbar } from "@/app/(app)/environments/[environmentId]/settings/(organization)/components/OrganizationSettingsNavbar";
|
||||||
|
import { IS_FORMBRICKS_CLOUD } from "@/lib/constants";
|
||||||
import { getTranslate } from "@/lingodotdev/server";
|
import { getTranslate } from "@/lingodotdev/server";
|
||||||
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
||||||
import { PageHeader } from "@/modules/ui/components/page-header";
|
import { PageHeader } from "@/modules/ui/components/page-header";
|
||||||
@@ -6,7 +8,9 @@ const Loading = async () => {
|
|||||||
const t = await getTranslate();
|
const t = await getTranslate();
|
||||||
return (
|
return (
|
||||||
<PageContentWrapper>
|
<PageContentWrapper>
|
||||||
<PageHeader pageTitle={t("environments.settings.general.organization_settings")} />
|
<PageHeader pageTitle={t("environments.settings.general.organization_settings")}>
|
||||||
|
<OrganizationSettingsNavbar isFormbricksCloud={IS_FORMBRICKS_CLOUD} activeId="enterprise" loading />
|
||||||
|
</PageHeader>
|
||||||
<div className="my-8 h-64 animate-pulse rounded-xl bg-slate-200"></div>
|
<div className="my-8 h-64 animate-pulse rounded-xl bg-slate-200"></div>
|
||||||
<div className="my-8 h-96 animate-pulse rounded-md bg-slate-200"></div>
|
<div className="my-8 h-96 animate-pulse rounded-md bg-slate-200"></div>
|
||||||
</PageContentWrapper>
|
</PageContentWrapper>
|
||||||
|
|||||||
@@ -1,8 +1,189 @@
|
|||||||
import { redirect } from "next/navigation";
|
import { CheckIcon } from "lucide-react";
|
||||||
|
import Link from "next/link";
|
||||||
|
import { notFound } from "next/navigation";
|
||||||
|
import { OrganizationSettingsNavbar } from "@/app/(app)/environments/[environmentId]/settings/(organization)/components/OrganizationSettingsNavbar";
|
||||||
|
import { EnterpriseLicenseStatus } from "@/app/(app)/environments/[environmentId]/settings/(organization)/enterprise/components/EnterpriseLicenseStatus";
|
||||||
|
import { IS_FORMBRICKS_CLOUD } from "@/lib/constants";
|
||||||
|
import { getTranslate } from "@/lingodotdev/server";
|
||||||
|
import { GRACE_PERIOD_MS, getEnterpriseLicense } from "@/modules/ee/license-check/lib/license";
|
||||||
|
import { getEnvironmentAuth } from "@/modules/environments/lib/utils";
|
||||||
|
import { Button } from "@/modules/ui/components/button";
|
||||||
|
import { PageContentWrapper } from "@/modules/ui/components/page-content-wrapper";
|
||||||
|
import { PageHeader } from "@/modules/ui/components/page-header";
|
||||||
|
|
||||||
const Page = async (props: { params: Promise<{ environmentId: string }> }) => {
|
const Page = async (props) => {
|
||||||
const params = await props.params;
|
const params = await props.params;
|
||||||
return redirect(`/environments/${params.environmentId}/settings/organization/enterprise`);
|
const t = await getTranslate();
|
||||||
|
if (IS_FORMBRICKS_CLOUD) {
|
||||||
|
return notFound();
|
||||||
|
}
|
||||||
|
|
||||||
|
const { isMember, currentUserMembership } = await getEnvironmentAuth(params.environmentId);
|
||||||
|
|
||||||
|
const isPricingDisabled = isMember;
|
||||||
|
|
||||||
|
if (isPricingDisabled) {
|
||||||
|
return notFound();
|
||||||
|
}
|
||||||
|
|
||||||
|
const licenseState = await getEnterpriseLicense();
|
||||||
|
const hasLicense = licenseState.status !== "no-license";
|
||||||
|
|
||||||
|
const paidFeatures = [
|
||||||
|
{
|
||||||
|
title: t("environments.settings.billing.remove_branding"),
|
||||||
|
comingSoon: false,
|
||||||
|
onRequest: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: t("environments.settings.enterprise.sso"),
|
||||||
|
comingSoon: false,
|
||||||
|
onRequest: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: t("environments.workspace.languages.multi_language_surveys"),
|
||||||
|
comingSoon: false,
|
||||||
|
onRequest: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: t("environments.settings.enterprise.organization_roles"),
|
||||||
|
comingSoon: false,
|
||||||
|
onRequest: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: t("environments.settings.enterprise.teams"),
|
||||||
|
comingSoon: false,
|
||||||
|
onRequest: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: t("environments.settings.enterprise.contacts_and_segments"),
|
||||||
|
comingSoon: false,
|
||||||
|
onRequest: false,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: t("environments.settings.enterprise.audit_logs"),
|
||||||
|
comingSoon: false,
|
||||||
|
onRequest: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: t("environments.settings.enterprise.saml_sso"),
|
||||||
|
comingSoon: false,
|
||||||
|
onRequest: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: t("environments.settings.enterprise.service_level_agreement"),
|
||||||
|
comingSoon: false,
|
||||||
|
onRequest: true,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: t("environments.settings.enterprise.soc2_hipaa_iso_27001_compliance_check"),
|
||||||
|
comingSoon: false,
|
||||||
|
onRequest: true,
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
return (
|
||||||
|
<PageContentWrapper>
|
||||||
|
<PageHeader pageTitle={t("environments.settings.general.organization_settings")}>
|
||||||
|
<OrganizationSettingsNavbar
|
||||||
|
environmentId={params.environmentId}
|
||||||
|
isFormbricksCloud={IS_FORMBRICKS_CLOUD}
|
||||||
|
membershipRole={currentUserMembership?.role}
|
||||||
|
activeId="enterprise"
|
||||||
|
/>
|
||||||
|
</PageHeader>
|
||||||
|
{hasLicense ? (
|
||||||
|
<EnterpriseLicenseStatus
|
||||||
|
status={licenseState.status as "active" | "expired" | "unreachable" | "invalid_license"}
|
||||||
|
gracePeriodEnd={
|
||||||
|
licenseState.status === "unreachable"
|
||||||
|
? new Date(licenseState.lastChecked.getTime() + GRACE_PERIOD_MS)
|
||||||
|
: undefined
|
||||||
|
}
|
||||||
|
environmentId={params.environmentId}
|
||||||
|
/>
|
||||||
|
) : (
|
||||||
|
<div>
|
||||||
|
<div className="relative isolate mt-8 overflow-hidden rounded-lg bg-slate-900 px-3 pt-8 shadow-2xl sm:px-8 md:pt-12 lg:flex lg:gap-x-10 lg:px-12 lg:pt-0">
|
||||||
|
<svg
|
||||||
|
viewBox="0 0 1024 1024"
|
||||||
|
className="absolute left-1/2 top-1/2 -z-10 h-[64rem] w-[64rem] -translate-y-1/2 [mask-image:radial-gradient(closest-side,white,transparent)] sm:left-full sm:-ml-80 lg:left-1/2 lg:ml-0 lg:-translate-x-1/2 lg:translate-y-0"
|
||||||
|
aria-hidden="true">
|
||||||
|
<circle
|
||||||
|
cx={512}
|
||||||
|
cy={512}
|
||||||
|
r={512}
|
||||||
|
fill="url(#759c1415-0410-454c-8f7c-9a820de03641)"
|
||||||
|
fillOpacity="0.7"
|
||||||
|
/>
|
||||||
|
<defs>
|
||||||
|
<radialGradient id="759c1415-0410-454c-8f7c-9a820de03641">
|
||||||
|
<stop stopColor="#00E6CA" />
|
||||||
|
<stop offset={0} stopColor="#00C4B8" />
|
||||||
|
</radialGradient>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
<div className="mx-auto text-center lg:mx-0 lg:flex-auto lg:py-16 lg:text-left">
|
||||||
|
<h2 className="text-2xl font-bold text-white sm:text-3xl">
|
||||||
|
{t("environments.settings.enterprise.unlock_the_full_power_of_formbricks_free_for_30_days")}
|
||||||
|
</h2>
|
||||||
|
<p className="text-md mt-6 leading-8 text-slate-300">
|
||||||
|
{t("environments.settings.enterprise.keep_full_control_over_your_data_privacy_and_security")}
|
||||||
|
<br />
|
||||||
|
{t(
|
||||||
|
"environments.settings.enterprise.get_an_enterprise_license_to_get_access_to_all_features"
|
||||||
|
)}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="mt-8 rounded-lg border border-slate-300 bg-slate-100 shadow-sm">
|
||||||
|
<div className="p-8">
|
||||||
|
<h2 className="mr-2 inline-flex text-2xl font-bold text-slate-700">
|
||||||
|
{t("environments.settings.enterprise.enterprise_features")}
|
||||||
|
</h2>
|
||||||
|
<ul className="my-4 space-y-4">
|
||||||
|
{paidFeatures.map((feature) => (
|
||||||
|
<li key={feature.title} className="flex items-center">
|
||||||
|
<div className="rounded-full border border-green-300 bg-green-100 p-0.5 dark:bg-green-800">
|
||||||
|
<CheckIcon className="h-5 w-5 p-0.5 text-green-500 dark:text-green-400" />
|
||||||
|
</div>
|
||||||
|
<span className="ml-2 text-sm text-slate-500 dark:text-slate-400">{feature.title}</span>
|
||||||
|
{feature.comingSoon && (
|
||||||
|
<span className="mx-2 rounded-full bg-blue-100 px-3 py-1 text-xs text-blue-700 dark:bg-slate-700 dark:text-teal-500">
|
||||||
|
{t("environments.settings.enterprise.coming_soon")}
|
||||||
|
</span>
|
||||||
|
)}
|
||||||
|
{feature.onRequest && (
|
||||||
|
<span className="mx-2 rounded-full bg-violet-100 px-3 py-1 text-xs text-violet-700 dark:bg-slate-700 dark:text-teal-500">
|
||||||
|
{t("environments.settings.enterprise.on_request")}
|
||||||
|
</span>
|
||||||
|
)}
|
||||||
|
</li>
|
||||||
|
))}
|
||||||
|
</ul>
|
||||||
|
<p className="my-6 text-sm text-slate-700">
|
||||||
|
{t(
|
||||||
|
"environments.settings.enterprise.no_call_needed_no_strings_attached_request_a_free_30_day_trial_license_to_test_all_features_by_filling_out_this_form"
|
||||||
|
)}
|
||||||
|
</p>
|
||||||
|
<Button asChild>
|
||||||
|
<Link
|
||||||
|
href="https://app.formbricks.com/s/clvupq3y205i5yrm3sm9v1xt5"
|
||||||
|
target="_blank"
|
||||||
|
rel="noopener noreferrer nofollow"
|
||||||
|
referrerPolicy="no-referrer">
|
||||||
|
{t("environments.settings.enterprise.request_30_day_trial_license")}
|
||||||
|
</Link>
|
||||||
|
</Button>
|
||||||
|
<p className="mt-2 text-xs text-slate-500">
|
||||||
|
{t("environments.settings.enterprise.no_credit_card_no_sales_call_just_test_it")}
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</PageContentWrapper>
|
||||||
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
export default Page;
|
export default Page;
|
||||||
|
|||||||
@@ -1,218 +0,0 @@
|
|||||||
import { beforeEach, describe, expect, test, vi } from "vitest";
|
|
||||||
import { AuthorizationError, OperationNotAllowedError } from "@formbricks/types/errors";
|
|
||||||
import { updateOrganizationAISettingsAction } from "./actions";
|
|
||||||
import { ZOrganizationAISettingsInput } from "./schemas";
|
|
||||||
|
|
||||||
const mocks = vi.hoisted(() => ({
|
|
||||||
isInstanceAIConfigured: vi.fn(),
|
|
||||||
checkAuthorizationUpdated: vi.fn(),
|
|
||||||
deleteOrganization: vi.fn(),
|
|
||||||
getOrganization: vi.fn(),
|
|
||||||
getIsMultiOrgEnabled: vi.fn(),
|
|
||||||
getTranslate: vi.fn(),
|
|
||||||
updateOrganization: vi.fn(),
|
|
||||||
}));
|
|
||||||
|
|
||||||
vi.mock("@/lib/utils/action-client", () => ({
|
|
||||||
authenticatedActionClient: {
|
|
||||||
inputSchema: vi.fn(() => ({
|
|
||||||
action: vi.fn((fn) => fn),
|
|
||||||
})),
|
|
||||||
},
|
|
||||||
}));
|
|
||||||
|
|
||||||
vi.mock("@/lib/utils/action-client/action-client-middleware", () => ({
|
|
||||||
checkAuthorizationUpdated: mocks.checkAuthorizationUpdated,
|
|
||||||
}));
|
|
||||||
|
|
||||||
vi.mock("@/lib/organization/service", () => ({
|
|
||||||
deleteOrganization: mocks.deleteOrganization,
|
|
||||||
getOrganization: mocks.getOrganization,
|
|
||||||
updateOrganization: mocks.updateOrganization,
|
|
||||||
}));
|
|
||||||
|
|
||||||
vi.mock("@/lib/ai/service", () => ({
|
|
||||||
isInstanceAIConfigured: mocks.isInstanceAIConfigured,
|
|
||||||
}));
|
|
||||||
|
|
||||||
vi.mock("@/lingodotdev/server", () => ({
|
|
||||||
getTranslate: mocks.getTranslate,
|
|
||||||
}));
|
|
||||||
|
|
||||||
vi.mock("@/modules/ee/audit-logs/lib/handler", () => ({
|
|
||||||
withAuditLogging: vi.fn((_eventName, _objectType, fn) => fn),
|
|
||||||
}));
|
|
||||||
|
|
||||||
vi.mock("@/modules/ee/license-check/lib/utils", () => ({
|
|
||||||
getIsMultiOrgEnabled: mocks.getIsMultiOrgEnabled,
|
|
||||||
}));
|
|
||||||
|
|
||||||
const organizationId = "cm9gptbhg0000192zceq9ayuc";
|
|
||||||
|
|
||||||
describe("organization AI settings actions", () => {
|
|
||||||
beforeEach(() => {
|
|
||||||
vi.clearAllMocks();
|
|
||||||
|
|
||||||
mocks.checkAuthorizationUpdated.mockResolvedValue(undefined);
|
|
||||||
mocks.getOrganization.mockResolvedValue({
|
|
||||||
id: organizationId,
|
|
||||||
isAISmartToolsEnabled: false,
|
|
||||||
isAIDataAnalysisEnabled: false,
|
|
||||||
});
|
|
||||||
mocks.isInstanceAIConfigured.mockReturnValue(true);
|
|
||||||
mocks.getTranslate.mockResolvedValue((key: string, values?: Record<string, string>) =>
|
|
||||||
values ? `${key}:${JSON.stringify(values)}` : key
|
|
||||||
);
|
|
||||||
mocks.updateOrganization.mockResolvedValue({
|
|
||||||
id: organizationId,
|
|
||||||
isAISmartToolsEnabled: true,
|
|
||||||
isAIDataAnalysisEnabled: false,
|
|
||||||
});
|
|
||||||
mocks.getIsMultiOrgEnabled.mockResolvedValue(true);
|
|
||||||
});
|
|
||||||
|
|
||||||
test("accepts AI toggle updates", () => {
|
|
||||||
expect(
|
|
||||||
ZOrganizationAISettingsInput.parse({
|
|
||||||
isAISmartToolsEnabled: true,
|
|
||||||
})
|
|
||||||
).toEqual({
|
|
||||||
isAISmartToolsEnabled: true,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
test("passes owner and manager roles to the authorization check and updates organization settings", async () => {
|
|
||||||
const ctx = {
|
|
||||||
user: { id: "user_1", locale: "en-US" },
|
|
||||||
auditLoggingCtx: {},
|
|
||||||
};
|
|
||||||
const parsedInput = {
|
|
||||||
organizationId,
|
|
||||||
data: {
|
|
||||||
isAISmartToolsEnabled: true,
|
|
||||||
},
|
|
||||||
};
|
|
||||||
|
|
||||||
const result = await updateOrganizationAISettingsAction({ ctx, parsedInput } as any);
|
|
||||||
|
|
||||||
expect(mocks.checkAuthorizationUpdated).toHaveBeenCalledWith({
|
|
||||||
userId: "user_1",
|
|
||||||
organizationId,
|
|
||||||
access: [
|
|
||||||
{
|
|
||||||
type: "organization",
|
|
||||||
schema: ZOrganizationAISettingsInput,
|
|
||||||
data: parsedInput.data,
|
|
||||||
roles: ["owner", "manager"],
|
|
||||||
},
|
|
||||||
],
|
|
||||||
});
|
|
||||||
expect(mocks.getOrganization).toHaveBeenCalledWith(organizationId);
|
|
||||||
expect(mocks.updateOrganization).toHaveBeenCalledWith(organizationId, parsedInput.data);
|
|
||||||
expect(ctx.auditLoggingCtx).toMatchObject({
|
|
||||||
organizationId,
|
|
||||||
oldObject: {
|
|
||||||
id: organizationId,
|
|
||||||
isAISmartToolsEnabled: false,
|
|
||||||
isAIDataAnalysisEnabled: false,
|
|
||||||
},
|
|
||||||
newObject: {
|
|
||||||
id: organizationId,
|
|
||||||
isAISmartToolsEnabled: true,
|
|
||||||
isAIDataAnalysisEnabled: false,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
expect(result).toEqual({
|
|
||||||
id: organizationId,
|
|
||||||
isAISmartToolsEnabled: true,
|
|
||||||
isAIDataAnalysisEnabled: false,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
test("propagates authorization failures so members cannot update AI settings", async () => {
|
|
||||||
mocks.checkAuthorizationUpdated.mockRejectedValueOnce(new AuthorizationError("Not authorized"));
|
|
||||||
|
|
||||||
await expect(
|
|
||||||
updateOrganizationAISettingsAction({
|
|
||||||
ctx: {
|
|
||||||
user: { id: "user_member", locale: "en-US" },
|
|
||||||
auditLoggingCtx: {},
|
|
||||||
},
|
|
||||||
parsedInput: {
|
|
||||||
organizationId,
|
|
||||||
data: {
|
|
||||||
isAISmartToolsEnabled: true,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
} as any)
|
|
||||||
).rejects.toThrow(AuthorizationError);
|
|
||||||
|
|
||||||
expect(mocks.updateOrganization).not.toHaveBeenCalled();
|
|
||||||
});
|
|
||||||
|
|
||||||
test("rejects enabling AI when the instance AI provider is not configured", async () => {
|
|
||||||
mocks.isInstanceAIConfigured.mockReturnValueOnce(false);
|
|
||||||
|
|
||||||
await expect(
|
|
||||||
updateOrganizationAISettingsAction({
|
|
||||||
ctx: {
|
|
||||||
user: { id: "user_owner", locale: "en-US" },
|
|
||||||
auditLoggingCtx: {},
|
|
||||||
},
|
|
||||||
parsedInput: {
|
|
||||||
organizationId,
|
|
||||||
data: {
|
|
||||||
isAISmartToolsEnabled: true,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
} as any)
|
|
||||||
).rejects.toThrow(OperationNotAllowedError);
|
|
||||||
|
|
||||||
expect(mocks.updateOrganization).not.toHaveBeenCalled();
|
|
||||||
});
|
|
||||||
|
|
||||||
test("allows enabling AI when the instance configuration is valid", async () => {
|
|
||||||
await updateOrganizationAISettingsAction({
|
|
||||||
ctx: {
|
|
||||||
user: { id: "user_owner", locale: "en-US" },
|
|
||||||
auditLoggingCtx: {},
|
|
||||||
},
|
|
||||||
parsedInput: {
|
|
||||||
organizationId,
|
|
||||||
data: {
|
|
||||||
isAISmartToolsEnabled: true,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
} as any);
|
|
||||||
|
|
||||||
expect(mocks.updateOrganization).toHaveBeenCalledWith(organizationId, {
|
|
||||||
isAISmartToolsEnabled: true,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
test("allows disabling AI when the instance configuration later becomes invalid", async () => {
|
|
||||||
mocks.getOrganization.mockResolvedValueOnce({
|
|
||||||
id: organizationId,
|
|
||||||
isAISmartToolsEnabled: true,
|
|
||||||
isAIDataAnalysisEnabled: false,
|
|
||||||
});
|
|
||||||
mocks.isInstanceAIConfigured.mockReturnValueOnce(false);
|
|
||||||
|
|
||||||
await updateOrganizationAISettingsAction({
|
|
||||||
ctx: {
|
|
||||||
user: { id: "user_owner", locale: "en-US" },
|
|
||||||
auditLoggingCtx: {},
|
|
||||||
},
|
|
||||||
parsedInput: {
|
|
||||||
organizationId,
|
|
||||||
data: {
|
|
||||||
isAISmartToolsEnabled: false,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
} as any);
|
|
||||||
|
|
||||||
expect(mocks.updateOrganization).toHaveBeenCalledWith(organizationId, {
|
|
||||||
isAISmartToolsEnabled: false,
|
|
||||||
});
|
|
||||||
});
|
|
||||||
});
|
|
||||||
@@ -2,44 +2,14 @@
|
|||||||
|
|
||||||
import { z } from "zod";
|
import { z } from "zod";
|
||||||
import { ZId } from "@formbricks/types/common";
|
import { ZId } from "@formbricks/types/common";
|
||||||
import { OperationNotAllowedError, ResourceNotFoundError } from "@formbricks/types/errors";
|
import { OperationNotAllowedError } from "@formbricks/types/errors";
|
||||||
import type { TOrganizationRole } from "@formbricks/types/memberships";
|
|
||||||
import { ZOrganizationUpdateInput } from "@formbricks/types/organizations";
|
import { ZOrganizationUpdateInput } from "@formbricks/types/organizations";
|
||||||
import { isInstanceAIConfigured } from "@/lib/ai/service";
|
|
||||||
import { deleteOrganization, getOrganization, updateOrganization } from "@/lib/organization/service";
|
import { deleteOrganization, getOrganization, updateOrganization } from "@/lib/organization/service";
|
||||||
import { authenticatedActionClient } from "@/lib/utils/action-client";
|
import { authenticatedActionClient } from "@/lib/utils/action-client";
|
||||||
import { checkAuthorizationUpdated } from "@/lib/utils/action-client/action-client-middleware";
|
import { checkAuthorizationUpdated } from "@/lib/utils/action-client/action-client-middleware";
|
||||||
import { AuthenticatedActionClientCtx } from "@/lib/utils/action-client/types/context";
|
import { AuthenticatedActionClientCtx } from "@/lib/utils/action-client/types/context";
|
||||||
import { getTranslate } from "@/lingodotdev/server";
|
|
||||||
import { withAuditLogging } from "@/modules/ee/audit-logs/lib/handler";
|
import { withAuditLogging } from "@/modules/ee/audit-logs/lib/handler";
|
||||||
import { getIsMultiOrgEnabled } from "@/modules/ee/license-check/lib/utils";
|
import { getIsMultiOrgEnabled } from "@/modules/ee/license-check/lib/utils";
|
||||||
import { ZOrganizationAISettingsInput, ZUpdateOrganizationAISettingsAction } from "./schemas";
|
|
||||||
|
|
||||||
async function updateOrganizationAction<T extends z.ZodRawShape>({
|
|
||||||
ctx,
|
|
||||||
organizationId,
|
|
||||||
schema,
|
|
||||||
data,
|
|
||||||
roles,
|
|
||||||
}: {
|
|
||||||
ctx: AuthenticatedActionClientCtx;
|
|
||||||
organizationId: string;
|
|
||||||
schema: z.ZodObject<T>;
|
|
||||||
data: z.infer<z.ZodObject<T>>;
|
|
||||||
roles: TOrganizationRole[];
|
|
||||||
}) {
|
|
||||||
await checkAuthorizationUpdated({
|
|
||||||
userId: ctx.user.id,
|
|
||||||
organizationId,
|
|
||||||
access: [{ type: "organization", schema, data, roles }],
|
|
||||||
});
|
|
||||||
ctx.auditLoggingCtx.organizationId = organizationId;
|
|
||||||
const oldObject = await getOrganization(organizationId);
|
|
||||||
const result = await updateOrganization(organizationId, data);
|
|
||||||
ctx.auditLoggingCtx.oldObject = oldObject;
|
|
||||||
ctx.auditLoggingCtx.newObject = result;
|
|
||||||
return result;
|
|
||||||
}
|
|
||||||
|
|
||||||
const ZUpdateOrganizationNameAction = z.object({
|
const ZUpdateOrganizationNameAction = z.object({
|
||||||
organizationId: ZId,
|
organizationId: ZId,
|
||||||
@@ -47,7 +17,7 @@ const ZUpdateOrganizationNameAction = z.object({
|
|||||||
});
|
});
|
||||||
|
|
||||||
export const updateOrganizationNameAction = authenticatedActionClient
|
export const updateOrganizationNameAction = authenticatedActionClient
|
||||||
.inputSchema(ZUpdateOrganizationNameAction)
|
.schema(ZUpdateOrganizationNameAction)
|
||||||
.action(
|
.action(
|
||||||
withAuditLogging(
|
withAuditLogging(
|
||||||
"updated",
|
"updated",
|
||||||
@@ -57,104 +27,26 @@ export const updateOrganizationNameAction = authenticatedActionClient
|
|||||||
parsedInput,
|
parsedInput,
|
||||||
}: {
|
}: {
|
||||||
ctx: AuthenticatedActionClientCtx;
|
ctx: AuthenticatedActionClientCtx;
|
||||||
parsedInput: z.infer<typeof ZUpdateOrganizationNameAction>;
|
parsedInput: Record<string, any>;
|
||||||
}) =>
|
|
||||||
updateOrganizationAction({
|
|
||||||
ctx,
|
|
||||||
organizationId: parsedInput.organizationId,
|
|
||||||
schema: ZOrganizationUpdateInput.pick({ name: true }),
|
|
||||||
data: parsedInput.data,
|
|
||||||
roles: ["owner"],
|
|
||||||
})
|
|
||||||
)
|
|
||||||
);
|
|
||||||
|
|
||||||
type TOrganizationAISettings = Pick<
|
|
||||||
NonNullable<Awaited<ReturnType<typeof getOrganization>>>,
|
|
||||||
"isAISmartToolsEnabled" | "isAIDataAnalysisEnabled"
|
|
||||||
>;
|
|
||||||
|
|
||||||
type TResolvedOrganizationAISettings = {
|
|
||||||
smartToolsEnabled: boolean;
|
|
||||||
dataAnalysisEnabled: boolean;
|
|
||||||
isEnablingAnyAISetting: boolean;
|
|
||||||
};
|
|
||||||
|
|
||||||
const resolveOrganizationAISettings = ({
|
|
||||||
data,
|
|
||||||
organization,
|
|
||||||
}: {
|
|
||||||
data: z.infer<typeof ZOrganizationAISettingsInput>;
|
|
||||||
organization: TOrganizationAISettings;
|
|
||||||
}): TResolvedOrganizationAISettings => {
|
|
||||||
const smartToolsEnabled = Object.hasOwn(data, "isAISmartToolsEnabled")
|
|
||||||
? (data.isAISmartToolsEnabled ?? organization.isAISmartToolsEnabled)
|
|
||||||
: organization.isAISmartToolsEnabled;
|
|
||||||
const dataAnalysisEnabled = Object.hasOwn(data, "isAIDataAnalysisEnabled")
|
|
||||||
? (data.isAIDataAnalysisEnabled ?? organization.isAIDataAnalysisEnabled)
|
|
||||||
: organization.isAIDataAnalysisEnabled;
|
|
||||||
|
|
||||||
return {
|
|
||||||
smartToolsEnabled,
|
|
||||||
dataAnalysisEnabled,
|
|
||||||
isEnablingAnyAISetting:
|
|
||||||
(smartToolsEnabled && !organization.isAISmartToolsEnabled) ||
|
|
||||||
(dataAnalysisEnabled && !organization.isAIDataAnalysisEnabled),
|
|
||||||
};
|
|
||||||
};
|
|
||||||
|
|
||||||
const assertOrganizationAISettingsUpdateAllowed = ({
|
|
||||||
isInstanceAIConfigured,
|
|
||||||
resolvedSettings,
|
|
||||||
t,
|
|
||||||
}: {
|
|
||||||
isInstanceAIConfigured: boolean;
|
|
||||||
resolvedSettings: TResolvedOrganizationAISettings;
|
|
||||||
t: Awaited<ReturnType<typeof getTranslate>>;
|
|
||||||
}) => {
|
|
||||||
if (resolvedSettings.isEnablingAnyAISetting && !isInstanceAIConfigured) {
|
|
||||||
throw new OperationNotAllowedError(t("environments.settings.general.ai_instance_not_configured"));
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
export const updateOrganizationAISettingsAction = authenticatedActionClient
|
|
||||||
.inputSchema(ZUpdateOrganizationAISettingsAction)
|
|
||||||
.action(
|
|
||||||
withAuditLogging(
|
|
||||||
"updated",
|
|
||||||
"organization",
|
|
||||||
async ({
|
|
||||||
ctx,
|
|
||||||
parsedInput,
|
|
||||||
}: {
|
|
||||||
ctx: AuthenticatedActionClientCtx;
|
|
||||||
parsedInput: z.infer<typeof ZUpdateOrganizationAISettingsAction>;
|
|
||||||
}) => {
|
}) => {
|
||||||
const t = await getTranslate(ctx.user.locale);
|
await checkAuthorizationUpdated({
|
||||||
const organization = await getOrganization(parsedInput.organizationId);
|
userId: ctx.user.id,
|
||||||
|
|
||||||
if (!organization) {
|
|
||||||
throw new ResourceNotFoundError("Organization", parsedInput.organizationId);
|
|
||||||
}
|
|
||||||
|
|
||||||
const resolvedSettings = resolveOrganizationAISettings({
|
|
||||||
data: parsedInput.data,
|
|
||||||
organization,
|
|
||||||
});
|
|
||||||
|
|
||||||
assertOrganizationAISettingsUpdateAllowed({
|
|
||||||
isInstanceAIConfigured: isInstanceAIConfigured(),
|
|
||||||
resolvedSettings,
|
|
||||||
t,
|
|
||||||
});
|
|
||||||
|
|
||||||
return updateOrganizationAction({
|
|
||||||
ctx,
|
|
||||||
organizationId: parsedInput.organizationId,
|
organizationId: parsedInput.organizationId,
|
||||||
schema: ZOrganizationAISettingsInput,
|
access: [
|
||||||
data: parsedInput.data,
|
{
|
||||||
roles: ["owner", "manager"],
|
type: "organization",
|
||||||
|
schema: ZOrganizationUpdateInput.pick({ name: true }),
|
||||||
|
data: parsedInput.data,
|
||||||
|
roles: ["owner"],
|
||||||
|
},
|
||||||
|
],
|
||||||
});
|
});
|
||||||
|
ctx.auditLoggingCtx.organizationId = parsedInput.organizationId;
|
||||||
|
const oldObject = await getOrganization(parsedInput.organizationId);
|
||||||
|
const result = await updateOrganization(parsedInput.organizationId, parsedInput.data);
|
||||||
|
ctx.auditLoggingCtx.oldObject = oldObject;
|
||||||
|
ctx.auditLoggingCtx.newObject = result;
|
||||||
|
return result;
|
||||||
}
|
}
|
||||||
)
|
)
|
||||||
);
|
);
|
||||||
@@ -163,15 +55,13 @@ const ZDeleteOrganizationAction = z.object({
|
|||||||
organizationId: ZId,
|
organizationId: ZId,
|
||||||
});
|
});
|
||||||
|
|
||||||
export const deleteOrganizationAction = authenticatedActionClient
|
export const deleteOrganizationAction = authenticatedActionClient.schema(ZDeleteOrganizationAction).action(
|
||||||
.inputSchema(ZDeleteOrganizationAction)
|
withAuditLogging(
|
||||||
.action(
|
"deleted",
|
||||||
withAuditLogging("deleted", "organization", async ({ ctx, parsedInput }) => {
|
"organization",
|
||||||
|
async ({ ctx, parsedInput }: { ctx: AuthenticatedActionClientCtx; parsedInput: Record<string, any> }) => {
|
||||||
const isMultiOrgEnabled = await getIsMultiOrgEnabled();
|
const isMultiOrgEnabled = await getIsMultiOrgEnabled();
|
||||||
if (!isMultiOrgEnabled) {
|
if (!isMultiOrgEnabled) throw new OperationNotAllowedError("Organization deletion disabled");
|
||||||
const t = await getTranslate(ctx.user.locale);
|
|
||||||
throw new OperationNotAllowedError(t("environments.settings.general.organization_deletion_disabled"));
|
|
||||||
}
|
|
||||||
|
|
||||||
await checkAuthorizationUpdated({
|
await checkAuthorizationUpdated({
|
||||||
userId: ctx.user.id,
|
userId: ctx.user.id,
|
||||||
@@ -187,5 +77,6 @@ export const deleteOrganizationAction = authenticatedActionClient
|
|||||||
const oldObject = await getOrganization(parsedInput.organizationId);
|
const oldObject = await getOrganization(parsedInput.organizationId);
|
||||||
ctx.auditLoggingCtx.oldObject = oldObject;
|
ctx.auditLoggingCtx.oldObject = oldObject;
|
||||||
return await deleteOrganization(parsedInput.organizationId);
|
return await deleteOrganization(parsedInput.organizationId);
|
||||||
})
|
}
|
||||||
);
|
)
|
||||||
|
);
|
||||||
|
|||||||
@@ -1,118 +0,0 @@
|
|||||||
"use client";
|
|
||||||
|
|
||||||
import { useRouter } from "next/navigation";
|
|
||||||
import { useState } from "react";
|
|
||||||
import toast from "react-hot-toast";
|
|
||||||
import { useTranslation } from "react-i18next";
|
|
||||||
import { TOrganizationRole } from "@formbricks/types/memberships";
|
|
||||||
import { TOrganization } from "@formbricks/types/organizations";
|
|
||||||
import { updateOrganizationAISettingsAction } from "@/app/(app)/environments/[environmentId]/settings/(organization)/general/actions";
|
|
||||||
import { getDisplayedOrganizationAISettingValue, getOrganizationAIEnablementState } from "@/lib/ai/utils";
|
|
||||||
import { getAccessFlags } from "@/lib/membership/utils";
|
|
||||||
import { getFormattedErrorMessage } from "@/lib/utils/helper";
|
|
||||||
import { AdvancedOptionToggle } from "@/modules/ui/components/advanced-option-toggle";
|
|
||||||
import { Alert, AlertDescription } from "@/modules/ui/components/alert";
|
|
||||||
|
|
||||||
interface AISettingsToggleProps {
|
|
||||||
organization: TOrganization;
|
|
||||||
membershipRole?: TOrganizationRole;
|
|
||||||
isInstanceAIConfigured: boolean;
|
|
||||||
}
|
|
||||||
|
|
||||||
export const AISettingsToggle = ({
|
|
||||||
organization,
|
|
||||||
membershipRole,
|
|
||||||
isInstanceAIConfigured,
|
|
||||||
}: Readonly<AISettingsToggleProps>) => {
|
|
||||||
const [loadingField, setLoadingField] = useState<string | null>(null);
|
|
||||||
const { t } = useTranslation();
|
|
||||||
const router = useRouter();
|
|
||||||
|
|
||||||
const { isOwner, isManager } = getAccessFlags(membershipRole);
|
|
||||||
const canEdit = isOwner || isManager;
|
|
||||||
const aiEnablementState = getOrganizationAIEnablementState({
|
|
||||||
isInstanceConfigured: isInstanceAIConfigured,
|
|
||||||
});
|
|
||||||
const showInstanceConfigWarning = aiEnablementState.blockReason === "instanceNotConfigured";
|
|
||||||
const isToggleDisabled = loadingField !== null || !canEdit || !aiEnablementState.canEnableFeatures;
|
|
||||||
const aiEnablementBlockedMessage = t("environments.settings.general.ai_instance_not_configured");
|
|
||||||
const displayedSmartToolsValue = getDisplayedOrganizationAISettingValue({
|
|
||||||
currentValue: organization.isAISmartToolsEnabled,
|
|
||||||
isInstanceConfigured: isInstanceAIConfigured,
|
|
||||||
});
|
|
||||||
const displayedDataAnalysisValue = getDisplayedOrganizationAISettingValue({
|
|
||||||
currentValue: organization.isAIDataAnalysisEnabled,
|
|
||||||
isInstanceConfigured: isInstanceAIConfigured,
|
|
||||||
});
|
|
||||||
|
|
||||||
const handleToggle = async (
|
|
||||||
field: "isAISmartToolsEnabled" | "isAIDataAnalysisEnabled",
|
|
||||||
checked: boolean
|
|
||||||
) => {
|
|
||||||
if (checked && !aiEnablementState.canEnableFeatures) {
|
|
||||||
toast.error(aiEnablementBlockedMessage);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
setLoadingField(field);
|
|
||||||
try {
|
|
||||||
const data =
|
|
||||||
field === "isAISmartToolsEnabled"
|
|
||||||
? { isAISmartToolsEnabled: checked }
|
|
||||||
: { isAIDataAnalysisEnabled: checked };
|
|
||||||
const response = await updateOrganizationAISettingsAction({
|
|
||||||
organizationId: organization.id,
|
|
||||||
data,
|
|
||||||
});
|
|
||||||
|
|
||||||
if (response?.data) {
|
|
||||||
toast.success(t("environments.settings.general.ai_settings_updated_successfully"));
|
|
||||||
router.refresh();
|
|
||||||
} else {
|
|
||||||
toast.error(getFormattedErrorMessage(response));
|
|
||||||
}
|
|
||||||
} catch (error) {
|
|
||||||
toast.error(error instanceof Error ? error.message : t("common.something_went_wrong_please_try_again"));
|
|
||||||
} finally {
|
|
||||||
setLoadingField(null);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="space-y-4">
|
|
||||||
{showInstanceConfigWarning && (
|
|
||||||
<Alert variant="warning">
|
|
||||||
<AlertDescription>{aiEnablementBlockedMessage}</AlertDescription>
|
|
||||||
</Alert>
|
|
||||||
)}
|
|
||||||
|
|
||||||
<AdvancedOptionToggle
|
|
||||||
isChecked={displayedSmartToolsValue}
|
|
||||||
onToggle={(checked) => handleToggle("isAISmartToolsEnabled", checked)}
|
|
||||||
htmlId="ai-smart-tools-toggle"
|
|
||||||
title={t("environments.settings.general.ai_smart_tools_enabled")}
|
|
||||||
description={t("environments.settings.general.ai_smart_tools_enabled_description")}
|
|
||||||
disabled={isToggleDisabled}
|
|
||||||
customContainerClass="px-0"
|
|
||||||
/>
|
|
||||||
|
|
||||||
<AdvancedOptionToggle
|
|
||||||
isChecked={displayedDataAnalysisValue}
|
|
||||||
onToggle={(checked) => handleToggle("isAIDataAnalysisEnabled", checked)}
|
|
||||||
htmlId="ai-data-analysis-toggle"
|
|
||||||
title={t("environments.settings.general.ai_data_analysis_enabled")}
|
|
||||||
description={t("environments.settings.general.ai_data_analysis_enabled_description")}
|
|
||||||
disabled={isToggleDisabled}
|
|
||||||
customContainerClass="px-0"
|
|
||||||
/>
|
|
||||||
|
|
||||||
{!canEdit && (
|
|
||||||
<Alert variant="warning">
|
|
||||||
<AlertDescription>
|
|
||||||
{t("common.only_owners_managers_and_manage_access_members_can_perform_this_action")}
|
|
||||||
</AlertDescription>
|
|
||||||
</Alert>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user