Merge branch 'main' of https://github.com/Dhruwang/formbricks into integration-test

.changeset/README.md

@@ -0,0 +1,8 @@
+# Changesets
+
+Hello and welcome! This folder has been automatically generated by `@changesets/cli`, a build tool that works
+with multi-package repos, or single-package repos to help you version and publish your code. You can
+find the full documentation for it [in our repository](https://github.com/changesets/changesets)
+
+We have a quick list of common questions to get you started engaging with this project in
+[our documentation](https://github.com/changesets/changesets/blob/main/docs/common-questions.md)

.changeset/config.json

@@ -1,11 +1,11 @@
 {
   "$schema": "https://unpkg.com/@changesets/config@2.2.0/schema.json",
-  "access": "public",
-  "baseBranch": "main",
   "changelog": "@changesets/cli/changelog",
   "commit": false,
   "fixed": [],
-  "ignore": ["@formbricks/demo", "@formbricks/web"],
   "linked": [],
-  "updateInternalDependencies": "patch"
+  "access": "public",
+  "baseBranch": "main",
+  "updateInternalDependencies": "patch",
+  "ignore": ["@formbricks/formbricks-com", "@formbricks/demo", "@formbricks/web"]
 }

.devcontainer/Dockerfile

@@ -0,0 +1,16 @@
+# [Choice] Node.js version (use -bullseye variants on local arm64/Apple Silicon): 18, 16, 14, 18-bullseye, 16-bullseye, 14-bullseye, 18-buster, 16-buster, 14-buster
+ARG VARIANT=20
+FROM mcr.microsoft.com/vscode/devcontainers/javascript-node:0-${VARIANT}
+
+# [Optional] Uncomment this section to install additional OS packages.
+# RUN apt-get update && export DEBIAN_FRONTEND=noninteractive \
+#     && apt-get -y install --no-install-recommends <your-package-list-here>
+
+# [Optional] Uncomment if you want to install an additional version of node using nvm
+# ARG EXTRA_NODE_VERSION=10
+# RUN su node -c "source /usr/local/share/nvm/nvm.sh && nvm install ${EXTRA_NODE_VERSION}"
+
+# [Optional] Uncomment if you want to install more global node modules
+# RUN su node -c "npm install -g <your-package-list-here>"
+
+RUN su node -c "npm install -g pnpm"

.devcontainer/devcontainer.json

@@ -1,6 +1,28 @@
+// For format details, see https://aka.ms/devcontainer.json. For config options, see the README at:
+// https://github.com/microsoft/vscode-dev-containers/tree/v0.245.2/containers/javascript-node-postgres
+// Update the VARIANT arg in docker-compose.yml to pick a Node.js version
 {
-  "features": {},
-  "image": "mcr.microsoft.com/devcontainers/universal:2",
-  "postAttachCommand": "pnpm go",
-  "postCreateCommand": "cp .env.example .env && sed -i '/^ENCRYPTION_KEY=/c\\ENCRYPTION_KEY='$(openssl rand -hex 32) .env && sed -i '/^NEXTAUTH_SECRET=/c\\NEXTAUTH_SECRET='$(openssl rand -hex 32) .env && sed -i '/^CRON_SECRET=/c\\CRON_SECRET='$(openssl rand -hex 32) .env && pnpm install && pnpm db:migrate:dev"
+  "name": "Node.js & PostgreSQL",
+  "dockerComposeFile": "docker-compose.yml",
+  "service": "app",
+  "workspaceFolder": "/workspace",
+
+  // Configure tool-specific properties.
+  "customizations": {
+    // Configure properties specific to VS Code.
+    "vscode": {
+      // Add the IDs of extensions you want installed when the container is created.
+      "extensions": ["dbaeumer.vscode-eslint"]
+    }
+  },
+
+  // Use 'forwardPorts' to make a list of ports inside the container available locally.
+  // This can be used to network with other containers or with the host.
+  "forwardPorts": [3000, 5432, 8025],
+
+  // Use 'postCreateCommand' to run commands after the container is created.
+  "postCreateCommand": "cp .env.example .env && sed -i '/^ENCRYPTION_KEY=/c\\ENCRYPTION_KEY='$(openssl rand -hex 32) .env && sed -i '/^NEXTAUTH_SECRET=/c\\NEXTAUTH_SECRET='$(openssl rand -hex 32) .env && pnpm install && pnpm db:migrate:dev",
+
+  // Comment out to connect as root instead. More info: https://aka.ms/vscode-remote/containers/non-root.
+  "remoteUser": "node"
 }

.devcontainer/docker-compose.yml

@@ -0,0 +1,52 @@
+version: '3.8'
+
+services:
+  app:
+    build:
+      context: .
+      dockerfile: Dockerfile
+      args:
+        # Update 'VARIANT' to pick an LTS version of Node.js: 20, 18, 16, 14.
+        # Append -bullseye or -buster to pin to an OS version.
+        # Use -bullseye variants on local arm64/Apple Silicon.
+        VARIANT: "20"
+
+    volumes:
+      - ..:/workspace:cached
+
+    # Overrides default command so things don't shut down after the process ends.
+    command: sleep infinity
+
+    # Runs app on the same network as the database container, allows "forwardPorts" in devcontainer.json function.
+    network_mode: service:db
+    # Uncomment the next line to use a non-root user for all processes.
+    # user: node
+
+    # Use "forwardPorts" in **devcontainer.json** to forward an app port locally. 
+    # (Adding the "ports" property to this file will not forward from a Codespace.)
+
+  db:
+    image: postgres:latest
+    restart: unless-stopped
+    volumes:
+      - postgres-data:/var/lib/postgresql/data
+    environment:
+      POSTGRES_PASSWORD: postgres
+      POSTGRES_USER: postgres
+      POSTGRES_DB: formbricks
+    # Add "forwardPorts": ["5432"] to **devcontainer.json** to forward PostgreSQL locally.
+    # (Adding the "ports" property to this file will not forward from a Codespace.)
+
+  mailhog:
+    image: mailhog/mailhog
+    network_mode: service:app
+    logging:
+      driver: "none" # disable saving logs
+        #    ports:
+      #    - 8025:8025 # web ui
+      # 1025:1025 # smtp server
+
+
+
+volumes:
+  postgres-data: null

.dockerignore

@@ -1,7 +1,7 @@
 # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
 
 # dependencies
-# **/node_modules
+**/node_modules
 .pnp
 .pnp.js
 .pnpm-store/
@@ -35,5 +35,3 @@ yarn-error.log*
 .vscode
 .github
 **/.turbo
-
-.env

.env.example

@@ -1,15 +1,16 @@
 ########################################################################
-# ------------ MANDATORY (CHANGE ACCORDING TO YOUR SETUP) ------------ #
+# ------------ MANDATORY (CHANGE ACCORDING TO YOUR SETUP) ------------#
 ########################################################################
 
+
 ############
 #  BASICS  #
 ############
 
 WEBAPP_URL=http://localhost:3000
 
-# Required for next-auth. Should be the same as WEBAPP_URL
-NEXTAUTH_URL=http://localhost:3000
+# Set this if you want to have a shorter link for surveys
+SHORT_URL_BASE=
 
 # Encryption keys
 # Please set both for now, we will change this in the future
@@ -17,20 +18,24 @@ NEXTAUTH_URL=http://localhost:3000
 # You can use: `openssl rand -hex 32` to generate one
 ENCRYPTION_KEY=
 
-# @see: https://next-auth.js.org/configuration/options#nextauth_secret
-# You can use: `openssl rand -hex 32` to generate a secure one
-NEXTAUTH_SECRET=
-
-# API Secret for running cron jobs. (mandatory)
-# You can use: `openssl rand -hex 32` to generate a secure one
-CRON_SECRET=
-
 ##############
 #  DATABASE  #
 ##############
 
 DATABASE_URL='postgresql://postgres:postgres@localhost:5432/formbricks?schema=public'
 
+###############
+#  NEXT AUTH  #
+###############
+
+# @see: https://next-auth.js.org/configuration/options#nextauth_secret
+# You can use: `openssl rand -hex 32` to generate one
+NEXTAUTH_SECRET=RANDOM_STRING
+
+# Set this to your public-facing URL, e.g., https://example.com
+# You do not need the NEXTAUTH_URL environment variable in Vercel.
+NEXTAUTH_URL=http://localhost:3000
+
 ################
 #  MAIL SETUP  #
 ################
@@ -46,11 +51,6 @@ SMTP_SECURE_ENABLED=0
 SMTP_USER=smtpUser
 SMTP_PASSWORD=smtpPassword
 
-# If set to 0, the server will not require SMTP_USER and SMTP_PASSWORD(default is 1)
-# SMTP_AUTHENTICATED=
-
-# If set to 0, the server will accept connections without requiring authorization from the list of supplied CAs (default is 1). 
-# SMTP_REJECT_UNAUTHORIZED_TLS=0
 
 ########################################################################
 # ------------------------------ OPTIONAL -----------------------------#
@@ -58,24 +58,6 @@ SMTP_PASSWORD=smtpPassword
 
 # Uncomment the variables you would like to use and customize the values.
 
-# Custom local storage path for file uploads
-#UPLOADS_DIR=
-
-##############
-# S3 STORAGE #
-##############
-
-# S3 Storage is required for the file upload in serverless environments like Vercel
-S3_ACCESS_KEY=
-S3_SECRET_KEY=
-S3_REGION=
-S3_BUCKET_NAME=
-# Configure a third party S3 compatible storage service endpoint like StorJ leave empty if you use Amazon S3
-# e.g., https://gateway.storjshare.io
-S3_ENDPOINT_URL=
-# Force path style for S3 compatible storage (0 for disabled, 1 for enabled)
-S3_FORCE_PATH_STYLE=0
-
 #####################
 # Disable Features  #
 #####################
@@ -87,13 +69,9 @@ EMAIL_VERIFICATION_DISABLED=1
 PASSWORD_RESET_DISABLED=1
 
 # Signup. Disable the ability for new users to create an account.
-# Note: This variable is only available to the SaaS setup of Formbricks Cloud. Signup is disable by default for self-hosting.
 # SIGNUP_DISABLED=1
 
-# Email login. Disable the ability for users to login with email.
-# EMAIL_AUTH_DISABLED=1
-
-# Organization Invite. Disable the ability for invited users to create an account.
+# Team Invite. Disable the ability for invited users to create an account.
 # INVITE_DISABLED=1
 
 ##########
@@ -104,31 +82,25 @@ PASSWORD_RESET_DISABLED=1
 PRIVACY_URL=
 TERMS_URL=
 IMPRINT_URL=
-IMPRINT_ADDRESS=
-
-# Configure Turnstile in signup flow
-# NEXT_PUBLIC_TURNSTILE_SITE_KEY=
-# TURNSTILE_SECRET_KEY=
 
 # Configure Github Login
+GITHUB_AUTH_ENABLED=0
 GITHUB_ID=
 GITHUB_SECRET=
 
 # Configure Google Login
+GOOGLE_AUTH_ENABLED=0
 GOOGLE_CLIENT_ID=
 GOOGLE_CLIENT_SECRET=
 
 # Configure Azure Active Directory Login
+AZUREAD_AUTH_ENABLED=0
 AZUREAD_CLIENT_ID=
 AZUREAD_CLIENT_SECRET=
 AZUREAD_TENANT_ID=
 
-# OpenID Connect (OIDC) configuration
-# OIDC_CLIENT_ID=
-# OIDC_CLIENT_SECRET=
-# OIDC_ISSUER=
-# OIDC_DISPLAY_NAME=
-# OIDC_SIGNING_ALGORITHM=
+# Cron Secret
+CRON_SECRET=
 
 # Configure this when you want to ship JS & CSS files from a complete URL instead of the current domain
 # ASSET_PREFIX_URL=
@@ -146,54 +118,22 @@ NEXT_PUBLIC_FORMBRICKS_API_HOST=
 NEXT_PUBLIC_FORMBRICKS_ENVIRONMENT_ID=
 NEXT_PUBLIC_FORMBRICKS_ONBOARDING_SURVEY_ID=
 
-# Oauth credentials for Google sheet integration
+# Oauth credentials for Google sheet integration 
 GOOGLE_SHEETS_CLIENT_ID=
 GOOGLE_SHEETS_CLIENT_SECRET=
 GOOGLE_SHEETS_REDIRECT_URL=
 
-# Oauth credentials for Airtable integration
+# Oauth credentials for Airtable integration 
 AIRTABLE_CLIENT_ID=
 
-# Oauth credentials for Slack integration
-SLACK_CLIENT_ID=
-SLACK_CLIENT_SECRET=
-
 # Enterprise License Key
 ENTERPRISE_LICENSE_KEY=
 
-# Automatically assign new users to a specific organization and role within that organization
-# Insert an existing organization id or generate a valid CUID for a new one at https://www.getuniqueid.com/cuid (e.g. cjld2cjxh0000qzrmn831i7rn)
+# Automatically assign new users to a specific team and role within that team
+# Insert an existing team id or generate a valid CUID for a new one at https://www.getuniqueid.com/cuid (e.g. cjld2cjxh0000qzrmn831i7rn)
 # (Role Management is an Enterprise feature)
-# DEFAULT_ORGANIZATION_ID=
-# DEFAULT_ORGANIZATION_ROLE=owner
+# DEFAULT_TEAM_ID=
+# DEFAULT_TEAM_ROLE=admin
 
-# Send new users to Brevo
-# BREVO_API_KEY=
-# BREVO_LIST_ID=
-
-# Ignore Rate Limiting across the Formbricks app
-# RATE_LIMITING_DISABLED=1
-
-# OpenTelemetry URL for tracing
-# OPENTELEMETRY_LISTENER_URL=http://localhost:4318/v1/traces
-
-# Unsplash API Key
-UNSPLASH_ACCESS_KEY=
-
-# The below is used for Next Caching (uses In-Memory from Next Cache if not provided)
-# REDIS_URL=redis://localhost:6379
-
-# The below is used for Rate Limiting (uses In-Memory LRU Cache if not provided) (You can use a service like Webdis for this)
-# REDIS_HTTP_URL:
-
-# Disable custom cache handler if necessary (e.g. if deployed on Vercel)
-# CUSTOM_CACHE_DISABLED=1
-
-# Azure AI settings
-# AI_AZURE_RESSOURCE_NAME=
-# AI_AZURE_API_KEY=
-# AI_AZURE_EMBEDDINGS_DEPLOYMENT_ID=
-# AI_AZURE_LLM_DEPLOYMENT_ID=
-
-# NEXT_PUBLIC_INTERCOM_APP_ID=
-# INTERCOM_SECRET_KEY=
+# set to 1 to skip onboarding for new users
+# ONBOARDING_DISABLED=1

.eslintignore

@@ -1,2 +0,0 @@
-node_modules/
-packages/config-eslint/

.eslintrc.js

@@ -0,0 +1,10 @@
+module.exports = {
+  root: true,
+  // This tells ESLint to load the config from the package `eslint-config-formbricks`
+  extends: ["formbricks"],
+  settings: {
+    next: {
+      rootDir: ["apps/*/"],
+    },
+  },
+};

.github/ISSUE_TEMPLATE/bug_report.yml

@@ -1,31 +1,81 @@
 name: Bug report
 description: "Found a bug? Please fill out the sections below. \U0001F44D"
-type: bug
+title: "[BUG]"
+labels: bug
+assignees: []
 body:
-  - type: textarea
-    id: issue-summary
-    attributes:
-      label: Issue Summary
-      description: A summary of the issue. This needs to be a clear detailed-rich summary.
-    validations:
-      required: true
-  - type: textarea
-    id: issue-expected-behavior
-    attributes:
-      label: Expected Behavior
-      description: A clear and concise description of what you expected to happen.
-    validations:
-      required: false
-  - type: textarea
-    id: other-information
-    attributes:
-      label: Other information (incl. screenshots, Formbricks version, steps to reproduce,...)
-    validations:
-      required: false
-  - type: dropdown
-    id: environment
-    attributes:
-      label: Your Environment
-      options:
-        - Formbricks Cloud (app.formbricks.com)
-        - Self-hosted Formbricks
+- type: textarea
+  id: issue-summary
+  attributes:
+    label: Issue Summary
+    description: A summary of the issue. This needs to be a clear detailed-rich summary.
+  validations:
+    required: true
+- type: textarea
+  id: steps-to-reproduce
+  attributes:
+    label: Steps to Reproduce
+    value: |
+      1. (for example) Went to ...
+      2. Clicked on...
+      3. ...
+  validations:
+    required: true
+- type: textarea
+  id: expected-behavior
+  attributes:
+    label: Expected behavior
+    description: A clear and concise description of what you expected to happen.
+  validations:
+    required: true
+- type: textarea
+  id: other-information
+  attributes:
+    label: Other information
+  validations:
+    required: false
+- type: textarea
+  id: screenshots
+  attributes:
+    label: Screenshots
+    description: If applicable, add screenshots to help explain your problem.
+  validations:
+    required: false
+- type: checkboxes
+  id: environment
+  attributes:
+    label: Environment
+    options:
+      - label: Formbricks Cloud (app.formbricks.com)
+      - label: Self-hosted Formbricks
+- type: textarea
+  id: desktop-version
+  attributes:
+    label: Desktop (please complete the following information)
+    description: | 
+      examples: 
+      - **OS**: [e.g. iOS]
+      - **Browser**: [e.g. chrome, safari]
+      - **Version**: [e.g. 22]
+    value: |
+      - OS:
+      - Node:
+      - npm: 
+    render: markdown
+  validations:
+    required: true
+- type: markdown
+  id: nodejs-version
+  attributes:
+    value: | 
+      #### Node.JS version
+      
+      [e.g. v18.15.0] 
+- type: markdown
+  id: anything-else
+  attributes:
+    value: |
+      #### Anything else?
+      
+      - Screen recording, console logs, network requests: You can make a recording with [Loom](https://www.loom.com).
+      - Anything else that you think could be an issue?

.github/ISSUE_TEMPLATE/config.yml

@@ -1,5 +1,5 @@
 blank_issues_enabled: false
 contact_links:
   - name: Questions
-    url: https://github.com/formbricks/formbricks/discussions
-    about: Need help selfhosting or ask a general question about the project? Open a discussion
+    url: https://formbricks.com/discord
+    about: Ask a general question about the project on our Discord server

.github/ISSUE_TEMPLATE/feature_request.yml

@@ -1,6 +1,8 @@
 name: Feature request
 description: "Suggest an idea for this project \U0001F680"
-type: feature
+title: "[FEATURE]"
+labels: enhancement
+assignees: []
 body:
   - type: textarea
     id: problem-description
@@ -16,6 +18,13 @@ body:
       description: A clear and concise description of what you want to happen.
     validations:
       required: true
+  - type: textarea
+    id: alternate-solution-description
+    attributes:
+      label: Describe alternatives you've considered
+      description: A clear and concise description of any alternative solutions or features you've considered.
+    validations:
+      required: false
   - type: textarea
     id: additional-context
     attributes:
@@ -24,9 +33,16 @@ body:
     validations:
       required: false
   - type: markdown
+    id: formbricks-info
     attributes:
       value: |
-        ### Additional resources 🤓
+        ### How we code at Formbricks 🤓
 
-        - Check out our [Contributor Docs](https://formbricks.com/docs/developer-docs/contributing/get-started)
-        - Anything unclear? [Ask in Github Discussions](https://github.com/formbricks/formbricks/discussions)
+        - Follow Best Practices lined out in our [Contributor Docs](https://formbricks.com/docs/contributing/how-we-code)
+        - First time: Please read our [introductory blog post](https://formbricks.com/blog/join-the-formtribe)
+        - All UI components are in the package `formbricks/ui`
+        - Run `pnpm go` to find a demo app to test in-app surveys at `localhost:3002`
+        - Everything is type-safe
+        - We use **chatGPT** to help refactor code. Use our [Formbricks ✨ megaprompt ✨](https://github.com/formbricks/formbricks/blob/main/megaprompt.md) to create the right 
+          context before you write your prompt.
+        - Anything unclear? [Ask in Discord](https://formbricks.com/discord)

.github/ISSUE_TEMPLATE/task.yml

@@ -1,11 +0,0 @@
-name: Task (internal)
-description: "Template for creating a task. Used by the Formbricks Team only \U0001f4e5"
-type: task
-body:
-  - type: textarea
-    id: task-summary
-    attributes:
-      label: Task description
-      description: A clear detailed-rich description of the task.
-    validations:
-      required: true

.github/PULL_REQUEST_TEMPLATE.md

@@ -0,0 +1,50 @@
+## What does this PR do?
+
+<!-- Please include a summary of the change and which issue is fixed. Please also include relevant motivation and context. List any dependencies that are required for this change. -->
+
+Fixes # (issue)
+
+<!-- Please provide a screenshots or a loom video for visual changes to speed up reviews
+ Loom Video: https://www.loom.com/
+-->
+
+## Type of change
+
+<!-- Please mark the relevant points by using [x] -->
+
+- [ ] Bug fix (non-breaking change which fixes an issue)
+- [ ] Chore (refactoring code, technical debt, workflow improvements)
+- [ ] Enhancement (small improvements)
+- [ ] New feature (non-breaking change which adds functionality)
+- [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected)
+- [ ] This change adds a new database migration
+- [ ] This change requires a documentation update
+
+## How should this be tested?
+
+<!-- Please describe the tests that you ran to verify your changes. Provide instructions so we can reproduce. Please also list any relevant details for your test configuration -->
+
+- Test A
+- Test B
+
+## Checklist
+
+<!-- We're starting to get more and more contributions. Please help us making this efficient for all of us and go through this checklist. Please tick off what you did  -->
+
+### Required
+
+- [ ] Filled out the "How to test" section in this PR
+- [ ] Read [How we Code at Formbricks](<[https://github.com/formbricks/formbricks/blob/main/CONTRIBUTING.md](https://formbricks.com/docs/contributing/how-we-code)>)
+- [ ] Self-reviewed my own code
+- [ ] Commented on my code in hard-to-understand bits
+- [ ] Ran `pnpm build`
+- [ ] Checked for warnings, there are none
+- [ ] Removed all `console.logs`
+- [ ] Merged the latest changes from main onto my branch with `git pull origin main`
+- [ ] My changes don't cause any responsiveness issues
+- [ ] First PR at Formbricks? [Please sign the CLA!](https://formbricks.com/clmyhzfrymr4ko00hycsg1tvx) Without it we wont be able to merge it 🙏
+
+### Appreciated
+
+- [ ] If a UI change was made: Added a screen recording or screenshots to this PR
+- [ ] Updated the Formbricks Docs if changes were necessary

.github/actions/cache-build-web/action.yml

@@ -1,70 +0,0 @@
-name: Build & Cache Web App
-
-on:
-  workflow_dispatch:
-    inputs:
-      e2e_testing_mode:
-        description: "Set E2E Testing Mode"
-        required: false
-        default: "0"
-
-runs:
-  using: "composite"
-  steps:
-    - name: Checkout repo
-      uses: actions/checkout@v3
-
-    - uses: ./.github/actions/dangerous-git-checkout
-
-    - name: Cache Build
-      uses: actions/cache@v3
-      id: cache-build
-      env:
-        cache-name: prod-build
-        key-1: ${{ hashFiles('pnpm-lock.yaml') }}
-        key-2: ${{ hashFiles('apps/**/**.[jt]s', 'apps/**/**.[jt]sx', 'packages/**/**.[jt]s', 'packages/**/**.[jt]sx', '!**/node_modules') }}
-      with:
-        path: |
-          ${{ github.workspace }}/apps/web/.next
-          **/.turbo/**
-          **/dist/**
-        key: ${{ runner.os }}-${{ env.cache-name }}-${{ env.key-1 }}-${{ env.key-2 }}
-
-    - name: Set Cache Hit Status
-      run: echo "cache-hit=${{ steps.cache-build.outputs.cache-hit }}" >> "$GITHUB_OUTPUT"
-      shell: bash
-
-    - name: Setup Node.js 20.x
-      uses: actions/setup-node@v3
-      with:
-        node-version: 20.x
-      if: steps.cache-build.outputs.cache-hit != 'true'
-
-    - name: Install pnpm
-      uses: pnpm/action-setup@v4
-      if: steps.cache-build.outputs.cache-hit != 'true'
-
-    - name: Install dependencies
-      run: pnpm install --config.platform=linux --config.architecture=x64
-      if: steps.cache-build.outputs.cache-hit != 'true'
-      shell: bash
-
-    - name: create .env
-      run: cp .env.example .env
-      shell: bash
-
-    - name: Fill ENCRYPTION_KEY, ENTERPRISE_LICENSE_KEY and E2E_TESTING in .env
-      run: |
-        RANDOM_KEY=$(openssl rand -hex 32)
-        sed -i "s/ENCRYPTION_KEY=.*/ENCRYPTION_KEY=${RANDOM_KEY}/" .env
-        sed -i "s/CRON_SECRET=.*/CRON_SECRET=${RANDOM_KEY}/" .env
-        sed -i "s/NEXTAUTH_SECRET=.*/NEXTAUTH_SECRET=${RANDOM_KEY}/" .env
-        sed -i "s/ENTERPRISE_LICENSE_KEY=.*/ENTERPRISE_LICENSE_KEY=${RANDOM_KEY}/" .env
-        echo "E2E_TESTING=${{ inputs.e2e_testing_mode }}" >> .env
-      shell: bash
-
-    - run: |
-        pnpm build --filter=@formbricks/web...
-
-      if: steps.cache-build.outputs.cache-hit != 'true'
-      shell: bash

.github/actions/dangerous-git-checkout/action.yml

@@ -1,10 +0,0 @@
-name: Dangerous git Checkout
-description: "Git Checkout from PR code so we can run checks from forks"
-runs:
-  using: "composite"
-  steps:
-    - name: Checkout repo
-      uses: actions/checkout@v3
-      with:
-        ref: ${{ github.event.pull_request.head.sha }}
-        fetch-depth: 2

.github/pull_request_template.md

@@ -1,40 +0,0 @@
-<!-- We require pull request titles to follow the Conventional Commits specification ( https://www.conventionalcommits.org/en/v1.0.0/#summary ). Please make sure your title follow these conventions -->
-
-## What does this PR do?
-
-<!-- Please include a summary of the change and which issue is fixed. Please also include relevant motivation and context. List any dependencies that are required for this change. -->
-
-Fixes #(issue)
-
-<!-- Please provide a screenshots or a loom video for visual changes to speed up reviews
- Loom Video: https://www.loom.com/
--->
-
-## How should this be tested?
-
-<!-- Please describe the tests that you ran to verify your changes. Provide instructions so we can reproduce. Please also list any relevant details for your test configuration -->
-
-- Test A
-- Test B
-
-## Checklist
-
-<!-- We're starting to get more and more contributions. Please help us making this efficient for all of us and go through this checklist. Please tick off what you did  -->
-
-### Required
-
-- [ ] Filled out the "How to test" section in this PR
-- [ ] Read [How we Code at Formbricks](<[https://github.com/formbricks/formbricks/blob/main/CONTRIBUTING.md](https://formbricks.com/docs/contributing/how-we-code)>)
-- [ ] Self-reviewed my own code
-- [ ] Commented on my code in hard-to-understand bits
-- [ ] Ran `pnpm build`
-- [ ] Checked for warnings, there are none
-- [ ] Removed all `console.logs`
-- [ ] Merged the latest changes from main onto my branch with `git pull origin main`
-- [ ] My changes don't cause any responsiveness issues
-- [ ] First PR at Formbricks? [Please sign the CLA!](https://cla-assistant.io/formbricks/formbricks) Without it we wont be able to merge it 🙏
-
-### Appreciated
-
-- [ ] If a UI change was made: Added a screen recording or screenshots to this PR
-- [ ] Updated the Formbricks Docs if changes were necessary

.github/workflows/build-formbricks-com.yml

@@ -0,0 +1,26 @@
+name: Build
+on:
+  workflow_call:
+jobs:
+  build:
+    name: Build Formbricks-com
+    runs-on: ubuntu-latest
+    timeout-minutes: 30
+
+    steps:
+      - name: Checkout repo
+        uses: actions/checkout@v3
+
+      - name: Setup Node.js 18.x
+        uses: actions/setup-node@v3
+        with:
+          node-version: 18.x
+
+      - name: Install pnpm
+        uses: pnpm/action-setup@v2
+
+      - name: Install dependencies
+        run: pnpm install --config.platform=linux --config.architecture=x64
+
+      - name: Build Formbricks-com
+        run: pnpm build --filter=formbricks-com...

.github/workflows/build-web.yml

@@ -1,10 +1,6 @@
-name: Build Web
+name: Build
 on:
   workflow_call:
-
-permissions:
-  contents: read
-  
 jobs:
   build:
     name: Build Formbricks-web
@@ -12,11 +8,27 @@ jobs:
     timeout-minutes: 30
 
     steps:
-      - uses: actions/checkout@v3
-      - uses: ./.github/actions/dangerous-git-checkout
+      - name: Checkout repo
+        uses: actions/checkout@v3
 
-      - name: Build & Cache Web Binaries
-        uses: ./.github/actions/cache-build-web
-        id: cache-build-web
+      - name: Setup Node.js 18.x
+        uses: actions/setup-node@v3
         with:
-          e2e_testing_mode: "0"
+          node-version: 18.x
+
+      - name: Install pnpm
+        uses: pnpm/action-setup@v2
+
+      - name: Install dependencies
+        run: pnpm install --config.platform=linux --config.architecture=x64
+
+      - name: create .env
+        run: cp .env.example .env
+
+      - name: Generate Random NEXTAUTH_SECRET
+        run: |
+          SECRET=$(openssl rand -hex 32)
+          echo "ENCRYPTION_KEY=$SECRET" >> $GITHUB_ENV
+
+      - name: Build Formbricks-web
+        run: pnpm build --filter=web...

.github/workflows/chromatic.yml

@@ -1,30 +0,0 @@
-name: "Chromatic"
-
-on:
-  push:
-    branches:
-      - main
-  workflow_dispatch:
-
-jobs:
-  chromatic:
-    name: Run Chromatic
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout code
-        uses: actions/checkout@v4
-        with:
-          fetch-depth: 0
-      - uses: actions/setup-node@v4
-        with:
-          node-version: 20
-      - name: Install pnpm
-        uses: pnpm/action-setup@v4
-      - name: Install dependencies
-        run: pnpm install --config.platform=linux --config.architecture=x64
-      - name: Run Chromatic
-        uses: chromaui/action@latest
-        with:
-          # ⚠️ Make sure to configure a `CHROMATIC_PROJECT_TOKEN` repository secret
-          projectToken: ${{ secrets.CHROMATIC_PROJECT_TOKEN }}
-          workingDir: apps/storybook

.github/workflows/cron-closeOnDate.yml

@@ -0,0 +1,23 @@
+name: Cron - closeOnDate
+
+on:
+  # "Scheduled workflows run on the latest commit on the default or base branch."
+  # — https://docs.github.com/en/actions/learn-github-actions/events-that-trigger-workflows#schedule
+  schedule:
+    # Runs “At 00:00.” (see https://crontab.guru)
+    - cron: "0 0 * * *"
+jobs:
+  cron-weeklySummary:
+    env:
+      APP_URL: ${{ secrets.APP_URL }}
+      CRON_SECRET: ${{ secrets.CRON_SECRET }}
+    runs-on: ubuntu-latest
+    steps:
+      - name: cURL request
+        if: ${{ env.APP_URL && env.CRON_SECRET }}
+        run: |
+          curl ${{ env.APP_URL }}/api/cron/close_surveys \
+            -X POST \
+            -H 'content-type: application/json' \
+            -H 'x-api-key: ${{ env.CRON_SECRET }}' \
+            --fail

.github/workflows/cron-reportUsageToStripe.yml

@@ -0,0 +1,23 @@
+name: Cron - reportUsageToStripe
+
+on:
+  # "Scheduled workflows run on the latest commit on the default or base branch."
+  # — https://docs.github.com/en/actions/learn-github-actions/events-that-trigger-workflows#schedule
+  schedule:
+    # This will run the job at 22:00 UTC every day of every month.
+    - cron: "0 22 * * *"
+jobs:
+  cron-reportUsageToStripe:
+    env:
+      APP_URL: ${{ secrets.APP_URL }}
+      CRON_SECRET: ${{ secrets.CRON_SECRET }}
+    runs-on: ubuntu-latest
+    steps:
+      - name: cURL request
+        if: ${{ env.APP_URL && env.CRON_SECRET }}
+        run: |
+          curl ${{ env.APP_URL }}/api/cron/report-usage \
+            -X POST \
+            -H 'x-api-key: ${{ env.CRON_SECRET }}' \
+            -H 'Cache-Control: no-cache' \
+            --fail

.github/workflows/cron-surveyStatusUpdate.yml

@@ -1,28 +0,0 @@
-name: Cron - Survey status update
-
-on:
-  workflow_dispatch:
-  # "Scheduled workflows run on the latest commit on the default or base branch."
-  # — https://docs.github.com/en/actions/learn-github-actions/events-that-trigger-workflows#schedule
-  schedule:
-    # Runs "At 00:00." (see https://crontab.guru)
-    - cron: "0 0 * * *"
-
-permissions:
-  contents: read
-
-jobs:
-  cron-weeklySummary:
-    env:
-      APP_URL: ${{ secrets.APP_URL }}
-      CRON_SECRET: ${{ secrets.CRON_SECRET }}
-    runs-on: ubuntu-latest
-    steps:
-      - name: cURL request
-        if: ${{ env.APP_URL && env.CRON_SECRET }}
-        run: |
-          curl ${{ env.APP_URL }}/api/cron/survey-status \
-            -X POST \
-            -H 'content-type: application/json' \
-            -H 'x-api-key: ${{ env.CRON_SECRET }}' \
-            --fail

.github/workflows/cron-weeklySummary.yml

@@ -1,7 +1,6 @@
-name: Cron - Weekly summary
+name: Cron - weeklySummary
 
 on:
-  workflow_dispatch:
   # "Scheduled workflows run on the latest commit on the default or base branch."
   # — https://docs.github.com/en/actions/learn-github-actions/events-that-trigger-workflows#schedule
   schedule:
@@ -9,8 +8,6 @@ on:
     - cron: "0 8 * * 1"
 jobs:
   cron-weeklySummary:
-    permissions:
-      contents: read    
     env:
       APP_URL: ${{ secrets.APP_URL }}
       CRON_SECRET: ${{ secrets.CRON_SECRET }}
@@ -19,7 +16,7 @@ jobs:
       - name: cURL request
         if: ${{ env.APP_URL && env.CRON_SECRET }}
         run: |
-          curl ${{ env.APP_URL }}/api/cron/weekly-summary \
+          curl ${{ env.APP_URL }}/api/cron/weekly_summary \
             -X POST \
             -H 'content-type: application/json' \
             -H 'x-api-key: ${{ env.CRON_SECRET }}' \

.github/workflows/e2e.yml

@@ -1,138 +0,0 @@
-name: E2E Tests
-
-on:
-  workflow_call:
-    secrets:
-      AZURE_CLIENT_ID:
-        required: false
-      AZURE_TENANT_ID:
-        required: false
-      AZURE_SUBSCRIPTION_ID:
-        required: false
-      PLAYWRIGHT_SERVICE_URL:
-        required: false
-      # Add other secrets if necessary
-  workflow_dispatch:
-
-env:
-  TELEMETRY_DISABLED: 1
-
-permissions:
-  id-token: write
-  contents: read
-  actions: read
-  checks: write
-
-jobs:
-  build:
-    name: Run E2E Tests
-    runs-on: ubuntu-latest
-    timeout-minutes: 60
-    services:
-      postgres:
-        image: pgvector/pgvector:pg17
-        env:
-          POSTGRES_DB: postgres
-          POSTGRES_USER: postgres
-          POSTGRES_PASSWORD: postgres
-        ports:
-          - 5432:5432
-        options: >-
-          --health-cmd="pg_isready -U testuser"
-          --health-interval=10s
-          --health-timeout=5s
-          --health-retries=5
-    steps:
-      - uses: actions/checkout@v3
-      - uses: ./.github/actions/dangerous-git-checkout
-
-      - name: Setup Node.js 20.x
-        uses: actions/setup-node@v3
-        with:
-          node-version: 20.x
-
-      - name: Install pnpm
-        uses: pnpm/action-setup@v4
-
-      - name: Install dependencies
-        run: pnpm install --config.platform=linux --config.architecture=x64
-        shell: bash
-
-      - name: create .env
-        run: cp .env.example .env
-        shell: bash
-
-      - name: Fill ENCRYPTION_KEY, ENTERPRISE_LICENSE_KEY and E2E_TESTING in .env
-        run: |
-          RANDOM_KEY=$(openssl rand -hex 32)
-          sed -i "s/ENCRYPTION_KEY=.*/ENCRYPTION_KEY=${RANDOM_KEY}/" .env
-          sed -i "s/CRON_SECRET=.*/CRON_SECRET=${RANDOM_KEY}/" .env
-          sed -i "s/NEXTAUTH_SECRET=.*/NEXTAUTH_SECRET=${RANDOM_KEY}/" .env
-          sed -i "s/ENTERPRISE_LICENSE_KEY=.*/ENTERPRISE_LICENSE_KEY=${RANDOM_KEY}/" .env
-          echo "" >> .env
-          echo "E2E_TESTING=1" >> .env
-        shell: bash
-
-      - name: Build App
-        run: |
-          pnpm build --filter=@formbricks/web...
-
-      - name: Apply Prisma Migrations
-        run: |
-          # pnpm prisma migrate deploy
-          pnpm db:migrate:dev
-
-      - name: Run App
-        run: |
-          NODE_ENV=test pnpm start --filter=@formbricks/web &
-          sleep 10  # Optional: gives some buffer for the app to start
-          for attempt in {1..10}; do
-            if [ $(curl -o /dev/null -s -w "%{http_code}" http://localhost:3000/health) -eq 200 ]; then
-              echo "Application is ready."
-              break
-            fi
-            if [ $attempt -eq 10 ]; then
-              echo "Application failed to start in time."
-              exit 1
-            fi
-            echo "Still waiting for the application to be ready..."
-            sleep 10
-          done
-
-      - name: Install Playwright
-        run: pnpm exec playwright install --with-deps
-
-      - name: Set Azure Secret Variables
-        run: |
-          if [[ -n "${{ secrets.AZURE_CLIENT_ID }}" && -n "${{ secrets.AZURE_TENANT_ID }}" && -n "${{ secrets.AZURE_SUBSCRIPTION_ID }}" ]]; then
-            echo "AZURE_ENABLED=true" >> $GITHUB_ENV
-          else
-            echo "AZURE_ENABLED=false" >> $GITHUB_ENV
-          fi
-
-      - name: Azure login
-        if: env.AZURE_ENABLED == 'true'
-        uses: azure/login@v2
-        with:
-          client-id: ${{ secrets.AZURE_CLIENT_ID }}
-          tenant-id: ${{ secrets.AZURE_TENANT_ID }}
-          subscription-id: ${{ secrets.AZURE_SUBSCRIPTION_ID }}
-
-      - name: Run E2E Tests (Azure)
-        if: env.AZURE_ENABLED == 'true'
-        env:
-          PLAYWRIGHT_SERVICE_URL: ${{ secrets.PLAYWRIGHT_SERVICE_URL }}
-        run: |
-          pnpm test-e2e:azure
-
-      - name: Run E2E Tests (Local)
-        if: env.AZURE_ENABLED == 'false'
-        run: |
-          pnpm test:e2e
-
-      - uses: actions/upload-artifact@v4
-        if: always()
-        with:
-          name: playwright-report
-          path: playwright-report/
-          retention-days: 30

.github/workflows/lint.yml

@@ -1,10 +1,6 @@
 name: Lint
 on:
   workflow_call:
-
-permissions:
-  contents: read
-
 jobs:
   build:
     name: Linters
@@ -12,16 +8,16 @@ jobs:
     timeout-minutes: 15
 
     steps:
-      - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683
-      - uses: ./.github/actions/dangerous-git-checkout
+      - name: Checkout repo
+        uses: actions/checkout@v3
 
-      - name: Setup Node.js 20.x
-        uses: actions/setup-node@39370e3970a6d050c480ffad4ff0ed4d3fdee5af
+      - name: Setup Node.js 18.x
+        uses: actions/setup-node@v3
         with:
-          node-version: 20.x
+          node-version: 18.x
 
       - name: Install pnpm
-        uses: pnpm/action-setup@fe02b34f77f8bc703788d5817da081398fad5dd2
+        uses: pnpm/action-setup@v2
 
       - name: Install dependencies
         run: pnpm install --config.platform=linux --config.architecture=x64
@@ -29,12 +25,10 @@ jobs:
       - name: create .env
         run: cp .env.example .env
 
-      - name: Generate Random ENCRYPTION_KEY, CRON_SECRET & NEXTAUTH_SECRET and fill in .env
+      - name: Generate Random ENCRYPTION_KEY
         run: |
-          RANDOM_KEY=$(openssl rand -hex 32)
-          sed -i "s/ENCRYPTION_KEY=.*/ENCRYPTION_KEY=${RANDOM_KEY}/" .env
-          sed -i "s/CRON_SECRET=.*/CRON_SECRET=${RANDOM_KEY}/" .env
-          sed -i "s/NEXTAUTH_SECRET=.*/NEXTAUTH_SECRET=${RANDOM_KEY}/" .env
+          SECRET=$(openssl rand -hex 32)
+          echo "ENCRYPTION_KEY=$SECRET" >> $GITHUB_ENV
 
       - name: Lint
         run: pnpm lint

.github/workflows/playwright.yml

@@ -0,0 +1,40 @@
+name: E2E Tests
+on:
+  workflow_call:
+jobs:
+  build:
+    name: Run E2E Tests
+    runs-on: ubuntu-latest
+    timeout-minutes: 60
+
+    steps:
+      - uses: actions/checkout@v3
+
+      - uses: actions/setup-node@v3
+        with:
+          node-version: 20
+
+      - name: Install Docker Compose
+        run: sudo apt-get update && sudo apt-get install -y docker-compose
+
+      - name: Install dependencies
+        run: npm install -g pnpm && pnpm install
+
+      - name: Build Formricks JS package
+        run: pnpm build --filter=js
+
+      - name: Build Formbricks Image & Run
+        run: docker-compose up -d
+
+      - name: Install Playwright Browsers
+        run: pnpm exec playwright install --with-deps
+
+      - name: Run Playwright tests
+        run: pnpm test:e2e
+
+      - uses: actions/upload-artifact@v3
+        if: always()
+        with:
+          name: playwright-report
+          path: playwright-report/
+          retention-days: 30

.github/workflows/pr.yml

@@ -1,15 +1,7 @@
 name: PR Update
 
-# Update permissions to include all necessary ones
-permissions:
-  contents: read
-  pull-requests: read
-  actions: read
-  checks: write
-  id-token: write
-
 on:
-  pull_request:
+  pull_request_target:
     branches:
       - main
   merge_group:
@@ -21,7 +13,7 @@ concurrency:
 
 jobs:
   test:
-    name: Run Unit Tests
+    name: Run Tests
     uses: ./.github/workflows/test.yml
     secrets: inherit
 
@@ -37,18 +29,13 @@ jobs:
 
   e2e-test:
     name: Run E2E Tests
-    uses: ./.github/workflows/e2e.yml
+    uses: ./.github/workflows/playwright.yml
     secrets: inherit
 
   required:
-    name: PR Check Summary
     needs: [lint, test, build, e2e-test]
     if: always()
     runs-on: ubuntu-latest
-    permissions:
-      contents: read
-      checks: write
-      statuses: write
     steps:
       - name: fail if conditional jobs failed
         if: contains(needs.*.result, 'failure') || contains(needs.*.result, 'skipped') || contains(needs.*.result, 'cancelled')

.github/workflows/prepare-release.yml

@@ -1,62 +0,0 @@
-name: Prepare release
-run-name: Prepare release ${{ inputs.next_version }}
-
-on:
-  workflow_dispatch:
-    inputs:
-      next_version:
-        required: true
-        type: string
-        description: "Version name"
-
-permissions:
-  contents: write
-  pull-requests: write
-
-jobs:
-  prepare_release:
-    runs-on: ubuntu-latest
-
-    steps:
-      - uses: actions/checkout@11bd71901bbe5b1630ceea73d27597364c9af683
-
-      - uses: ./.github/actions/dangerous-git-checkout
-
-      - name: Configure git
-        run: |
-          git config --local user.email "github-actions@github.com"
-          git config --local user.name "GitHub Actions"
-
-      - name: Setup Node.js 20.x
-        uses: actions/setup-node@39370e3970a6d050c480ffad4ff0ed4d3fdee5af
-        with:
-          node-version: 20.x
-
-      - name: Install pnpm
-        uses: pnpm/action-setup@fe02b34f77f8bc703788d5817da081398fad5dd2
-
-      - name: Install dependencies
-        run: pnpm install --config.platform=linux --config.architecture=x64
-
-      - name: Bump version
-        run: |
-          cd apps/web
-          pnpm version ${{ inputs.next_version }} --no-workspaces-update
-
-      - name: Commit changes and create a branch
-        run: |
-          branch_name="release-v${{ inputs.next_version }}"
-          git checkout -b "$branch_name"
-          git add .
-          git commit -m "chore: release v${{ inputs.next_version }}"
-          git push origin "$branch_name"
-
-      - name: Create pull request
-        run: |
-          gh pr create \
-            --base main \
-            --head "release-v${{ inputs.next_version }}" \
-            --title "chore: bump version to v${{ inputs.next_version }}" \
-            --body "This PR contains the changes for the v${{ inputs.next_version }} release."
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/release-changesets.yml

@@ -1,15 +1,9 @@
 name: Release Changesets
 
 on:
-  workflow_dispatch:
-  #push:
-  #  branches:
-  #    - main
-
-permissions:
-  contents: write
-  pull-requests: write
-  packages: write
+  push:
+    branches:
+      - main
 
 concurrency: ${{ github.workflow }}-${{ github.ref }}
 

.github/workflows/release-docker-github-experimental.yml

@@ -1,91 +0,0 @@
-name: Docker Release to Github Experimental
-
-# This workflow uses actions that are not certified by GitHub.
-# They are provided by a third-party and are governed by
-# separate terms of service, privacy policy, and support
-# documentation.
-
-on:
-  workflow_dispatch:
-
-env:
-  # Use docker.io for Docker Hub if empty
-  REGISTRY: ghcr.io
-  # github.repository as <account>/<repo>
-  IMAGE_NAME: ${{ github.repository }}-experimental
-  TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
-  TURBO_TEAM: ${{ secrets.TURBO_TEAM }}
-  DATABASE_URL: "postgresql://postgres:postgres@localhost:5432/formbricks?schema=public"
-
-jobs:
-  build:
-    runs-on: ubuntu-latest
-    permissions:
-      contents: read
-      packages: write
-      # This is used to complete the identity challenge
-      # with sigstore/fulcio when running outside of PRs.
-      id-token: write
-
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v3
-
-      - name: Set up Depot CLI
-        uses: depot/setup-action@v1
-
-      # Install the cosign tool except on PR
-      # https://github.com/sigstore/cosign-installer
-      - name: Install cosign
-        if: github.event_name != 'pull_request'
-        uses: sigstore/cosign-installer@v3.5.0
-
-      # Login against a Docker registry except on PR
-      # https://github.com/docker/login-action
-      - name: Log into registry ${{ env.REGISTRY }}
-        if: github.event_name != 'pull_request'
-        uses: docker/login-action@v3 # v3.0.0
-        with:
-          registry: ${{ env.REGISTRY }}
-          username: ${{ github.actor }}
-          password: ${{ secrets.GITHUB_TOKEN }}
-
-      # Extract metadata (tags, labels) for Docker
-      # https://github.com/docker/metadata-action
-      - name: Extract Docker metadata
-        id: meta
-        uses: docker/metadata-action@v5 # v5.0.0
-        with:
-          images: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }}
-
-      # Build and push Docker image with Buildx (don't push on PR)
-      # https://github.com/docker/build-push-action
-      - name: Build and push Docker image
-        id: build-and-push
-        uses: depot/build-push-action@v1
-        with:
-          project: tw0fqmsx3c
-          token: ${{ secrets.DEPOT_PROJECT_TOKEN }}
-          context: .
-          file: ./apps/web/Dockerfile
-          platforms: linux/amd64,linux/arm64
-          push: ${{ github.event_name != 'pull_request' }}
-          tags: ${{ steps.meta.outputs.tags }}
-          labels: ${{ steps.meta.outputs.labels }}
-          cache-from: type=gha
-          cache-to: type=gha,mode=max
-
-      # Sign the resulting Docker image digest except on PRs.
-      # This will only write to the public Rekor transparency log when the Docker
-      # repository is public to avoid leaking data.  If you would like to publish
-      # transparency data even for private images, pass --force to cosign below.
-      # https://github.com/sigstore/cosign
-      - name: Sign the published Docker image
-        if: ${{ github.event_name != 'pull_request' }}
-        env:
-          # https://docs.github.com/en/actions/security-guides/security-hardening-for-github-actions#using-an-intermediate-environment-variable
-          TAGS: ${{ steps.meta.outputs.tags }}
-          DIGEST: ${{ steps.build-and-push.outputs.digest }}
-        # This step uses the identity token to provision an ephemeral certificate
-        # against the sigstore community Fulcio instance.
-        run: echo "${TAGS}" | xargs -I {} cosign sign --yes {}@${DIGEST}

.github/workflows/release-docker-github.yml

@@ -1,4 +1,4 @@
-name: Docker Release to Github
+name: Docker
 
 # This workflow uses actions that are not certified by GitHub.
 # They are provided by a third-party and are governed by
@@ -31,17 +31,37 @@ jobs:
       id-token: write
 
     steps:
+      - name: Generate Random NEXTAUTH_SECRET
+        run: |
+          SECRET=$(openssl rand -hex 32)
+          echo "NEXTAUTH_SECRET=$SECRET" >> $GITHUB_ENV
+
+      - name: Generate Random ENCRYPTION_KEY
+        run: |
+          SECRET=$(openssl rand -hex 32)
+          echo "ENCRYPTION_KEY=$SECRET" >> $GITHUB_ENV
+
       - name: Checkout repository
         uses: actions/checkout@v3
 
-      - name: Set up Depot CLI
-        uses: depot/setup-action@v1
-
       # Install the cosign tool except on PR
       # https://github.com/sigstore/cosign-installer
       - name: Install cosign
         if: github.event_name != 'pull_request'
-        uses: sigstore/cosign-installer@v3.5.0
+        uses: sigstore/cosign-installer@6e04d228eb30da1757ee4e1dd75a0ec73a653e06 #v3.1.1
+        with:
+          cosign-release: "v2.1.1"
+
+        # Add support for more platforms with QEMU (optional)
+        # https://github.com/docker/setup-qemu-action
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v3
+
+      # Set up BuildKit Docker container builder to be able to build
+      # multi-platform images and export cache
+      # https://github.com/docker/setup-buildx-action
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v3 # v3.0.0
 
       # Login against a Docker registry except on PR
       # https://github.com/docker/login-action
@@ -65,18 +85,20 @@ jobs:
       # https://github.com/docker/build-push-action
       - name: Build and push Docker image
         id: build-and-push
-        uses: depot/build-push-action@v1
+        uses: docker/build-push-action@v5 # v5.0.0
         with:
-          project: tw0fqmsx3c
-          token: ${{ secrets.DEPOT_PROJECT_TOKEN }}
           context: .
           file: ./apps/web/Dockerfile
-          platforms: linux/amd64,linux/arm64
+          # platforms: linux/amd64,linux/arm64
           push: ${{ github.event_name != 'pull_request' }}
           tags: ${{ steps.meta.outputs.tags }}
           labels: ${{ steps.meta.outputs.labels }}
           cache-from: type=gha
           cache-to: type=gha,mode=max
+          build-args: |
+            NEXTAUTH_SECRET=${{ env.NEXTAUTH_SECRET }}
+            DATABASE_URL=${{ env.DATABASE_URL }}
+            ENCRYPTION_KEY=${{ env.ENCRYPTION_KEY }}
 
       # Sign the resulting Docker image digest except on PRs.
       # This will only write to the public Rekor transparency log when the Docker

.github/workflows/release-docker.yml

@@ -8,14 +8,22 @@ on:
 jobs:
   release-image-on-dockerhub:
     name: Release on Dockerhub
-    permissions:
-      contents: read
     runs-on: ubuntu-latest
     env:
       TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
       TURBO_TEAM: ${{ secrets.TURBO_TEAM }}
       DATABASE_URL: "postgresql://postgres:postgres@localhost:5432/formbricks?schema=public"
     steps:
+      - name: Generate Random NEXTAUTH_SECRET
+        run: |
+          SECRET=$(openssl rand -hex 32)
+          echo "NEXTAUTH_SECRET=$SECRET" >> $GITHUB_ENV
+
+      - name: Generate Random ENCRYPTION_KEY
+        run: |
+          SECRET=$(openssl rand -hex 32)
+          echo "ENCRYPTION_KEY=$SECRET" >> $GITHUB_ENV
+
       - name: Checkout Repo
         uses: actions/checkout@v2
 
@@ -44,3 +52,7 @@ jobs:
           tags: |
             ${{ secrets.DOCKER_USERNAME }}/formbricks:${{ env.RELEASE_TAG }}
             ${{ secrets.DOCKER_USERNAME }}/formbricks:latest
+          build-args: |
+            NEXTAUTH_SECRET=${{ env.NEXTAUTH_SECRET }}
+            DATABASE_URL=${{ env.DATABASE_URL }}
+            ENCRYPTION_KEY=${{ env.ENCRYPTION_KEY }}

.github/workflows/scorecard.yml

@@ -1,76 +0,0 @@
-# This workflow uses actions that are not certified by GitHub. They are provided
-# by a third-party and are governed by separate terms of service, privacy
-# policy, and support documentation.
-
-name: Scorecard supply-chain security
-on:
-  # For Branch-Protection check. Only the default branch is supported. See
-  # https://github.com/ossf/scorecard/blob/main/docs/checks.md#branch-protection
-  branch_protection_rule:
-  # To guarantee Maintained check is occasionally updated. See
-  # https://github.com/ossf/scorecard/blob/main/docs/checks.md#maintained
-  schedule:
-    - cron: "17 17 * * 6"
-  push:
-    branches: ["main"]
-  workflow_dispatch:
-
-# Declare default permissions as read only.
-permissions: read-all
-
-jobs:
-  analysis:
-    name: Scorecard analysis
-    runs-on: ubuntu-latest
-    permissions:
-      # Needed to upload the results to code-scanning dashboard.
-      security-events: write
-      # Needed to publish results and get a badge (see publish_results below).
-      id-token: write
-      # Add this permission
-      actions: write # Required for artifact upload
-      # Uncomment the permissions below if installing in a private repository.
-      # contents: read
-      # actions: read
-
-    steps:
-      - name: "Checkout code"
-        uses: actions/checkout@b4ffde65f46336ab88eb53be808477a3936bae11 # v4.1.1
-        with:
-          persist-credentials: false
-
-      - name: "Run analysis"
-        uses: ossf/scorecard-action@0864cf19026789058feabb7e87baa5f140aac736 # v2.3.1
-        with:
-          results_file: results.sarif
-          results_format: sarif
-          # (Optional) "write" PAT token. Uncomment the `repo_token` line below if:
-          # - you want to enable the Branch-Protection check on a *public* repository, or
-          # - you are installing Scorecard on a *private* repository
-          # To create the PAT, follow the steps in https://github.com/ossf/scorecard-action?tab=readme-ov-file#authentication-with-fine-grained-pat-optional.
-          # repo_token: ${{ secrets.SCORECARD_TOKEN }}
-
-          # Public repositories:
-          #   - Publish results to OpenSSF REST API for easy access by consumers
-          #   - Allows the repository to include the Scorecard badge.
-          #   - See https://github.com/ossf/scorecard-action#publishing-results.
-          # For private repositories:
-          #   - `publish_results` will always be set to `false`, regardless
-          #     of the value entered here.
-          publish_results: true
-
-      # Upload the results as artifacts (optional). Commenting out will disable uploads of run results in SARIF
-      # format to the repository Actions tab.
-      - name: "Upload artifact"
-        uses: actions/upload-artifact@65c4c4a1ddee5b72f698fdd19549f0f0fb45cf08 # v4.6.0
-        with:
-          name: sarif
-          path: results.sarif
-          retention-days: 5
-
-      # Upload the results to GitHub's code scanning dashboard (optional).
-      # Commenting out will disable upload of results to your repo's Code Scanning dashboard
-      - name: "Upload to code-scanning"
-        uses: github/codeql-action/upload-sarif@v3
-        with:
-          sarif_file: results.sarif

.github/workflows/semantic-pull-requests.yml

@@ -20,20 +20,6 @@ jobs:
         id: lint_pr_title
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-        with:
-          types: |
-            fix
-            feat
-            chore
-            docs
-            style
-            refactor
-            perf
-            test
-            build
-            ci
-            revert
-            ossgg
 
       - uses: marocchino/sticky-pull-request-comment@v2
         # When the previous steps fails, the workflow would stop. By adding this

.github/workflows/sonarqube.yml

@@ -1,52 +0,0 @@
-name: SonarQube
-on:
-  workflow_dispatch:
-  push:
-    branches:
-      - main
-  pull_request:
-    types: [opened, synchronize, reopened]
-permissions:
-  contents: read
-jobs:
-  sonarqube:
-    name: SonarQube
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v4
-        with:
-          fetch-depth: 0 # Shallow clones should be disabled for a better relevancy of analysis
-
-      - name: Setup Node.js 20.x
-        uses: actions/setup-node@39370e3970a6d050c480ffad4ff0ed4d3fdee5af
-        with:
-          node-version: 20.x
-
-      - name: Install pnpm
-        uses: pnpm/action-setup@fe02b34f77f8bc703788d5817da081398fad5dd2
-
-      - name: Install dependencies
-        run: pnpm install --config.platform=linux --config.architecture=x64
-
-      - name: create .env
-        run: cp .env.example .env
-
-      - name: Generate Random ENCRYPTION_KEY, CRON_SECRET & NEXTAUTH_SECRET and fill in .env
-        run: |
-          RANDOM_KEY=$(openssl rand -hex 32)
-          sed -i "s/ENCRYPTION_KEY=.*/ENCRYPTION_KEY=${RANDOM_KEY}/" .env
-          sed -i "s/CRON_SECRET=.*/CRON_SECRET=${RANDOM_KEY}/" .env
-          sed -i "s/NEXTAUTH_SECRET=.*/NEXTAUTH_SECRET=${RANDOM_KEY}/" .env
-
-      - name: Run tests with coverage
-        run: |
-          cd apps/web
-          pnpm test:coverage
-          cd ../../
-          # The Vitest coverage config is in your vite.config.mts
-
-      - name: SonarQube Scan
-        uses: SonarSource/sonarqube-scan-action@bfd4e558cda28cda6b5defafb9232d191be8c203
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} # Needed to get PR information, if any
-          SONAR_TOKEN: ${{ secrets.SONAR_TOKEN }}

.github/workflows/test.yml

@@ -3,23 +3,25 @@ on:
   workflow_call:
 jobs:
   build:
-    name: Unit Tests
+    name: Tests
     runs-on: ubuntu-latest
     timeout-minutes: 15
-    permissions:
-      contents: read
+
+    env:
+      TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
+      TURBO_TEAM: ${{ secrets.TURBO_TEAM }}
 
     steps:
-      - uses: actions/checkout@v3
-      - uses: ./.github/actions/dangerous-git-checkout
+      - name: Checkout repo
+        uses: actions/checkout@v3
 
-      - name: Setup Node.js 20.x
+      - name: Setup Node.js 18.x
         uses: actions/setup-node@v3
         with:
-          node-version: 20.x
+          node-version: 18.x
 
       - name: Install pnpm
-        uses: pnpm/action-setup@v4
+        uses: pnpm/action-setup@v2
 
       - name: Install dependencies
         run: pnpm install --config.platform=linux --config.architecture=x64
@@ -27,12 +29,13 @@ jobs:
       - name: create .env
         run: cp .env.example .env
 
-      - name: Generate Random ENCRYPTION_KEY, CRON_SECRET & NEXTAUTH_SECRET and fill in .env
+      - name: Generate Random ENCRYPTION_KEY
         run: |
-          RANDOM_KEY=$(openssl rand -hex 32)
-          sed -i "s/ENCRYPTION_KEY=.*/ENCRYPTION_KEY=${RANDOM_KEY}/" .env
-          sed -i "s/CRON_SECRET=.*/CRON_SECRET=${RANDOM_KEY}/" .env
-          sed -i "s/NEXTAUTH_SECRET=.*/NEXTAUTH_SECRET=${RANDOM_KEY}/" .env
+          SECRET=$(openssl rand -hex 32)
+          echo "ENCRYPTION_KEY=$SECRET" >> $GITHUB_ENV
+
+      - name: Build formbricks-js dependencies
+        run: pnpm build --filter=js
 
       - name: Test
         run: pnpm test

.github/workflows/tolgee-missing-key-check.yml

@@ -1,39 +0,0 @@
-name: Check Missing Translations
-
-permissions:
-  contents: read
-
-on:
-  workflow_dispatch:
-  pull_request:
-    types: [opened, synchronize, reopened]
-
-jobs:
-  check-missing-translations:
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-
-      - name: Setup Node.js
-        uses: actions/setup-node@v4
-        with:
-          node-version: 18
-
-      - name: Install Tolgee CLI
-        run: npm install -g @tolgee/cli
-
-      - name: Compare Tolgee Keys
-        id: compare
-        run: |
-          tolgee compare --api-key ${{ secrets.TOLGEE_API_KEY }} > compare_output.txt
-          cat compare_output.txt
-
-      - name: Check for Missing Translations
-        run: |
-          if grep -q "new key found" compare_output.txt; then
-            echo "New keys found that may require translations:"
-            exit 1
-          else
-            echo "No new keys found."
-          fi

.github/workflows/tolgee.yml

@@ -1,65 +0,0 @@
-name: Tolgee Tagging on PR Merge
-permissions:
-  contents: read
-
-on:
-  push:
-    branches:
-      - main
-
-jobs:
-  tag-production-keys:
-    name: Tag Production Keys
-    runs-on: ubuntu-latest
-
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-
-      - name: Setup Node.js
-        uses: actions/setup-node@v4
-        with:
-          node-version: 18 # Ensure compatibility with your project
-
-      - name: Install Tolgee CLI
-        run: npm install -g @tolgee/cli
-
-      - name: Tag Production Keys
-        run: |
-          BRANCH_NAME=${GITHUB_REF##*/}
-          npx tolgee tag \
-            --api-key ${{ secrets.TOLGEE_API_KEY }} \
-            --filter-extracted \
-            --filter-tag "draft:${BRANCH_NAME}" \
-            --tag production \
-            --untag "draft:${BRANCH_NAME}"
-
-      - name: Tag unused production keys as Deprecated
-        run: |
-          npx tolgee tag \
-            --api-key ${{ secrets.TOLGEE_API_KEY }} \
-            --filter-not-extracted --filter-tag production \
-            --tag deprecated --untag production
-
-      - name: Tag unused draft:current-branch keys as Deprecated
-        run: |
-          BRANCH_NAME=${GITHUB_REF##*/}
-          npx tolgee tag \
-            --api-key ${{ secrets.TOLGEE_API_KEY }} \
-            --filter-not-extracted --filter-tag "draft:${BRANCH_NAME}" \
-            --tag deprecated --untag "draft:${BRANCH_NAME}"
-
-      - name: Sync with backup
-        run: |
-          npx tolgee sync \
-            --api-key ${{ secrets.TOLGEE_API_KEY }} \
-            --backup ./tolgee-backup \
-            --continue-on-warning \
-            --yes
-
-      - name: Upload backup as artifact
-        uses: actions/upload-artifact@v4
-        with:
-          name: tolgee-backup-${{ github.sha }}
-          path: ./tolgee-backup
-          retention-days: 90

.github/workflows/welcome-new-contributors.yml

@@ -3,7 +3,7 @@ name: "Welcome new contributors"
 on:
   issues:
     types: opened
-  pull_request_target:
+  pull_request:
     types: opened
 
 permissions:
@@ -22,6 +22,6 @@ jobs:
           repo-token: ${{ secrets.GITHUB_TOKEN }}
           pr-message: |-
             Thank you so much for making your first Pull Request and taking the time to improve Formbricks! 🚀🙏❤️
-            Feel free to join the conversation on [Github Discussions](https://github.com/formbricks/formbricks/discussions) if you need any help or have any questions. 😊
+            Feel free to join the conversation at [Discord](https://formbricks.com/discord)
           issue-message: |
             Thank you for opening your first issue! 🙏❤️ One of our team members will review it and get back to you as soon as it possible. 😊

.gitignore

@@ -35,6 +35,9 @@ yarn-error.log*
 !packages/database/.env
 !apps/web/.env
 
+# Prisma generated files
+packages/database/zod
+
 # turbo
 .turbo
 
@@ -48,18 +51,3 @@ Zone.Identifier
 /playwright-report/
 /blob-report/
 /playwright/.cache/
-
-# uploads
-packages/lib/uploads
-
-# Vite Timestamps
-*vite.config.*.timestamp-*
-
-# js compiled assets
-apps/web/public/js
-
-
-packages/database/migrations
-
-# tolgee 
-branch.json

.gitpod.Dockerfile

@@ -0,0 +1,6 @@
+FROM gitpod/workspace-full
+
+# Install custom tools, runtime, etc.
+RUN brew install yq 
+
+RUN pnpm install turbo --global

.gitpod.yml

@@ -0,0 +1,78 @@
+tasks:
+  - name: demo
+    init: |
+      gp sync-await init-install && 
+      bash .gitpod/setup-demo.bash
+    command: |
+      cd apps/demo && 
+      cp .env.example .env &&
+      sed -i -r "s#^(NEXT_PUBLIC_FORMBRICKS_API_HOST=).*#\1 $(gp url 3000)#" .env &&
+      gp sync-await init && 
+      turbo --filter "@formbricks/demo" go
+
+  - name: website
+    command: gp sync-await init && turbo --filter "@formbricks/formbricks-com" dev
+
+  - name: Init Formbricks
+    init: |
+      cp .env.example .env &&
+      bash .gitpod/init.bash && 
+      turbo --filter "@formbricks/js" build && 
+      gp sync-done init-install
+    command: |
+      gp sync-done init && 
+      gp tasks list &&
+      gp ports await 3002 && gp ports await 3000 && gp open apps/demo/.env && gp preview $(gp url 3002) --external
+
+  - name: web
+    init: |
+      gp sync-await init-install && 
+      bash .gitpod/setup-web.bash &&
+      turbo --filter "@formbricks/database" db:down
+    command: |
+      gp sync-await init &&
+      cp .env.example .env &&
+      sed -i -r "s#^(WEBAPP_URL=).*#\1 $(gp url 3000)#" .env &&
+      sed -i -r "s#^(NEXTAUTH_URL=).*#\1 $(gp url 3000)#" .env &&
+      RANDOM_ENCRYPTION_KEY=$(openssl rand -hex 32)
+      sed -i 's/^ENCRYPTION_KEY=.*/ENCRYPTION_KEY='"$RANDOM_ENCRYPTION_KEY"'/' .env
+      turbo --filter "@formbricks/web" go
+
+image:
+  file: .gitpod.Dockerfile
+
+ports:
+  - port: 3000
+    visibility: public
+    onOpen: open-browser
+  - port: 3001
+    visibility: public
+    onOpen: ignore
+  - port: 3002
+    visibility: public
+    onOpen: ignore
+  - port: 5432
+    visibility: public
+    onOpen: ignore
+  - port: 1025
+    visibility: public
+    onOpen: ignore
+  - port: 8025
+    visibility: public
+    onOpen: open-browser
+
+github:
+  prebuilds:
+    master: true
+    pullRequests: true
+    addComment: true
+
+vscode:
+  extensions:
+    - "ban.spellright"
+    - "bradlc.vscode-tailwindcss"
+    - "DavidAnson.vscode-markdownlint"
+    - "dbaeumer.vscode-eslint"
+    - "esbenp.prettier-vscode"
+    - "Prisma.prisma"
+    - "yzhang.markdown-all-in-one"

.husky/post-checkout

@@ -1 +0,0 @@
-echo "{\"branchName\": \"$(git rev-parse --abbrev-ref HEAD)\"}" > ./branch.json

.husky/post-commit

@@ -1 +0,0 @@
-echo "{\"branchName\": \"$(git rev-parse --abbrev-ref HEAD)\"}" > ./branch.json

.husky/pre-commit

@@ -1,17 +1,4 @@
-#!/bin/sh
-. "$(dirname "$0")/_/husky.sh"
-
-# Load environment variables from .env files
-if [ -f .env ]; then
-  export $(cat .env | grep -v '#' | xargs)
-fi
-
-pnpm lint-staged
-
-if [ -z "$NEXT_PUBLIC_TOLGEE_API_KEY" ]; then
-  echo "Skipping tolgee-pull: NEXT_PUBLIC_TOLGEE_API_KEY is not set"
-else
-  pnpm run tolgee-pull
-  git add packages/lib/messages
-fi
+#!/usr/bin/env sh
+. "$(dirname -- "$0")/_/husky.sh"
 
+pnpm lint-staged

.npmrc

@@ -5,5 +5,4 @@ shared-workspace-shrinkwrap = true
 access = public
 enable-pre-post-scripts = true
 legacy-peer-deps=true
-node-linker=hoisted
-save-exact=true
+node-linker=hoisted

.nvmrc

@@ -1 +0,0 @@
-22.1.0

.prettierignore

@@ -1 +0,0 @@
-vercel.json

.prettierrc.js

@@ -1,11 +1,6 @@
-const baseConfig = require("./packages/config-prettier/prettier-preset");
+const baseConfig = require("./packages/prettier-config/prettier-preset");
 
 module.exports = {
   ...baseConfig,
-  plugins: [
-    "@trivago/prettier-plugin-sort-imports",
-    "prettier-plugin-tailwindcss",
-    "prettier-plugin-sort-json",
-  ],
-  jsonRecursiveSort: true,
+  plugins: ["@trivago/prettier-plugin-sort-imports", "prettier-plugin-tailwindcss"],
 };

.tolgeerc.json

@@ -1,35 +0,0 @@
-{
-  "$schema": "https://docs.tolgee.io/cli-schema.json",
-  "format": "JSON_TOLGEE",
-  "patterns": ["./apps/web/**/*.ts?(x)"],
-  "projectId": 10304,
-  "pull": {
-    "path": "./packages/lib/messages"
-  },
-  "push": {
-    "files": [
-      {
-        "language": "en-US",
-        "path": "./packages/lib/messages/en-US.json"
-      },
-      {
-        "language": "de-DE",
-        "path": "./packages/lib/messages/de-DE.json"
-      },
-      {
-        "language": "fr-FR",
-        "path": "./packages/lib/messages/fr-FR.json"
-      },
-      {
-        "language": "pt-BR",
-        "path": "./packages/lib/messages/pt-BR.json"
-      },
-      {
-        "language": "zh-Hant-TW",
-        "path": "./packages/lib/messages/zh-Hant-TW.json"
-      }
-    ],
-    "forceMode": "OVERRIDE"
-  },
-  "strictNamespace": false
-}

.vscode/launch.json

@@ -1,21 +1,21 @@
 {
+  // Use IntelliSense to learn about possible attributes.
+  // Hover to view descriptions of existing attributes.
+  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+  "version": "0.2.0",
   "configurations": [
     {
       "name": "Launch localhost:3002",
-      "reAttach": true,
-      "request": "launch",
       "type": "firefox",
+      "request": "launch",
+      "reAttach": true,
       "url": "http://localhost:3002/",
       "webRoot": "${workspaceFolder}"
     },
     {
       "name": "Attach",
-      "request": "attach",
-      "type": "firefox"
+      "type": "firefox",
+      "request": "attach"
     }
-  ],
-  // Use IntelliSense to learn about possible attributes.
-  // Hover to view descriptions of existing attributes.
-  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
-  "version": "0.2.0"
+  ]
 }

.vscode/settings.json

@@ -1,4 +1,4 @@
 {
-  "typescript.preferences.importModuleSpecifier": "non-relative",
-  "typescript.tsdk": "node_modules/typescript/lib"
+  "typescript.tsdk": "node_modules/typescript/lib",
+  "typescript.preferences.importModuleSpecifier": "non-relative"
 }

CONTRIBUTING.md

@@ -16,15 +16,15 @@ Are you brimming with brilliant ideas? For new features that can elevate Formbri
 
 Ready to dive into the code and make a real impact? Here's your path:
 
-1. **Read our Best Practices**: [It takes 5 minutes](https://formbricks.com/docs/developer-docs/contributing/get-started) but will help you save hours 🤓
+1. **Read our Best Practices**: [It takes 5 minutes](https://formbricks.com/docs/contributing/how-we-code) but will help you save hours 🤓
 
-1. **Fork the Repository:** Fork our repository or use [Gitpod](https://gitpod.io) or use [Github Codespaces](https://github.com/features/codespaces) to get started instantly.
+1. **Fork the Repository:** Fork our repository or use [Gitpod](https://formbricks.com/docs/contributing/gitpod)
 
 1. **Tweak and Transform:** Work your coding magic and apply your changes.
 
 1. **Pull Request Act:** If you're ready to go, craft a new pull request closely following our PR template 🙏
 
-Would you prefer a chat before you dive into a lot of work? [Github Discussions](https://github.com/formbricks/formbricks/discussions) is your harbor. Share your thoughts, and we'll meet you there with open arms. We're responsive and friendly, promise!
+Would you prefer a chat before you dive into a lot of work? Our [Discord server](https://formbricks.com/discord) is your harbor. Share your thoughts, and we'll meet you there with open arms. We're responsive and friendly, promise!
 
 ## 🚀 Aspiring Features
 

LICENSE

@@ -1,9 +1,9 @@
-Copyright (c) 2024 Formbricks GmbH
+Copyright (c) 2023 Formbricks GmbH
 
 Portions of this software are licensed as follows:
 
-- All content that resides under the "apps/web/modules/ee" directory of this repository, if these directories exist, is licensed under the license defined in "apps/web/modules/ee/LICENSE".
-- All content that resides under the "packages/js/", "packages/react-native/" and "packages/api/" directories of this repository, if that directories exist, is licensed under the "MIT" license as defined in the "LICENSE" files of these packages.
+- All content that resides under the "packages/ee/" directory of this repository, if that directory exists, is licensed under the license defined in "packages/ee/LICENSE".
+- All content that resides under the "packages/js/", "packages/errors/" and "packages/api/" directories of this repository, if that directories exist, is licensed under the "MIT" license as defined in the "LICENSE" files of these packages.
 - All third party components incorporated into the Formbricks Software are licensed under the original license provided by the owner of the applicable component.
 - Content outside of the above mentioned directories or restrictions above is available under the "AGPLv3" license as defined below.
 

README.md

@@ -1,48 +1,50 @@
-<div id="top"></div>
+<div  id="top"></div>
 
-<p align="center">Help us grow and star us on Github! ⭐️</p>
+<p  align="center">
 
-<p align="center">
+<a  href="https://formbricks.com">
 
-<a href="https://formbricks.com">
-
-<img width="120" alt="Open Source Privacy First Experience Management Solution Qualtrics Alternative Logo" src="https://github.com/formbricks/formbricks/assets/72809645/0086704f-bee7-4d38-9cc8-fa42ee59e004">
+<img  width="120"  alt="Open Source Privacy First Experience Management Solution Qualtrics Alternative Logo"  src="https://github.com/formbricks/formbricks/assets/72809645/0086704f-bee7-4d38-9cc8-fa42ee59e004">
 
 </a>
 
-<h3 align="center">Formbricks</h3>
+<h3  align="center">Formbricks</h3>
 
-<p align="center">
+<p  align="center">
 Harvest user-insights, build irresistible experiences.
-<br />
-<a href="https://formbricks.com/">Website</a>
+<br  />
+<a  href="https://formbricks.com/">Website</a> | <a  href="https://formbricks.com/discord">Join Discord community</a>
 </p>
 </p>
 
-<p align="center">
-<a href="https://github.com/formbricks/formbricks/blob/main/LICENSE"><img src="https://img.shields.io/badge/License-AGPL-purple" alt="License"></a> <a href="https://github.com/formbricks/formbricks/stargazers"><img src="https://img.shields.io/github/stars/formbricks/formbricks?logo=github" alt="Github Stars"></a>
-<a href="https://news.ycombinator.com/item?id=32303986"><img src="https://img.shields.io/badge/Hacker%20News-122-%23FF6600" alt="Hacker News"></a>
-<a href="[https://www.producthunt.com/products/formbricks](https://www.producthunt.com/posts/formbricks)"><img src="https://img.shields.io/badge/Product%20Hunt-455-orange?logo=producthunt&logoColor=%23fff" alt="Product Hunt"></a>
-<a href="https://github.blog/2023-04-12-github-accelerator-our-first-cohort-and-whats-next/"><img src="https://img.shields.io/badge/2023-blue?logo=github&label=Github%20Accelerator" alt="Github Accelerator"></a>
-<a href="https://github.com/formbricks/formbricks/issues?q=is:issue+is:open+label:%22%F0%9F%99%8B%F0%9F%8F%BB%E2%80%8D%E2%99%82%EF%B8%8Fhelp+wanted%22"><img src="https://img.shields.io/badge/Help%20Wanted-Contribute-blue"></a>
+<p  align="center">
+<a  href="https://github.com/formbricks/formbricks/blob/main/LICENSE"><img  src="https://img.shields.io/badge/License-AGPL-purple"  alt="License"></a> <a  href="https://formbricks.com/discord"><img  src="https://img.shields.io/discord/979077669410979880?label=Discord&logo=discord&logoColor=%23fff"  alt="Join Formbricks Discord"></a> <a  href="https://github.com/formbricks/formbricks/stargazers"><img  src="https://img.shields.io/github/stars/formbricks/formbricks?logo=github"  alt="Github Stars"></a>
+<a  href="https://news.ycombinator.com/item?id=32303986"><img  src="https://img.shields.io/badge/Hacker%20News-122-%23FF6600"  alt="Hacker News"></a>
+<a  href="[https://www.producthunt.com/products/formbricks](https://www.producthunt.com/posts/formbricks)"><img  src="https://img.shields.io/badge/Product%20Hunt-455-orange?logo=producthunt&logoColor=%23fff"  alt="Product Hunt"></a>
+<a  href="https://github.blog/2023-04-12-github-accelerator-our-first-cohort-and-whats-next/"><img  src="https://img.shields.io/badge/2023-blue?logo=github&label=Github%20Accelerator"  alt="Github Accelerator"></a>
+<a  href="https://github.com/formbricks/formbricks/issues?q=is:issue+is:open+label:%22%F0%9F%99%8B%F0%9F%8F%BB%E2%80%8D%E2%99%82%EF%B8%8Fhelp+wanted%22"><img  src="https://img.shields.io/badge/Help%20Wanted-Contribute-blue"></a>
 </p>
 
 <br/>
 
 <div style="background-color:#f8fafc; border-radius:5px;">
-<p align="center">
-<i>Trusted by</i><br/>
-  <img width="867" alt="clients-hi-res" src="https://github.com/formbricks/formbricks/assets/72809645/924d3693-f66a-4063-bb31-6e5789a8175a">
+<p  align="center">
+<i>Trusted by</i>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+<a  href="https://flixbus.com"><img  src="https://github.com/formbricks/formbricks/assets/72809645/d6c91d89-7633-4845-ae1e-03bbd2ce0946"  height="35px"></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+<a  href="https://github.com/calcom/cal.com/"><img  src="https://github.com/formbricks/formbricks/assets/675065/1a8763cf-f47e-4960-90f6-334f6dc12a17#gh-light-mode-only"  height="20px"></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+<a  href="https://github.com/CrowdDotDev/crowd.dev"><img  src="https://github.com/formbricks/formbricks/assets/675065/59b1a4d4-25e4-4ef3-b0bf-4426446fbfd0#gh-light-mode-only"  height="20px"></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+<a  href="https://neverinstall.com/"><img  src="https://github.com/formbricks/formbricks/assets/675065/72e5e37b-8ef7-4340-b06e-f1d12a05330f#gh-light-mode-only"  height="20px"></a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+<a  href="https://clovyr.io/"><img  src="https://github.com/formbricks/formbricks/assets/675065/9291c8df-9aac-423a-a430-a9a581240075"  height="20px"></a>
 </p>
 <div>
 
-<p align="center">
-<a href="https://trendshift.io/repositories/2570" target="_blank"><img src="https://trendshift.io/api/badge/repositories/2570" alt="Trendshift Badge for formbricks/formbricks" style="width: 250px; height: 55px;" width="250" height="55"/></a>
+<p  align="center">
+<a  href="https://trendshift.io/repositories/2570"  target="_blank"><img  src="https://trendshift.io/api/badge/repositories/2570"  alt="Trendshift Badge for formbricks/formbricks"  style="width: 250px; height: 55px;"  width="250"  height="55"/></a>
 </p>
 
 ## ✨ About Formbricks
 
-<img width="1527" alt="formbricks-sneak" src="https://github-production-user-asset-6210df.s3.amazonaws.com/675065/249441967-ccb89ea3-82b4-4bf2-8d2c-528721ec313b.png">
+<img  width="1527"  alt="formbricks-sneak"  src="https://github-production-user-asset-6210df.s3.amazonaws.com/675065/249441967-ccb89ea3-82b4-4bf2-8d2c-528721ec313b.png">
 
 Formbricks provides a free and open source surveying platform. Gather feedback at every point in the user journey with beautiful in-app, website, link and email surveys. Build on top of Formbricks or leverage prebuilt data analysis capabilities.
 
@@ -68,11 +70,11 @@ Formbricks is both a free and open source survey platform - and a privacy-first
 
 - [Contact](#contact-us)
 
-- [Security](#security)
-
 - [License](#license)
 
-<a id="features"></a>
+- [Security](#security)
+
+<a  id="features"></a>
 
 ### Features
 
@@ -84,7 +86,7 @@ Formbricks is both a free and open source survey platform - and a privacy-first
 
 - 🔗 Create shareable **link surveys**.
 
-- 👨‍👩‍👦 Invite your organization members to **collaborate** on your surveys.
+- 👨‍👩‍👦 Invite your team members to **collaborate** on your surveys.
 
 - 🔌 Integrate Formbricks with **Slack, Notion, Zapier, n8n and more**.
 
@@ -106,26 +108,26 @@ Formbricks is both a free and open source survey platform - and a privacy-first
 
 - 🧘‍♂️ [Zod](https://zod.dev/)
 
-- 🐛 [Vitest](https://vitest.dev/)
-
-<a id="getting-started"></a>
+<a  id="getting-started"></a>
 
 ## 🚀 Getting started
 
 We've got several options depending on your need to help you quickly get started with Formbricks.
 
-<a id="cloud-version"></a>
+<a  id="cloud-version"></a>
 
 ### ☁️ Cloud Version
 
 Formbricks has a hosted cloud offering with a generous free plan to get you up and running as quickly as possible. To get started, please visit [formbricks.com](https://app.formbricks.com/auth/signup).
 
-<a id="self-hosted-version"></a>
+<a  id="self-hosted-version"></a>
 
 ### 🐳 Self-hosting Formbricks
 
 Formbricks is available Open-Source under AGPLv3 license. You can host Formbricks on your own servers using Docker without a subscription.
 
+(In the future we may develop additional features that aren't in the free Open-Source version).
+
 If you opt for self-hosting Formbricks, here are a few options to consider:
 
 #### Docker
@@ -140,23 +142,11 @@ You can deploy Formbricks on [Railway](https://railway.app) using the button bel
 
 [![Deploy on Railway](https://railway.app/button.svg)](https://railway.app/new/template/PPDzCd)
 
-##### RepoCloud
+<a  id="development"></a>
 
-Or you can also deploy Formbricks on [RepoCloud](https://repocloud.io) using the button below.
+### 👨‍💻 Development
 
-[![Deploy on RepoCloud](https://d16t0pc4846x52.cloudfront.net/deploy.png)](https://repocloud.io/details/?app_id=254)
-
-##### Zeabur
-
-Or you can also deploy Formbricks on [Zeabur](https://zeabur.com) using the button below.
-
-[![Deploy to Zeabur](https://zeabur.com/button.svg)](https://zeabur.com/templates/G4TUJL)
-
-<a id="development"></a>
-
-## 👨‍💻 Development
-
-### Prerequisites
+#### Prerequisites
 
 Here is what you need to be able to run Formbricks:
 
@@ -166,11 +156,11 @@ Here is what you need to be able to run Formbricks:
 
 - [Docker](https://www.docker.com/) - to run PostgreSQL and MailHog
 
-### Local Setup
+#### Local Setup
 
-To get started locally, we've got a [guide to help you](https://formbricks.com/docs/developer-docs/contributing/get-started#local-machine-setup).
+To get started locally, we've got a [guide to help you](https://formbricks.com/docs/contributing/setup).
 
-### Gitpod Setup
+#### Gitpod Setup
 
 1. Click the button below to open this project in Gitpod.
 
@@ -178,7 +168,7 @@ To get started locally, we've got a [guide to help you](https://formbricks.com/d
 
 [![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/formbricks/formbricks)
 
-<a id="contribution"></a>
+<a  id="contribution"></a>
 
 ## ✍️ Contribution
 
@@ -192,50 +182,34 @@ Here are a few options:
 
 - Upvote issues with 👍 reaction so we know what the demand for a particular issue is to prioritize it within the roadmap.
 
-Please check out [our contribution guide](https://formbricks.com/docs/developer-docs/contributing/get-started) and our [list of open issues](https://github.com/formbricks/formbricks/issues) for more information.
+Please check out [our contribution guide](https://formbricks.com/docs/contributing/introduction) and our [list of open issues](https://github.com/formbricks/formbricks/issues) for more information.
 
 ## All Thanks To Our Contributors
 
-<a href="https://github.com/formbricks/formbricks/graphs/contributors">
+<a  href="https://github.com/formbricks/formbricks/graphs/contributors">
 
-<img src="https://contrib.rocks/image?repo=formbricks/formbricks" />
+<img  src="https://contrib.rocks/image?repo=formbricks/formbricks"  />
 
 </a>
 
-<a id="contact-us"></a>
+<a  id="contact-us"></a>
 
 ## 📆 Contact us
 
 Let's have a chat about your survey needs and get you started.
 
-<a href="https://cal.com/johannes/onboarding?utm_source=banner&utm_campaign=oss"><img alt="Book us with Cal.com" src="https://cal.com/book-with-cal-dark.svg" /></a>
+<a  href="https://cal.com/johannes/onboarding?utm_source=banner&utm_campaign=oss"><img  alt="Book us with Cal.com"  src="https://cal.com/book-with-cal-dark.svg"  /></a>
 
-<a id="license"></a>
+<a  id="license"></a>
 
-<a id="security"></a>
+## ⚖️ License
+
+Distributed under the AGPLv3 License. See [`LICENSE`](./LICENSE) for more information.
+
+<a  id="security"></a>
 
 ## 🔒 Security
 
 We take security very seriously. If you come across any security vulnerabilities, please disclose them by sending an email to security@formbricks.com. We appreciate your help in making our platform as secure as possible and are committed to working with you to resolve any issues quickly and efficiently. See [`SECURITY.md`](./SECURITY.md) for more information.
 
-<a id="license"></a>
-
-## 👩‍⚖️ License
-
-### The AGPL Formbricks Core
-
-The Formbricks core application is licensed under the [AGPLv3 Open Source License](https://github.com/formbricks/formbricks/blob/main/LICENSE). The core application is fully functional and includes everything you need to design & run link surveys, website surveys and in-app surveys. You can use the software for free for personal and commercial use. You're also allowed to create and distribute modified versions as long as you document the changes you make incl. date. The AGPL license requires you to publish your modified version under the AGPLv3 license as well.
-
-### The Enterprise Edition
-
-Additional to the AGPL licensed Formbricks core, this repository contains code licensed under an Enterprise license. The [code](https://github.com/formbricks/formbricks/tree/main/apps/web/modules/ee) and [license](https://github.com/formbricks/formbricks/blob/main/apps/web/modules/ee/LICENSE) for the enterprise functionality can be found in the `/apps/web/modules/ee` folder of this repository. This additional functionality is not part of the AGPLv3 licensed Formbricks core and is designed to meet the needs of larger teams and enterprises. This advanced functionality is already included in the Docker images, but you need an [Enterprise License Key](https://formbricks.com/docs/self-hosting/enterprise) to unlock it.
-
-### White-Labeling Formbricks and Other Licensing Needs
-
-We currently do not offer Formbricks white-labeled. That means that we don't sell a license which let's other companies resell Formbricks to third parties under their name nor take parts (like the survey editor) out of Formbricks to add to their own software products. Any other needs? [Send us an email](mailto:hola@formbricks.com).
-
-### Why charge for Enterprise Features?
-
-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.
-
-<p align="right"><a href="#top">🔼 Back to top</a></p>
+<p  align="right"><a  href="#top">🔼 Back to top</a></p>

SECURITY.md

@@ -1,7 +1,7 @@
 # Security Policy of Formbricks
 
 This is Formbrick's security policy. Please reach out to us
-on Github or, if privately, via <security@formbricks.com>
+on our Discord or, if privately, via <security@formbricks.com>
 
 ## Introduction
 
@@ -40,7 +40,7 @@ We invite you to report if:
 
 Avoid reporting if:
 
-- Assistance is needed to optimize Formbricks for security – please engage on Github Discussions for this.
+- Assistance is needed to optimize Formbricks for security – please engage on our Discord for this.
 - Help is required for applying security-related updates.
 - The concern is not related to security.
 
@@ -51,13 +51,13 @@ In the interest of responsibly managing vulnerabilities, please adhere to the fo
 > Do not reveal the problem to others until it has been resolved.
 
 1. **Send a Detailed Report**:
-   - Raise a security report on [Github](https://github.com/formbricks/formbricks/issues/new/choose) or send an email to [security@formbricks.com](mailto:security@formbricks.com).
+   - Address emails to [security@formbricks.com](mailto:security@formbricks.com).
    - Include:
      - Problem description.
      - Detailed, reproducible steps, with screenshots where possible.
      - Affected version(s).
      - Known possible mitigations.
-     - Your preferred contact method.
+     - Your Discord username or preferred contact method.
 2. **Acknowledgement of Receipt**:
    - Our security team will acknowledge receipt and provide an initial response within 48 hours.
    - Following verification of the vulnerability and the fix, a release plan will be formulated, with the fix deployed between 7 to 28 days, depending on the severity and complexity.

apps/demo-react-native/.env.example

@@ -1,2 +0,0 @@
-EXPO_PUBLIC_APP_URL=http://192.168.0.197:3000
-EXPO_PUBLIC_FORMBRICKS_ENVIRONMENT_ID=cm5p0cs7r000819182b32j0a1

apps/demo-react-native/.eslintrc.js

@@ -1,7 +0,0 @@
-module.exports = {
-  extends: ["@formbricks/eslint-config/react.js"],
-  parserOptions: {
-    project: "tsconfig.json",
-    tsconfigRootDir: __dirname,
-  },
-};

apps/demo-react-native/.gitignore

@@ -1,35 +0,0 @@
-# Learn more https://docs.github.com/en/get-started/getting-started-with-git/ignoring-files
-
-# dependencies
-node_modules/
-
-# Expo
-.expo/
-dist/
-web-build/
-
-# Native
-*.orig.*
-*.jks
-*.p8
-*.p12
-*.key
-*.mobileprovision
-
-# Metro
-.metro-health-check*
-
-# debug
-npm-debug.*
-yarn-debug.*
-yarn-error.*
-
-# macOS
-.DS_Store
-*.pem
-
-# local env files
-.env*.local
-
-# typescript
-*.tsbuildinfo

apps/demo-react-native/app.json

@@ -1,35 +0,0 @@
-{
-  "expo": {
-    "android": {
-      "adaptiveIcon": {
-        "backgroundColor": "#ffffff",
-        "foregroundImage": "./assets/adaptive-icon.png"
-      }
-    },
-    "assetBundlePatterns": ["**/*"],
-    "icon": "./assets/icon.png",
-    "ios": {
-      "infoPlist": {
-        "NSCameraUsageDescription": "Take pictures for certain activities.",
-        "NSMicrophoneUsageDescription": "Need microphone access for recording videos.",
-        "NSPhotoLibraryUsageDescription": "Select pictures for certain activities."
-      },
-      "supportsTablet": true
-    },
-    "jsEngine": "hermes",
-    "name": "react-native-demo",
-    "newArchEnabled": true,
-    "orientation": "portrait",
-    "slug": "react-native-demo",
-    "splash": {
-      "backgroundColor": "#ffffff",
-      "image": "./assets/splash.png",
-      "resizeMode": "contain"
-    },
-    "userInterfaceStyle": "light",
-    "version": "1.0.0",
-    "web": {
-      "favicon": "./assets/favicon.png"
-    }
-  }
-}

apps/demo-react-native/babel.config.js

@@ -1,6 +0,0 @@
-module.exports = function babel(api) {
-  api.cache(true);
-  return {
-    presets: ["babel-preset-expo"],
-  };
-};

apps/demo-react-native/index.js

@@ -1,7 +0,0 @@
-import { registerRootComponent } from "expo";
-import { LogBox } from "react-native";
-import App from "./src/app";
-
-registerRootComponent(App);
-
-LogBox.ignoreAllLogs();

apps/demo-react-native/metro.config.js

@@ -1,21 +0,0 @@
-// Learn more https://docs.expo.io/guides/customizing-metro
-const path = require("node:path");
-const { getDefaultConfig } = require("expo/metro-config");
-
-// Find the workspace root, this can be replaced with `find-yarn-workspace-root`
-const workspaceRoot = path.resolve(__dirname, "../..");
-const projectRoot = __dirname;
-
-const config = getDefaultConfig(projectRoot);
-
-// 1. Watch all files within the monorepo
-config.watchFolders = [workspaceRoot];
-// 2. Let Metro know where to resolve packages, and in what order
-config.resolver.nodeModulesPaths = [
-  path.resolve(projectRoot, "node_modules"),
-  path.resolve(workspaceRoot, "node_modules"),
-];
-// 3. Force Metro to resolve (sub)dependencies only from the `nodeModulesPaths`
-config.resolver.disableHierarchicalLookup = true;
-
-module.exports = config;

apps/demo-react-native/package.json

@@ -1,30 +0,0 @@
-{
-  "name": "@formbricks/demo-react-native",
-  "version": "1.0.0",
-  "main": "./index.js",
-  "scripts": {
-    "dev": "expo start",
-    "android": "expo start --android",
-    "ios": "expo start --ios",
-    "web": "expo start --web",
-    "eject": "expo eject",
-    "clean": "rimraf .turbo node_modules .expo"
-  },
-  "dependencies": {
-    "@formbricks/js": "workspace:*",
-    "@formbricks/react-native": "workspace:*",
-    "@react-native-async-storage/async-storage": "2.1.0",
-    "expo": "52.0.28",
-    "expo-status-bar": "2.0.1",
-    "react": "18.3.1",
-    "react-dom": "18.3.1",
-    "react-native": "0.76.6",
-    "react-native-webview": "13.12.5"
-  },
-  "devDependencies": {
-    "@babel/core": "7.26.0",
-    "@types/react": "18.3.18",
-    "typescript": "5.7.2"
-  },
-  "private": true
-}

apps/demo-react-native/src/app.tsx

@@ -1,117 +0,0 @@
-import { StatusBar } from "expo-status-bar";
-import React, { type JSX } from "react";
-import { Button, LogBox, StyleSheet, Text, View } from "react-native";
-import Formbricks, {
-  logout,
-  setAttribute,
-  setAttributes,
-  setLanguage,
-  setUserId,
-  track,
-} from "@formbricks/react-native";
-
-LogBox.ignoreAllLogs();
-
-export default function App(): JSX.Element {
-  if (!process.env.EXPO_PUBLIC_FORMBRICKS_ENVIRONMENT_ID) {
-    throw new Error("EXPO_PUBLIC_FORMBRICKS_ENVIRONMENT_ID is required");
-  }
-
-  if (!process.env.EXPO_PUBLIC_APP_URL) {
-    throw new Error("EXPO_PUBLIC_APP_URL is required");
-  }
-
-  return (
-    <View style={styles.container}>
-      <Text>Formbricks React Native SDK Demo</Text>
-
-      <View
-        style={{
-          display: "flex",
-          flexDirection: "column",
-          gap: 10,
-        }}>
-        <Button
-          title="Trigger Code Action"
-          onPress={() => {
-            track("code").catch((error: unknown) => {
-              // eslint-disable-next-line no-console -- logging is allowed in demo apps
-              console.error("Error tracking event:", error);
-            });
-          }}
-        />
-
-        <Button
-          title="Set User Id"
-          onPress={() => {
-            setUserId("random-user-id").catch((error: unknown) => {
-              // eslint-disable-next-line no-console -- logging is allowed in demo apps
-              console.error("Error setting user id:", error);
-            });
-          }}
-        />
-
-        <Button
-          title="Set User Attributess (multiple)"
-          onPress={() => {
-            setAttributes({
-              testAttr: "attr-test",
-              testAttr2: "attr-test-2",
-              testAttr3: "attr-test-3",
-              testAttr4: "attr-test-4",
-            }).catch((error: unknown) => {
-              // eslint-disable-next-line no-console -- logging is allowed in demo apps
-              console.error("Error setting user attributes:", error);
-            });
-          }}
-        />
-
-        <Button
-          title="Set User Attributes (single)"
-          onPress={() => {
-            setAttribute("testSingleAttr", "testSingleAttr").catch((error: unknown) => {
-              // eslint-disable-next-line no-console -- logging is allowed in demo apps
-              console.error("Error setting user attributes:", error);
-            });
-          }}
-        />
-
-        <Button
-          title="Logout"
-          onPress={() => {
-            logout().catch((error: unknown) => {
-              // eslint-disable-next-line no-console -- logging is allowed in demo apps
-              console.error("Error logging out:", error);
-            });
-          }}
-        />
-
-        <Button
-          title="Set Language (de)"
-          onPress={() => {
-            setLanguage("de").catch((error: unknown) => {
-              // eslint-disable-next-line no-console -- logging is allowed in demo apps
-              console.error("Error setting language:", error);
-            });
-          }}
-        />
-      </View>
-
-      <StatusBar style="auto" />
-
-      <Formbricks
-        appUrl={process.env.EXPO_PUBLIC_APP_URL as string}
-        environmentId={process.env.EXPO_PUBLIC_FORMBRICKS_ENVIRONMENT_ID as string}
-      />
-    </View>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    backgroundColor: "#fff",
-    alignItems: "center",
-    justifyContent: "center",
-  },
-});

apps/demo-react-native/tsconfig.json

@@ -1,6 +0,0 @@
-{
-  "compilerOptions": {
-    "strict": true
-  },
-  "extends": "expo/tsconfig.base"
-}

apps/demo/.eslintrc.js

@@ -1,7 +1,4 @@
 module.exports = {
-  extends: ["@formbricks/eslint-config/next.js"],
-  parserOptions: {
-    project: "tsconfig.json",
-    tsconfigRootDir: __dirname,
-  },
+  root: true,
+  extends: ["formbricks"],
 };

apps/demo/components/LayoutApp.tsx

@@ -0,0 +1,13 @@
+import Sidebar from "./Sidebar";
+
+export default function LayoutApp({ children }: { children: React.ReactNode }) {
+  return (
+    <div className="min-h-full">
+      {/* Static sidebar for desktop */}
+      <div className="hidden lg:fixed lg:inset-y-0 lg:flex lg:w-64 lg:flex-col">
+        <Sidebar />
+      </div>
+      <div className="flex flex-1 flex-col lg:pl-64">{children}</div>
+    </div>
+  );
+}

apps/demo/components/Sidebar.tsx

@@ -0,0 +1,65 @@
+import { classNames } from "@/lib/utils";
+import {
+  ClockIcon,
+  CogIcon,
+  CreditCardIcon,
+  DocumentChartBarIcon,
+  HomeIcon,
+  QuestionMarkCircleIcon,
+  ScaleIcon,
+  ShieldCheckIcon,
+  UserGroupIcon,
+} from "@heroicons/react/24/outline";
+
+const navigation = [
+  { name: "Home", href: "#", icon: HomeIcon, current: true },
+  { name: "History", href: "#", icon: ClockIcon, current: false },
+  { name: "Balances", href: "#", icon: ScaleIcon, current: false },
+  { name: "Cards", href: "#", icon: CreditCardIcon, current: false },
+  { name: "Recipients", href: "#", icon: UserGroupIcon, current: false },
+  { name: "Reports", href: "#", icon: DocumentChartBarIcon, current: false },
+];
+const secondaryNavigation = [
+  { name: "Settings", href: "#", icon: CogIcon },
+  { name: "Help", href: "#", icon: QuestionMarkCircleIcon },
+  { name: "Privacy", href: "#", icon: ShieldCheckIcon },
+];
+
+export default function Sidebar({}) {
+  return (
+    <div className="flex flex-grow flex-col overflow-y-auto bg-cyan-700 pb-4 pt-5">
+      <nav
+        className="mt-5 flex flex-1 flex-col divide-y divide-cyan-800 overflow-y-auto"
+        aria-label="Sidebar">
+        <div className="space-y-1 px-2">
+          {navigation.map((item) => (
+            <a
+              key={item.name}
+              href={item.href}
+              className={classNames(
+                item.current ? "bg-cyan-800 text-white" : "text-cyan-100 hover:bg-cyan-600 hover:text-white",
+                "group flex items-center rounded-md px-2 py-2 text-sm font-medium leading-6"
+              )}
+              aria-current={item.current ? "page" : undefined}>
+              <item.icon className="mr-4 h-6 w-6 flex-shrink-0 text-cyan-200" aria-hidden="true" />
+              {item.name}
+            </a>
+          ))}
+        </div>
+        <div className="mt-6 pt-6">
+          <div className="space-y-1 px-2">
+            {secondaryNavigation.map((item) => (
+              <a
+                key={item.name}
+                href={item.href}
+                className="group flex items-center rounded-md px-2 py-2 text-sm font-medium leading-6 text-cyan-100 hover:bg-cyan-600 hover:text-white">
+                <item.icon className="mr-4 h-6 w-6 text-cyan-200" aria-hidden="true" />
+                {item.name}
+              </a>
+            ))}
+          </div>
+        </div>
+      </nav>
+    </div>
+  );
+}

apps/demo/components/layout-app.tsx

@@ -1,13 +0,0 @@
-import { Sidebar } from "./sidebar";
-
-export function LayoutApp({ children }: { children: React.ReactNode }): React.JSX.Element {
-  return (
-    <div className="min-h-full">
-      {/* Static sidebar for desktop */}
-      <div className="hidden lg:fixed lg:inset-y-0 lg:flex lg:w-64 lg:flex-col">
-        <Sidebar />
-      </div>
-      <div className="flex flex-1 flex-col lg:pl-64">{children}</div>
-    </div>
-  );
-}

apps/demo/components/sidebar.tsx

@@ -1,65 +0,0 @@
-import {
-  ClockIcon,
-  CogIcon,
-  CreditCardIcon,
-  FileBarChartIcon,
-  HelpCircleIcon,
-  HomeIcon,
-  ScaleIcon,
-  ShieldCheckIcon,
-  UsersIcon,
-} from "lucide-react";
-import { classNames } from "../lib/utils";
-
-const navigation = [
-  { name: "Home", href: "#", icon: HomeIcon, current: true },
-  { name: "History", href: "#", icon: ClockIcon, current: false },
-  { name: "Balances", href: "#", icon: ScaleIcon, current: false },
-  { name: "Cards", href: "#", icon: CreditCardIcon, current: false },
-  { name: "Recipients", href: "#", icon: UsersIcon, current: false },
-  { name: "Reports", href: "#", icon: FileBarChartIcon, current: false },
-];
-const secondaryNavigation = [
-  { name: "Settings", href: "#", icon: CogIcon },
-  { name: "Help", href: "#", icon: HelpCircleIcon },
-  { name: "Privacy", href: "#", icon: ShieldCheckIcon },
-];
-
-export function Sidebar(): React.JSX.Element {
-  return (
-    <div className="flex flex-grow flex-col overflow-y-auto bg-cyan-700 pb-4 pt-5">
-      <nav
-        className="mt-5 flex flex-1 flex-col divide-y divide-cyan-800 overflow-y-auto"
-        aria-label="Sidebar">
-        <div className="space-y-1 px-2">
-          {navigation.map((item) => (
-            <a
-              key={item.name}
-              href={item.href}
-              className={classNames(
-                item.current ? "bg-cyan-800 text-white" : "text-cyan-100 hover:bg-cyan-600 hover:text-white",
-                "group flex items-center rounded-md px-2 py-2 text-sm font-medium leading-6"
-              )}
-              aria-current={item.current ? "page" : undefined}>
-              <item.icon className="mr-4 h-6 w-6 flex-shrink-0 text-cyan-200" aria-hidden="true" />
-              {item.name}
-            </a>
-          ))}
-        </div>
-        <div className="mt-6 pt-6">
-          <div className="space-y-1 px-2">
-            {secondaryNavigation.map((item) => (
-              <a
-                key={item.name}
-                href={item.href}
-                className="group flex items-center rounded-md px-2 py-2 text-sm font-medium leading-6 text-cyan-100 hover:bg-cyan-600 hover:text-white">
-                <item.icon className="mr-4 h-6 w-6 text-cyan-200" aria-hidden="true" />
-                {item.name}
-              </a>
-            ))}
-          </div>
-        </div>
-      </nav>
-    </div>
-  );
-}

apps/demo/globals.css

@@ -1,3 +0,0 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;

apps/demo/lib/utils.ts

@@ -1,3 +1,3 @@
-export function classNames(...classes: string[]): string {
+export function classNames(...classes: any) {
   return classes.filter(Boolean).join(" ");
 }

apps/demo/next-env.d.ts

@@ -2,4 +2,4 @@
 /// <reference types="next/image-types/global" />
 
 // NOTE: This file should not be edited
-// see https://nextjs.org/docs/pages/api-reference/config/typescript for more information.
+// see https://nextjs.org/docs/basic-features/typescript for more information.

apps/demo/next.config.js

@@ -0,0 +1,27 @@
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  reactStrictMode: true,
+  async redirects() {
+    return [
+      {
+        source: "/",
+        destination: "/app",
+        permanent: false,
+      },
+    ];
+  },
+  images: {
+    remotePatterns: [
+      {
+        protocol: "https",
+        hostname: "tailwindui.com",
+      },
+      {
+        protocol: "https",
+        hostname: "images.unsplash.com",
+      },
+    ],
+  },
+};
+
+module.exports = nextConfig;

apps/demo/next.config.mjs

@@ -1,17 +0,0 @@
-/** @type {import('next').NextConfig} */
-const nextConfig = {
-  images: {
-    remotePatterns: [
-      {
-        protocol: "https",
-        hostname: "tailwindui.com",
-      },
-      {
-        protocol: "https",
-        hostname: "images.unsplash.com",
-      },
-    ],
-  },
-};
-
-export default nextConfig;

apps/demo/package.json

@@ -4,21 +4,20 @@
   "private": true,
   "scripts": {
     "clean": "rimraf .turbo node_modules .next",
-    "dev": "next dev -p 3002 --turbopack",
-    "go": "next dev -p 3002 --turbopack",
+    "dev": "next dev -p 3002 --turbo",
+    "go": "next dev -p 3002",
     "build": "next build",
     "start": "next start",
     "lint": "next lint"
   },
   "dependencies": {
     "@formbricks/js": "workspace:*",
-    "lucide-react": "0.468.0",
-    "next": "15.1.2",
-    "react": "19.0.0",
-    "react-dom": "19.0.0"
+    "@heroicons/react": "^2.1.1",
+    "next": "14.0.4",
+    "react": "18.2.0",
+    "react-dom": "18.2.0"
   },
   "devDependencies": {
-    "@formbricks/config-typescript": "workspace:*",
-    "@formbricks/eslint-config": "workspace:*"
+    "eslint-config-formbricks": "workspace:*"
   }
 }

apps/demo/pages/_app.tsx

@@ -1,8 +1,9 @@
 import type { AppProps } from "next/app";
 import Head from "next/head";
-import "../globals.css";
 
-export default function App({ Component, pageProps }: AppProps): React.JSX.Element {
+import "../styles/globals.css";
+
+export default function App({ Component, pageProps }: AppProps) {
   return (
     <>
       <Head>

apps/demo/pages/_document.tsx

@@ -1,8 +1,8 @@
 import { Head, Html, Main, NextScript } from "next/document";
 
-export default function Document(): React.JSX.Element {
+export default function Document() {
   return (
-    <Html lang="en" className="h-full bg-slate-50">
+    <Html lang="en" className="h-full bg-gray-50">
       <Head />
       <body className="h-full">
         <Main />

apps/demo/pages/app/index.tsx

@@ -0,0 +1,277 @@
+import Image from "next/image";
+import { useRouter } from "next/router";
+import { useEffect, useState } from "react";
+
+import formbricks from "@formbricks/js";
+
+import fbsetup from "../../public/fb-setup.png";
+
+declare const window: any;
+
+export default function AppPage({}) {
+  const [darkMode, setDarkMode] = useState(false);
+  const router = useRouter();
+
+  useEffect(() => {
+    if (darkMode) {
+      document.body.classList.add("dark");
+    } else {
+      document.body.classList.remove("dark");
+    }
+  }, [darkMode]);
+
+  useEffect(() => {
+    if (process.env.NEXT_PUBLIC_FORMBRICKS_ENVIRONMENT_ID && process.env.NEXT_PUBLIC_FORMBRICKS_API_HOST) {
+      const isUserId = window.location.href.includes("userId=true");
+      const userId = isUserId ? "THIS-IS-A-VERY-LONG-USER-ID-FOR-TESTING" : undefined;
+      const attributes = isUserId ? { "Init Attribute 1": "eight", "Init Attribute 2": "two" } : undefined;
+      formbricks.init({
+        environmentId: process.env.NEXT_PUBLIC_FORMBRICKS_ENVIRONMENT_ID,
+        apiHost: process.env.NEXT_PUBLIC_FORMBRICKS_API_HOST,
+        userId,
+        debug: true,
+        attributes,
+      });
+      window.formbricks = formbricks;
+    }
+
+    // Connect next.js router to Formbricks
+    if (process.env.NEXT_PUBLIC_FORMBRICKS_ENVIRONMENT_ID && process.env.NEXT_PUBLIC_FORMBRICKS_API_HOST) {
+      const handleRouteChange = formbricks?.registerRouteChange;
+      router.events.on("routeChangeComplete", handleRouteChange);
+
+      return () => {
+        router.events.off("routeChangeComplete", handleRouteChange);
+      };
+    }
+  });
+
+  return (
+    <div className="h-screen bg-white px-12 py-6 dark:bg-slate-800">
+      <div className="flex flex-col justify-between md:flex-row">
+        <div>
+          <h1 className="text-2xl font-bold text-slate-900 dark:text-white">
+            Formbricks In-product Survey Demo App
+          </h1>
+          <p className="text-slate-700 dark:text-slate-300">
+            This app helps you test your in-app surveys. You can create and test user actions, create and
+            update user attributes, etc.
+          </p>
+        </div>
+        <button
+          className="mt-2 rounded-lg bg-slate-200 px-6 py-1 dark:bg-slate-700 dark:text-slate-100"
+          onClick={() => setDarkMode(!darkMode)}>
+          {darkMode ? "Toggle Light Mode" : "Toggle Dark Mode"}
+        </button>
+      </div>
+
+      <div className="my-4 grid grid-cols-1 gap-6 md:grid-cols-2">
+        <div>
+          <div className="rounded-lg border border-slate-300 bg-slate-100 p-6 dark:border-slate-600 dark:bg-slate-900">
+            <h3 className="text-lg font-semibold text-slate-900 dark:text-white">1. Setup .env</h3>
+            <p className="text-slate-700 dark:text-slate-300">
+              Copy the environment ID of your Formbricks app to the env variable in demo/.env
+            </p>
+            <Image src={fbsetup} alt="fb setup" className="mt-4 rounded" priority />
+
+            <div className="mt-4 flex-col items-start text-sm text-slate-700 sm:flex sm:items-center sm:text-base dark:text-slate-300">
+              <p className="mb-1 sm:mb-0 sm:mr-2">You&apos;re connected with env:</p>
+              <div className="flex items-center">
+                <strong className="w-32 truncate sm:w-auto">
+                  {process.env.NEXT_PUBLIC_FORMBRICKS_ENVIRONMENT_ID}
+                </strong>
+                <span className="relative ml-2 flex h-3 w-3">
+                  <span className="absolute inline-flex h-full w-full animate-ping rounded-full bg-green-400 opacity-75"></span>
+                  <span className="relative inline-flex h-3 w-3 rounded-full bg-green-500"></span>
+                </span>
+              </div>
+            </div>
+          </div>
+          <div className="mt-4 rounded-lg border border-slate-300 bg-slate-100 p-6 dark:border-slate-600 dark:bg-slate-900">
+            <h3 className="text-lg font-semibold text-slate-900 dark:text-white">2. Widget Logs</h3>
+            <p className="text-slate-700 dark:text-slate-300">
+              Look at the logs to understand how the widget works.{" "}
+              <strong className="dark:text-white">Open your browser console</strong> to see the logs.
+            </p>
+            {/* <div className="max-h-[40vh] overflow-y-auto py-4">
+              <LogsContainer />
+            </div> */}
+          </div>
+        </div>
+
+        <div className="md:grid md:grid-cols-3">
+          <div className="col-span-3 rounded-lg border border-slate-300 bg-slate-100 p-6 dark:border-gray-600 dark:bg-gray-800">
+            <h3 className="text-lg font-semibold dark:text-white">
+              Reset person / pull data from Formbricks app
+            </h3>
+            <p className="text-slate-700 dark:text-gray-300">
+              On formbricks.reset() a few things happen: <strong>New person is created</strong> and{" "}
+              <strong>surveys & no-code actions are pulled from Formbricks:</strong>.
+            </p>
+            <button
+              className="my-4 rounded-lg bg-slate-500 px-6 py-3 text-white hover:bg-slate-700 dark:bg-gray-700 dark:hover:bg-gray-600"
+              onClick={() => {
+                formbricks.reset();
+              }}>
+              Reset
+            </button>
+            <p className="text-xs text-slate-700 dark:text-gray-300">
+              If you made a change in Formbricks app and it does not seem to work, hit &apos;Reset&apos; and
+              try again.
+            </p>
+          </div>
+
+          <div className="p-6">
+            <div>
+              <button
+                className="mb-4 rounded-lg bg-slate-800 px-6 py-3 text-white hover:bg-slate-700 dark:bg-gray-700 dark:hover:bg-gray-600"
+                onClick={() => {
+                  formbricks.track("Code Action");
+                }}>
+                Code Action
+              </button>
+            </div>
+            <div>
+              <p className="text-xs text-slate-700 dark:text-gray-300">
+                This button sends a{" "}
+                <a href="https://formbricks.com/docs/actions/code" className="underline" target="_blank">
+                  Code Action
+                </a>{" "}
+                to the Formbricks API called &apos;Code Action&apos;. You will find it in the Actions Tab.
+              </p>
+            </div>
+          </div>
+          <div className="p-6">
+            <div>
+              <button className="mb-4 rounded-lg bg-slate-800 px-6 py-3 text-white hover:bg-slate-700  dark:bg-gray-700 dark:hover:bg-gray-600">
+                No-Code Action
+              </button>
+            </div>
+            <div>
+              <p className="text-xs text-slate-700 dark:text-gray-300">
+                This button sends a{" "}
+                <a
+                  href="https://formbricks.com/docs/actions/no-code"
+                  className="underline dark:text-blue-500"
+                  target="_blank">
+                  No Code Action
+                </a>{" "}
+                as long as you created it beforehand in the Formbricks App.{" "}
+                <a
+                  href="https://formbricks.com/docs/actions/no-code"
+                  target="_blank"
+                  className="underline dark:text-blue-500">
+                  Here are instructions on how to do it.
+                </a>
+              </p>
+            </div>
+          </div>
+          <div className="p-6">
+            <div>
+              <button
+                onClick={() => {
+                  formbricks.setAttribute("Plan", "Free");
+                }}
+                className="mb-4 rounded-lg bg-slate-800 px-6 py-3 text-white hover:bg-slate-700  dark:bg-gray-700 dark:hover:bg-gray-600">
+                Set Plan to &apos;Free&apos;
+              </button>
+            </div>
+            <div>
+              <p className="text-xs text-slate-700 dark:text-gray-300">
+                This button sets the{" "}
+                <a
+                  href="https://formbricks.com/docs/attributes/custom-attributes"
+                  target="_blank"
+                  className="underline dark:text-blue-500">
+                  attribute
+                </a>{" "}
+                &apos;Plan&apos; to &apos;Free&apos;. If the attribute does not exist, it creates it.
+              </p>
+            </div>
+          </div>
+          <div className="p-6">
+            <div>
+              <button
+                onClick={() => {
+                  formbricks.setAttribute("Plan", "Paid");
+                }}
+                className="mb-4 rounded-lg bg-slate-800 px-6 py-3 text-white hover:bg-slate-700  dark:bg-gray-700 dark:hover:bg-gray-600">
+                Set Plan to &apos;Paid&apos;
+              </button>
+            </div>
+            <div>
+              <p className="text-xs text-slate-700 dark:text-gray-300">
+                This button sets the{" "}
+                <a
+                  href="https://formbricks.com/docs/attributes/custom-attributes"
+                  target="_blank"
+                  className="underline dark:text-blue-500">
+                  attribute
+                </a>{" "}
+                &apos;Plan&apos; to &apos;Paid&apos;. If the attribute does not exist, it creates it.
+              </p>
+            </div>
+          </div>
+          <div className="p-6">
+            <div>
+              <button
+                onClick={() => {
+                  formbricks.setEmail("test@web.com");
+                }}
+                className="mb-4 rounded-lg bg-slate-800 px-6 py-3 text-white hover:bg-slate-700  dark:bg-gray-700 dark:hover:bg-gray-600">
+                Set Email
+              </button>
+            </div>
+            <div>
+              <p className="text-xs text-slate-700 dark:text-gray-300">
+                This button sets the{" "}
+                <a
+                  href="https://formbricks.com/docs/attributes/identify-users"
+                  target="_blank"
+                  className="underline dark:text-blue-500">
+                  user email
+                </a>{" "}
+                &apos;test@web.com&apos;
+              </p>
+            </div>
+          </div>
+          <div className="p-6">
+            {router.query.userId === "true" ? (
+              <div>
+                <button
+                  onClick={() => {
+                    window.location.href = "/app";
+                  }}
+                  className="mb-4 rounded-lg bg-slate-800 px-6 py-3 text-white hover:bg-slate-700  dark:bg-gray-700 dark:hover:bg-gray-600">
+                  Deactivate User Identification
+                </button>
+              </div>
+            ) : (
+              <div>
+                <button
+                  onClick={() => {
+                    window.location.href = "/app?userId=true";
+                  }}
+                  className="mb-4 rounded-lg bg-slate-800 px-6 py-3 text-white hover:bg-slate-700  dark:bg-gray-700 dark:hover:bg-gray-600">
+                  Activate User Identification
+                </button>
+              </div>
+            )}
+            <div>
+              <p className="text-xs text-slate-700 dark:text-gray-300">
+                This button activates/deactivates{" "}
+                <a
+                  href="https://formbricks.com/docs/attributes/identify-users"
+                  target="_blank"
+                  className="underline dark:text-blue-500">
+                  user identification
+                </a>{" "}
+                with the userId &apos;THIS-IS-A-VERY-LONG-USER-ID-FOR-TESTING&apos;
+              </p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}

apps/demo/pages/index.tsx

@@ -1,257 +0,0 @@
-import Image from "next/image";
-import { useRouter } from "next/router";
-import { useEffect, useState } from "react";
-import formbricks from "@formbricks/js";
-import fbsetup from "../public/fb-setup.png";
-
-declare const window: Window;
-
-export default function AppPage(): React.JSX.Element {
-  const [darkMode, setDarkMode] = useState(false);
-  const router = useRouter();
-
-  useEffect(() => {
-    if (darkMode) {
-      document.body.classList.add("dark");
-    } else {
-      document.body.classList.remove("dark");
-    }
-  }, [darkMode]);
-
-  useEffect(() => {
-    const initFormbricks = () => {
-      // enable Formbricks debug mode by adding formbricksDebug=true GET parameter
-      const addFormbricksDebugParam = (): void => {
-        const urlParams = new URLSearchParams(window.location.search);
-        if (!urlParams.has("formbricksDebug")) {
-          urlParams.set("formbricksDebug", "true");
-          const newUrl = `${window.location.pathname}?${urlParams.toString()}`;
-          window.history.replaceState({}, "", newUrl);
-        }
-      };
-
-      addFormbricksDebugParam();
-
-      if (process.env.NEXT_PUBLIC_FORMBRICKS_ENVIRONMENT_ID && process.env.NEXT_PUBLIC_FORMBRICKS_API_HOST) {
-        const userId = "THIS-IS-A-VERY-LONG-USER-ID-FOR-TESTING";
-        const userInitAttributes = {
-          language: "de",
-          "Init Attribute 1": "eight",
-          "Init Attribute 2": "two",
-        };
-
-        void formbricks.init({
-          environmentId: process.env.NEXT_PUBLIC_FORMBRICKS_ENVIRONMENT_ID,
-          apiHost: process.env.NEXT_PUBLIC_FORMBRICKS_API_HOST,
-          userId,
-          attributes: userInitAttributes,
-        });
-      }
-
-      // Connect next.js router to Formbricks
-      if (process.env.NEXT_PUBLIC_FORMBRICKS_ENVIRONMENT_ID && process.env.NEXT_PUBLIC_FORMBRICKS_API_HOST) {
-        const handleRouteChange = formbricks.registerRouteChange;
-
-        router.events.on("routeChangeComplete", () => {
-          void handleRouteChange();
-        });
-
-        return () => {
-          router.events.off("routeChangeComplete", () => {
-            void handleRouteChange();
-          });
-        };
-      }
-    };
-
-    initFormbricks();
-  }, [router.events]);
-
-  return (
-    <div className="min-h-screen bg-white px-12 py-6 dark:bg-slate-800">
-      <div className="flex flex-col justify-between md:flex-row">
-        <div className="flex flex-col items-center gap-2 sm:flex-row">
-          <div>
-            <h1 className="text-2xl font-bold text-slate-900 dark:text-white">
-              Formbricks In-product Survey Demo App
-            </h1>
-            <p className="text-slate-700 dark:text-slate-300">
-              This app helps you test your app surveys. You can create and test user actions, create and
-              update user attributes, etc.
-            </p>
-          </div>
-        </div>
-
-        <button
-          type="button"
-          className="mt-2 rounded-lg bg-slate-200 px-6 py-1 dark:bg-slate-700 dark:text-slate-100"
-          onClick={() => {
-            setDarkMode(!darkMode);
-          }}>
-          {darkMode ? "Toggle Light Mode" : "Toggle Dark Mode"}
-        </button>
-      </div>
-
-      <div className="my-4 grid grid-cols-1 gap-6 md:grid-cols-2">
-        <div>
-          <div className="rounded-lg border border-slate-300 bg-slate-100 p-6 dark:border-slate-600 dark:bg-slate-900">
-            <h3 className="text-lg font-semibold text-slate-900 dark:text-white">1. Setup .env</h3>
-            <p className="text-slate-700 dark:text-slate-300">
-              Copy the environment ID of your Formbricks app to the env variable in /apps/demo/.env
-            </p>
-            <Image src={fbsetup} alt="fb setup" className="mt-4 rounded" priority />
-
-            <div className="mt-4 flex-col items-start text-sm text-slate-700 sm:flex sm:items-center sm:text-base dark:text-slate-300">
-              <p className="mb-1 sm:mb-0 sm:mr-2">You&apos;re connected with env:</p>
-              <div className="flex items-center">
-                <strong className="w-32 truncate sm:w-auto">
-                  {process.env.NEXT_PUBLIC_FORMBRICKS_ENVIRONMENT_ID}
-                </strong>
-                <span className="relative ml-2 flex h-3 w-3">
-                  <span className="absolute inline-flex h-full w-full animate-ping rounded-full bg-green-500 opacity-75" />
-                  <span className="relative inline-flex h-3 w-3 rounded-full bg-green-500" />
-                </span>
-              </div>
-            </div>
-          </div>
-          <div className="mt-4 rounded-lg border border-slate-300 bg-slate-100 p-6 dark:border-slate-600 dark:bg-slate-900">
-            <h3 className="text-lg font-semibold text-slate-900 dark:text-white">2. Widget Logs</h3>
-            <p className="text-slate-700 dark:text-slate-300">
-              Look at the logs to understand how the widget works.{" "}
-              <strong className="dark:text-white">Open your browser console</strong> to see the logs.
-            </p>
-          </div>
-        </div>
-
-        <div className="md:grid md:grid-cols-3">
-          <div className="col-span-3 self-start rounded-lg border border-slate-300 bg-slate-100 p-6 dark:border-slate-600 dark:bg-slate-900">
-            <h3 className="text-lg font-semibold dark:text-white">
-              Reset person / pull data from Formbricks app
-            </h3>
-            <p className="text-slate-700 dark:text-slate-300">
-              On formbricks.reset() the local state will <strong>be deleted</strong> and formbricks gets{" "}
-              <strong>reinitialized</strong>.
-            </p>
-            <button
-              className="my-4 rounded-lg bg-slate-500 px-6 py-3 text-white hover:bg-slate-700 dark:bg-slate-700 dark:hover:bg-slate-600"
-              type="button"
-              onClick={() => {
-                void formbricks.reset();
-              }}>
-              Reset
-            </button>
-            <p className="text-xs text-slate-700 dark:text-slate-300">
-              If you made a change in Formbricks app and it does not seem to work, hit &apos;Reset&apos; and
-              try again.
-            </p>
-          </div>
-
-          <div className="p-6">
-            <div>
-              <button
-                type="button"
-                className="mb-4 rounded-lg bg-slate-800 px-6 py-3 text-white hover:bg-slate-700 dark:bg-slate-700 dark:hover:bg-slate-600">
-                No-Code Action
-              </button>
-            </div>
-            <div>
-              <p className="text-xs text-slate-700 dark:text-slate-300">
-                This button sends a{" "}
-                <a
-                  href="https://formbricks.com/docs/actions/no-code"
-                  rel="noopener noreferrer"
-                  className="underline dark:text-blue-500"
-                  target="_blank">
-                  No Code Action
-                </a>{" "}
-                as long as you created it beforehand in the Formbricks App.{" "}
-                <a
-                  href="https://formbricks.com/docs/actions/no-code"
-                  rel="noopener noreferrer"
-                  target="_blank"
-                  className="underline dark:text-blue-500">
-                  Here are instructions on how to do it.
-                </a>
-              </p>
-            </div>
-          </div>
-          <div className="p-6">
-            <div>
-              <button
-                type="button"
-                onClick={() => {
-                  void formbricks.setAttribute("Plan", "Free");
-                }}
-                className="mb-4 rounded-lg bg-slate-800 px-6 py-3 text-white hover:bg-slate-700 dark:bg-slate-700 dark:hover:bg-slate-600">
-                Set Plan to &apos;Free&apos;
-              </button>
-            </div>
-            <div>
-              <p className="text-xs text-slate-700 dark:text-slate-300">
-                This button sets the{" "}
-                <a
-                  href="https://formbricks.com/docs/attributes/custom-attributes"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="underline dark:text-blue-500">
-                  attribute
-                </a>{" "}
-                &apos;Plan&apos; to &apos;Free&apos;. If the attribute does not exist, it creates it.
-              </p>
-            </div>
-          </div>
-          <div className="p-6">
-            <div>
-              <button
-                type="button"
-                onClick={() => {
-                  void formbricks.setAttribute("Plan", "Paid");
-                }}
-                className="mb-4 rounded-lg bg-slate-800 px-6 py-3 text-white hover:bg-slate-700 dark:bg-slate-700 dark:hover:bg-slate-600">
-                Set Plan to &apos;Paid&apos;
-              </button>
-            </div>
-            <div>
-              <p className="text-xs text-slate-700 dark:text-slate-300">
-                This button sets the{" "}
-                <a
-                  href="https://formbricks.com/docs/attributes/custom-attributes"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="underline dark:text-blue-500">
-                  attribute
-                </a>{" "}
-                &apos;Plan&apos; to &apos;Paid&apos;. If the attribute does not exist, it creates it.
-              </p>
-            </div>
-          </div>
-          <div className="p-6">
-            <div>
-              <button
-                type="button"
-                onClick={() => {
-                  void formbricks.setEmail("test@web.com");
-                }}
-                className="mb-4 rounded-lg bg-slate-800 px-6 py-3 text-white hover:bg-slate-700 dark:bg-slate-700 dark:hover:bg-slate-600">
-                Set Email
-              </button>
-            </div>
-            <div>
-              <p className="text-xs text-slate-700 dark:text-slate-300">
-                This button sets the{" "}
-                <a
-                  href="https://formbricks.com/docs/attributes/identify-users"
-                  target="_blank"
-                  rel="noopener noreferrer"
-                  className="underline dark:text-blue-500">
-                  user email
-                </a>{" "}
-                &apos;test@web.com&apos;
-              </p>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  );
-}

apps/demo/postcss.config.js

@@ -3,4 +3,4 @@ module.exports = {
     tailwindcss: {},
     autoprefixer: {},
   },
-};
+}

apps/demo/styles/globals.css

@@ -0,0 +1,26 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+/* Example on overriding packages/js colors */
+.dark {
+  --fb-brand-color: red;
+  --fb-brand-text-color: white;
+  --fb-border-color: green;
+  --fb-border-color-highlight: var(--slate-500);
+  --fb-focus-color: red;
+  --fb-heading-color: yellow;
+  --fb-subheading-color: green;
+  --fb-info-text-color: orange;
+  --fb-signature-text-color: blue;
+  --fb-survey-background-color: black;
+  --fb-accent-background-color: rgb(13, 13, 12);
+  --fb-accent-background-color-selected: red;
+  --fb-placeholder-color: white;
+  --fb-shadow-color: yellow;
+  --fb-rating-fill: var(--yellow-300);
+  --fb-rating-hover: var(--yellow-500);
+  --fb-back-btn-border: currentColor;
+  --fb-submit-btn-border: transparent;
+  --fb-rating-selected: black;
+}

apps/demo/tsconfig.json

@@ -1,5 +1,23 @@
 {
-  "exclude": ["node_modules"],
-  "extends": "@formbricks/config-typescript/nextjs.json",
-  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"]
+  "compilerOptions": {
+    "target": "es5",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "node",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "preserve",
+    "incremental": true,
+    "paths": {
+      "@/*": ["./*"]
+    }
+  },
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
+  "exclude": ["node_modules"]
 }

apps/formbricks-com/.env.example

@@ -0,0 +1,6 @@
+NEXT_PUBLIC_FORMBRICKS_COM_API_HOST=http://localhost:3000
+NEXT_PUBLIC_FORMBRICKS_COM_ENVIRONMENT_ID=
+NEXT_PUBLIC_FORMBRICKS_COM_DOCS_FEEDBACK_SURVEY_ID=
+
+# Strapi API Key
+STRAPI_API_KEY=

apps/formbricks-com/.eslintrc.js

@@ -0,0 +1,4 @@
+module.exports = {
+  root: true,
+  extends: ["formbricks"],
+};

apps/formbricks-com/.gitignore

@@ -0,0 +1,37 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# next.js
+/.next/
+/out/
+
+# production
+/build
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env*.local
+
+# vercel
+.vercel
+
+# typescript
+*.tsbuildinfo
+next-env.d.ts
+
+public/sitemap*.xml

apps/formbricks-com/LICENSE.md

@@ -0,0 +1,129 @@
+# Tailwind UI License
+
+## Personal License
+
+Tailwind Labs Inc. grants you an on-going, non-exclusive license to use the Components and Templates.
+
+The license grants permission to **one individual** (the Licensee) to access and use the Components and Templates.
+
+You **can**:
+
+- Use the Components and Templates to create unlimited End Products.
+- Modify the Components and Templates to create derivative components and templates. Those components and templates are subject to this license.
+- Use the Components and Templates to create unlimited End Products for unlimited Clients.
+- Use the Components and Templates to create End Products where the End Product is sold to End Users.
+- Use the Components and Templates to create End Products that are open source and freely available to End Users.
+
+You **cannot**:
+
+- Use the Components and Templates to create End Products that are designed to allow an End User to build their own End Products using the Components and Templates or derivatives of the Components and Templates.
+- Re-distribute the Components and Templates or derivatives of the Components and Templates separately from an End Product, neither in code or as design assets.
+- Share your access to the Components and Templates with any other individuals.
+- Use the Components and Templates to produce anything that may be deemed by Tailwind Labs Inc, in their sole and absolute discretion, to be competitive or in conflict with the business of Tailwind Labs Inc.
+
+### Example usage
+
+Examples of usage **allowed** by the license:
+
+- Creating a personal website by yourself.
+- Creating a website or web application for a client that will be owned by that client.
+- Creating a commercial SaaS application (like an invoicing app for example) where end users have to pay a fee to use the application.
+- Creating a commercial self-hosted web application that is sold to end users for a one-time fee.
+- Creating a web application where the primary purpose is clearly not to simply re-distribute the components (like a conference organization app that uses the components for its UI for example) that is free and open source, where the source code is publicly available.
+
+Examples of usage **not allowed** by the license:
+
+- Creating a repository of your favorite Tailwind UI components or templates (or derivatives based on Tailwind UI components or templates) and publishing it publicly.
+- Creating a React or Vue version of Tailwind UI and making it available either for sale or for free.
+- Create a Figma or Sketch UI kit based on the Tailwind UI component designs.
+- Creating a "website builder" project where end users can build their own websites using components or templates included with or derived from Tailwind UI.
+- Creating a theme, template, or project starter kit using the components or templates and making it available either for sale or for free.
+- Creating an admin panel tool (like [Laravel Nova](https://nova.laravel.com/) or [ActiveAdmin](https://activeadmin.info/)) that is made available either for sale or for free.
+
+In simple terms, use Tailwind UI for anything you like as long as it doesn't compete with Tailwind UI.
+
+### Personal License Definitions
+
+Licensee is the individual who has purchased a Personal License.
+
+Components and Templates are the source code and design assets made available to the Licensee after purchasing a Tailwind UI license.
+
+End Product is any artifact produced that incorporates the Components or Templates or derivatives of the Components or Templates.
+
+End User is a user of an End Product.
+
+Client is an individual or entity receiving custom professional services directly from the Licensee, produced specifically for that individual or entity. Customers of software-as-a-service products are not considered clients for the purpose of this document.
+
+## Team License
+
+Tailwind Labs Inc. grants you an on-going, non-exclusive license to use the Components and Templates.
+
+The license grants permission for **up to 25 Employees and Contractors of the Licensee** to access and use the Components and Templates.
+
+You **can**:
+
+- Use the Components and Templates to create unlimited End Products.
+- Modify the Components and Templates to create derivative components and templates. Those components and templates are subject to this license.
+- Use the Components and Templates to create unlimited End Products for unlimited Clients.
+- Use the Components and Templates to create End Products where the End Product is sold to End Users.
+- Use the Components and Templates to create End Products that are open source and freely available to End Users.
+
+You **cannot**:
+
+- Use the Components or Templates to create End Products that are designed to allow an End User to build their own End Products using the Components or Templates or derivatives of the Components or Templates.
+- Re-distribute the Components or Templates or derivatives of the Components or Templates separately from an End Product.
+- Use the Components or Templates to create End Products that are the property of any individual or entity other than the Licensee or Clients of the Licensee.
+- Use the Components or Templates to produce anything that may be deemed by Tailwind Labs Inc, in their sole and absolute discretion, to be competitive or in conflict with the business of Tailwind Labs Inc.
+
+### Example usage
+
+Examples of usage **allowed** by the license:
+
+- Creating a website for your company.
+- Creating a website or web application for a client that will be owned by that client.
+- Creating a commercial SaaS application (like an invoicing app for example) where end users have to pay a fee to use the application.
+- Creating a commercial self-hosted web application that is sold to end users for a one-time fee.
+- Creating a web application where the primary purpose is clearly not to simply re-distribute the components or templates (like a conference organization app that uses the components or a template for its UI for example) that is free and open source, where the source code is publicly available.
+
+Examples of use **not allowed** by the license:
+
+- Creating a repository of your favorite Tailwind UI components or template (or derivatives based on Tailwind UI components or templates) and publishing it publicly.
+- Creating a React or Vue version of Tailwind UI and making it available either for sale or for free.
+- Creating a "website builder" project where end users can build their own websites using components or templates included with or derived from Tailwind UI.
+- Creating a theme or template using the components or templates and making it available either for sale or for free.
+- Creating an admin panel tool (like [Laravel Nova](https://nova.laravel.com/) or [ActiveAdmin](https://activeadmin.info/)) that is made available either for sale or for free.
+- Creating any End Product that is not the sole property of either your company or a client of your company. For example your employees/contractors can't use your company Tailwind UI license to build their own websites or side projects.
+
+### Team License Definitions
+
+Licensee is the business entity who has purchased a Team License.
+
+Components and Templates are the source code and design assets made available to the Licensee after purchasing a Tailwind UI license.
+
+End Product is any artifact produced that incorporates the Components or Templates or derivatives of the Components or Templates.
+
+End User is a user of an End Product.
+
+Employee is a full-time or part-time employee of the Licensee.
+
+Contractor is an individual or business entity contracted to perform services for the Licensee.
+
+Client is an individual or entity receiving custom professional services directly from the Licensee, produced specifically for that individual or entity. Customers of software-as-a-service products are not considered clients for the purpose of this document.
+
+## Enforcement
+
+If you are found to be in violation of the license, access to your Tailwind UI account will be terminated, and a refund may be issued at our discretion. When license violation is blatant and malicious (such as intentionally redistributing the Components or Templates through private warez channels), no refund will be issued.
+
+The copyright of the Components and Templates is owned by Tailwind Labs Inc. You are granted only the permissions described in this license; all other rights are reserved. Tailwind Labs Inc. reserves the right to pursue legal remedies for any unauthorized use of the Components or Templates outside the scope of this license.
+
+## Liability
+
+Tailwind Labs Inc.’s liability to you for costs, damages, or other losses arising from your use of the Components or Templates — including third-party claims against you — is limited to a refund of your license fee. Tailwind Labs Inc. may not be held liable for any consequential damages related to your use of the Components or Templates.
+
+This Agreement is governed by the laws of the Province of Ontario and the applicable laws of Canada. Legal proceedings related to this Agreement may only be brought in the courts of Ontario. You agree to service of process at the e-mail address on your original order.
+
+## Questions?
+
+Unsure which license you need, or unsure if your use case is covered by our licenses?
+
+Email us at [support@tailwindui.com](mailto:support@tailwindui.com) with your questions.

apps/formbricks-com/app/docs/actions/code/page.mdx

@@ -0,0 +1,37 @@
+export const metadata = {
+  title: "Implementing Code Actions in Formbricks | Real-time User Action Tracking",
+  description:
+    "Dive into the world of Formbricks' code actions. Learn how to seamlessly integrate formbricks.track() method into your codebase, enabling real-time tracking of user actions like button clicks, visiting a specific URL. Up your survey game with precise and exact triggers.",
+};
+
+#### Actions
+
+# Code Actions
+
+Actions can also be set in the codebase to trigger surveys. Please add the code action first in the Formbricks web interface to be able to configure your surveys to use this action.
+
+After that you can fire an action using `formbricks.track()`
+
+<Col>
+<CodeGroup title="Track an action">
+
+```javascript
+formbricks.track("Action Name");
+```
+
+</CodeGroup>
+</Col>
+Here is an example of how to fire an action when a user clicks a button:
+<Col>
+<CodeGroup title="Track Button Click">
+
+```javascript
+const handleClick = () => {
+  formbricks.track("Button Clicked");
+};
+
+return <button onClick={handleClick}>Click Me</button>;
+```
+
+</CodeGroup>
+</Col>

apps/formbricks-com/app/docs/actions/no-code/page.mdx

@@ -0,0 +1,30 @@
+export const metadata = {
+  title: "Implementing No-Code Actions in Formbricks | Real-time User Action Tracking",
+  description:
+    "Discover the power of Formbricks' No-Code Actions. Easily set up triggers based on Page URL, innerText, and CSS Selectors without touching a line of code. Inccrease user engagement and get insights at precise moments in the user journey.",
+};
+
+#### Actions
+
+# No-Code Actions
+
+No-Code actions can be set up within Formbricks with just a few clicks. There are three types of No-Code actions:
+
+## Page URL Action
+
+The page URL action is triggered, when a user visits a specific page in your application. There are several match conditions:
+
+- `exactMatch`: The URL should exactly match the provided string.
+- `contains`: The URL should contain the specified string as a substring.
+- `startsWith`: The URL should start with the specified string.
+- `endsWith`: The URL should end with the specified string.
+- `notMatch`: The URL should not match the specified condition.
+- `notContains`: The URL should not contain the specified string as a substring.
+
+## innerText Action
+
+The innerText action checks if the `innerText` of a clicked HTML element matches a specific text, e.g. the label of a button. Display a survey on any button click!
+
+## CSS Selector Action
+
+The CSS Selector action checks if the provided CSS selector matches the selector of a clicked HTML element. The CSS selector can be a class, id or any other CSS selector within your website. Display a survey on any element click!

apps/formbricks-com/app/docs/actions/why/page.mdx

@@ -0,0 +1,23 @@
+export const metadata = {
+  title: "Using Actions in Formbricks | Fine-tuning User Moments",
+  description:
+    "Dive deep into how actions in Formbricks help products and teams to engage users at precise moments in their journey. Discover the power of actions, from coding to no-code setups, to refine user targeting and generate richer, more detailed user insights.",
+};
+
+#### Actions
+
+# What are actions and why are they useful?
+
+You want to understand what your users think and feel during specific moments in the user journey. To be able to ask at exactly the right point in time, you need actions.
+
+## What are actions?
+
+Actions are a little notification sent from your application to Formbricks. You decide which actions are sent either in your [Code](/docs/actions/code) or by setting up a [No-Code](/docs/actions/no-code) action within Formbricks.
+
+## How do actions work?
+
+When a predefined action happens in your app, the Formbricks widget notices. This action can then trigger a survey to be shown to the user and is stored in the database.
+
+## Why are actions useful?
+
+Actions help you to display your surveys at the right time. Later on, you will be able to segment your users based on the actions they have triggered in the past. This way, you can create much more granular user segments, e.g. only target users that already have used a specific feature.

apps/formbricks-com/app/docs/api/client/actions/page.mdx

@@ -0,0 +1,88 @@
+import { Fence } from "@/components/shared/Fence";
+
+export const metadata = {
+  title: "Formbricks Responses API Documentation - Manage Your Survey Data Seamlessly",
+  description:
+    "Unlock the full potential of Formbricks' Client Actions API. Create Actions right from the API.",
+};
+
+#### Client API
+
+# Actions API
+
+The Public Client API is designed for the JavaScript SDK and does not require authentication. It's primarily used for creating persons, sessions, and responses within the Formbricks platform. This API is ideal for client-side interactions, as it doesn't expose sensitive information.
+
+This API can be used to:
+- [Add Action for User](#add-action-for-user)
+
+
+---
+
+## Add Action for User {{ tag: 'POST', label: '/api/v1/client/<environment-id>/actions' }}
+
+Adds an Actions for a given User by their User ID
+
+<Row>
+  <Col>
+
+    ### Mandatory Body Fields
+
+    <Properties>
+      <Property name="userId" type="string">
+        The id of the user for whom the action is being created.
+      </Property>
+      <Property name="name" type="string">
+        The name of the Action being created.
+      </Property>
+    </Properties>
+
+  </Col>
+  <Col sticky>
+
+    <CodeGroup title="Request" tag="POST" label="/api/v1/client/<environment-id>/actions">
+
+    ```bash {{ title: 'cURL' }}
+    curl --location --request POST 'https://app.formbricks.com/api/v1/client/<environment-id>/actions' \
+    --data-raw '{
+        "userId": "1",
+        "name": "new_action_v2",
+        "properties":{}
+
+    }'
+    ```
+
+    ```json {{ title: 'Example Request Body' }}
+    {
+        "userId": "1",
+        "name": "new_action_v3",
+        "properties":{}
+    }
+    ```
+
+    </CodeGroup>
+
+    <CodeGroup title="Response">
+
+    ```json {{ title: '200 Success' }}
+    {
+    "data": {}
+    }
+    ```
+
+    ```json {{ title: '400 Bad Request' }}
+    {
+        "code": "bad_request",
+        "message": "Fields are missing or incorrectly formatted",
+        "details": {
+            "name": "Required"
+        }
+    }
+    ```
+
+    </CodeGroup>
+
+  </Col>
+</Row>
+
+---
+

apps/formbricks-com/app/docs/api/client/displays/page.mdx

@@ -0,0 +1,145 @@
+import { Fence } from "@/components/shared/Fence";
+
+export const metadata = {
+  title: "Formbricks Public Client API Guide: Manage Survey Displays & Responses",
+  description:
+    "Dive deep into Formbricks' Public Client API designed for customisation. This comprehensive guide provides detailed instructions on how to mark create and update survey displays for users.",
+};
+
+#### Client API
+
+# Displays API
+
+The Public Client API is designed for the JavaScript SDK and does not require authentication. It's primarily used for creating persons, sessions, and responses within the Formbricks platform. This API is ideal for client-side interactions, as it doesn't expose sensitive information.
+
+This set of API can be used to
+- [Create Display](#create-display)
+- [Update Display](#update-display)
+
+---
+
+## Create Display {{ tag: 'POST', label: '/api/v1/client/<environment-id>/diplays' }}
+
+<Row>
+  <Col>
+
+    Create Display of survey for a user
+
+    ### Mandatory Request Body JSON Keys
+    <Properties>
+      <Property name="surveyId" type="string">
+        Survey ID to mark as viewed for a person
+      </Property>
+    </Properties>
+
+    ### Optional Request Body JSON Keys
+    <Properties>
+      <Property name="userId" type="string">
+        Already existing user's ID to mark as viewed for a survey
+      </Property>
+      <Property name="responseId" type="string">
+        Already existing response's ID to link with this new Display
+      </Property>
+    </Properties>
+
+
+  </Col>
+  <Col sticky>
+
+    <CodeGroup title="Request" tag="POST" label="/api/v1/client/<environment-id>/displays">
+
+    ```bash {{ title: 'cURL' }}
+    curl -X POST \
+    'https://app.formbricks.com/api/v1/client/displays' \
+    -H 'Content-Type: application/json' \
+    -d '{
+        "surveyId":"<survey-id>",
+        "userId":"<user-id>"
+      }'
+    ```
+
+    </CodeGroup>
+
+    <CodeGroup title="Response">
+
+    ```json {{title:'200 Success'}}
+    {
+      "data": {
+        "id": "clphzz6oo00083zdmc7e0nwzi"
+      }
+    }
+    ```
+
+    ```json {{ title: '400 Bad Request' }}
+    {
+      "code": "bad_request",
+      "message": "Fields are missing or incorrectly formatted",
+      "details": {
+        "surveyId": "Required"
+        }
+    }
+    ```
+    </CodeGroup>
+
+  </Col>
+</Row>
+
+---
+
+## Update Display {{ tag: 'PUT', label: '/api/v1/client/<environment-id>/diplays/<display-id>' }}
+
+<Row>
+  <Col>
+
+    Update a display by it's ID
+
+    ### Optional Request Body JSON Keys
+    <Properties>
+      <Property name="userId" type="string">
+        Already existing user's ID to mark as viewed for a survey
+      </Property>
+      <Property name="responseId" type="string">
+        Already existing response's ID to link with this new Display
+      </Property>
+    </Properties>
+
+
+  </Col>
+  <Col sticky>
+
+    <CodeGroup title="Request" tag="PUT" label="/api/v1/client/<environment-id>/displays/<display-id>">
+
+    ```bash {{ title: 'cURL' }}
+    curl -X POST \
+    'https://app.formbricks.com/api/v1/client/<environment-id>/displays/<display-id>' \
+    -H 'Content-Type: application/json' \
+    -d '{
+        "userId":"<user-id>"
+      }'
+    ```
+
+    </CodeGroup>
+
+    <CodeGroup title="Response">
+
+    ```json {{title:'200 Success'}}
+    {
+      "data": {}
+    }
+    ```
+
+    ```json {{ title: '400 Bad Request' }}
+    {
+      "code": "bad_request",
+      "message": "Fields are missing or incorrectly formatted",
+      "details": {
+        "surveyId": "Required"
+      }
+    }
+    ```
+    </CodeGroup>
+
+  </Col>
+</Row>
+
+---