fix: logic jump (#4501)

Co-authored-by: Anshuman Pandey <54475686+pandeymangg@users.noreply.github.com>

.changeset/README.md

@@ -1,8 +0,0 @@
-# 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": [],
-  "access": "restricted",
-  "baseBranch": "main",
-  "updateInternalDependencies": "patch",
-  "ignore": ["@formbricks/formbricks-com"]
+  "updateInternalDependencies": "patch"
 }

.devcontainer/Dockerfile

@@ -1,16 +0,0 @@
-# [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=18-bullseye
-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,30 +1,6 @@
-// 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
 {
-	"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": "pnpm install",
-
-	// Comment out to connect as root instead. More info: https://aka.ms/vscode-remote/containers/non-root.
-	"remoteUser": "node"
+  "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"
 }

.devcontainer/docker-compose.yml

@@ -1,52 +0,0 @@
-version: '3.8'
-
-services:
-  app:
-    build:
-      context: .
-      dockerfile: Dockerfile
-      args:
-        # Update 'VARIANT' to pick an LTS version of Node.js: 18, 16, 14.
-        # Append -bullseye or -buster to pin to an OS version.
-        # Use -bullseye variants on local arm64/Apple Silicon.
-        VARIANT: "18"
-
-    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: postgres
-    # 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,3 +35,5 @@ yarn-error.log*
 .vscode
 .github
 **/.turbo
+
+.env

.env.docker

@@ -1,96 +0,0 @@
-########################################################################
-# ------------ MANDATORY (CHANGE ACCORDING TO YOUR SETUP) ------------#
-########################################################################
-
-
-############
-#  BASICS  #
-############
-
-NEXT_PUBLIC_WEBAPP_URL=http://localhost:3000
-
-##############
-#  DATABASE  #
-##############
-
-DATABASE_URL='postgresql://postgres:postgres@postgres:5432/formbricks?schema=public'
-
-# Uncomment to enable a dedicated connection pool for Prisma using Prisma Data Proxy
-# Cold boots will be faster and you'll be able to scale your DB independently of your app.
-# @see https://www.prisma.io/docs/data-platform/data-proxy/use-data-proxy
-# PRISMA_GENERATE_DATAPROXY=true
-PRISMA_GENERATE_DATAPROXY= 
-
-###############
-#  NEXT AUTH  #
-###############
-
-# @see: https://next-auth.js.org/configuration/options#nextauth_secret
-# You can use: `openssl rand -base64 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
-
-# If you encounter NEXT_AUTH URL problems this should always be localhost:3000 (or whatever port your app is running on)
-# NEXTAUTH_URL_INTERNAL=http://localhost:3000
-
-################
-#  MAIL SETUP  #
-################
-
-# Necessary if email verification and password reset are enabled.
-# See optional configurations below if you want to disable these features.
-
-# MAIL_FROM=noreply@example.com
-# SMTP_HOST=localhost
-# SMTP_PORT=1025
-# SMTP_SECURE_ENABLED=0 # Enable for TLS (port 465)
-# SMTP_USER=smtpUser
-# SMTP_PASSWORD=smtpPassword
-
-
-########################################################################
-# ------------------------------ OPTIONAL -----------------------------#
-########################################################################
-
-# Uncomment the variables you would like to use and customize the values.
-
-#####################
-# Disable Features  #
-#####################
-
-# Email Verification. If you enable Email Verification you have to setup SMTP-Settings, too.
-NEXT_PUBLIC_EMAIL_VERIFICATION_DISABLED=1
-
-# Password Reset. If you enable Password Reset functionality you have to setup SMTP-Settings, too.
-NEXT_PUBLIC_PASSWORD_RESET_DISABLED=1
-
-# Signup. Disable the ability for new users to create an account.
-# NEXT_PUBLIC_SIGNUP_DISABLED=1
-
-##########
-# Other  #
-##########
-
-# Display privacy policy, imprint and terms of service links in the footer of signup & public pages.
-NEXT_PUBLIC_PRIVACY_URL=
-NEXT_PUBLIC_TERMS_URL=
-NEXT_PUBLIC_IMPRINT_URL=
-
-# Disable Sentry warning
-SENTRY_IGNORE_API_RESOLUTION_ERROR=1
-
-# Enable Sentry Error Tracking
-NEXT_PUBLIC_SENTRY_DSN=
-
-# Configure Github Login
-NEXT_PUBLIC_GITHUB_AUTH_ENABLED=0
-GITHUB_ID=
-GITHUB_SECRET=
-
-# Configure Google Login
-NEXT_PUBLIC_GOOGLE_AUTH_ENABLED=0
-GOOGLE_CLIENT_ID=
-GOOGLE_CLIENT_SECRET=

.env.example

@@ -1,13 +1,29 @@
 ########################################################################
-# ------------ MANDATORY (CHANGE ACCORDING TO YOUR SETUP) ------------#
+# ------------ MANDATORY (CHANGE ACCORDING TO YOUR SETUP) ------------ #
 ########################################################################
 
-
 ############
 #  BASICS  #
 ############
 
-NEXT_PUBLIC_WEBAPP_URL=http://localhost:3000
+WEBAPP_URL=http://localhost:3000
+
+# Required for next-auth. Should be the same as WEBAPP_URL
+NEXTAUTH_URL=http://localhost:3000
+
+# Encryption keys
+# Please set both for now, we will change this in the future
+
+# 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  #
@@ -15,27 +31,6 @@ NEXT_PUBLIC_WEBAPP_URL=http://localhost:3000
 
 DATABASE_URL='postgresql://postgres:postgres@localhost:5432/formbricks?schema=public'
 
-# Uncomment to enable a dedicated connection pool for Prisma using Prisma Data Proxy
-# Cold boots will be faster and you'll be able to scale your DB independently of your app.
-# @see https://www.prisma.io/docs/data-platform/data-proxy/use-data-proxy
-# PRISMA_GENERATE_DATAPROXY=true
-PRISMA_GENERATE_DATAPROXY=
-
-###############
-#  NEXT AUTH  #
-###############
-
-# @see: https://next-auth.js.org/configuration/options#nextauth_secret
-# You can use: `openssl rand -base64 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
-
-# If you encounter NEXT_AUTH URL problems this should always be localhost:3000 (or whatever port your app is running on)
-# NEXTAUTH_URL_INTERNAL=http://localhost:3000
-
 ################
 #  MAIL SETUP  #
 ################
@@ -46,10 +41,13 @@ NEXTAUTH_URL=http://localhost:3000
 MAIL_FROM=noreply@example.com
 SMTP_HOST=localhost
 SMTP_PORT=1025
-SMTP_SECURE_ENABLED=0 # Enable for TLS (port 465)
+# Enable SMTP_SECURE_ENABLED for TLS (port 465)
+SMTP_SECURE_ENABLED=0
 SMTP_USER=smtpUser
 SMTP_PASSWORD=smtpPassword
 
+# 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 -----------------------------#
@@ -57,47 +55,137 @@ 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  #
 #####################
 
 # Email Verification. If you enable Email Verification you have to setup SMTP-Settings, too.
-# NEXT_PUBLIC_EMAIL_VERIFICATION_DISABLED=1
+EMAIL_VERIFICATION_DISABLED=1
 
 # Password Reset. If you enable Password Reset functionality you have to setup SMTP-Settings, too.
-# NEXT_PUBLIC_PASSWORD_RESET_DISABLED=1
+PASSWORD_RESET_DISABLED=1
 
 # Signup. Disable the ability for new users to create an account.
-# NEXT_PUBLIC_SIGNUP_DISABLED=1
+# 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.
+# INVITE_DISABLED=1
 
 ##########
 # Other  #
 ##########
 
 # Display privacy policy, imprint and terms of service links in the footer of signup & public pages.
-NEXT_PUBLIC_PRIVACY_URL=
-NEXT_PUBLIC_TERMS_URL=
-NEXT_PUBLIC_IMPRINT_URL=
-
-# Disable Sentry warning
-SENTRY_IGNORE_API_RESOLUTION_ERROR=1
-
-# Enable Sentry Error Tracking
-NEXT_PUBLIC_SENTRY_DSN=
+PRIVACY_URL=
+TERMS_URL=
+IMPRINT_URL=
 
 # Configure Github Login
-NEXT_PUBLIC_GITHUB_AUTH_ENABLED=0
 GITHUB_ID=
 GITHUB_SECRET=
 
 # Configure Google Login
-NEXT_PUBLIC_GOOGLE_AUTH_ENABLED=0
 GOOGLE_CLIENT_ID=
 GOOGLE_CLIENT_SECRET=
 
+# Configure Azure Active Directory Login
+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=
+
+# Configure this when you want to ship JS & CSS files from a complete URL instead of the current domain
+# ASSET_PREFIX_URL=
+
+# Oauth credentials for Notion Integration
+NOTION_OAUTH_CLIENT_ID=
+NOTION_OAUTH_CLIENT_SECRET=
 
 # Stripe Billing Variables
-NEXT_PUBLIC_STRIPE_PRICING_TABLE_ID=
-NEXT_PUBLIC_STRIPE_PUBLIC_KEY=
 STRIPE_SECRET_KEY=
-STRIPE_WEBHOOK_SECRET=
+STRIPE_WEBHOOK_SECRET=
+
+# Configure Formbricks usage within Formbricks
+NEXT_PUBLIC_FORMBRICKS_API_HOST=
+NEXT_PUBLIC_FORMBRICKS_ENVIRONMENT_ID=
+NEXT_PUBLIC_FORMBRICKS_ONBOARDING_SURVEY_ID=
+
+# Oauth credentials for Google sheet integration
+GOOGLE_SHEETS_CLIENT_ID=
+GOOGLE_SHEETS_CLIENT_SECRET=
+GOOGLE_SHEETS_REDIRECT_URL=
+
+# 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)
+# (Role Management is an Enterprise feature)
+# DEFAULT_ORGANIZATION_ID=
+# DEFAULT_ORGANIZATION_ROLE=owner
+
+# Send new users to customer.io
+# CUSTOMER_IO_API_KEY=
+# CUSTOMER_IO_SITE_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=

.eslintignore

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

.eslintrc.js

@@ -1,10 +0,0 @@
-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.md

@@ -1,51 +0,0 @@
----
-name: Bug report
-about: "Found a bug? Please fill out the sections below. \U0001F44D"
-title: "[BUG]"
-labels: bug
-assignees: ""
----
-
-### Issue Summary
-
-<!--
-A summary of the issue. This needs to be a clear detailed-rich summary.
--->
-
-(Write your answer here.)
-
-### Steps to Reproduce
-
-1. (for example) Went to ...
-2. Clicked on...
-3. ...
-
-### Expected behavior
-
-A clear and concise description of what you expected to happen.
-
-### Other information
-
-#### Screenshots
-
-If applicable, add screenshots to help explain your problem.
-
-#### Environment
-
-- [ ] Formbricks Cloud (app.formbricks.com)
-- [ ] self-hosted Formbricks, version/commit: [please provide]
-
-#### Desktop (please complete the following information):
-
-- OS: [e.g. iOS]
-- Browser [e.g. chrome, safari]
-- Version [e.g. 22]
-
-#### Node.JS version
-
-[e.g. v18.15.0]
-
-#### 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/bug_report.yml

@@ -0,0 +1,31 @@
+name: Bug report
+description: "Found a bug? Please fill out the sections below. \U0001F44D"
+type: bug
+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

.github/ISSUE_TEMPLATE/config.yml

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

.github/ISSUE_TEMPLATE/feature_request.md

@@ -1,19 +0,0 @@
----
-name: Feature request
-about: "Suggest an idea for this project \U0001F680"
-title: "[FEATURE]"
-labels: enhancement
-assignees: ""
----
-
-**Is your feature request related to a problem? Please describe.**
-A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
-
-**Describe the solution you'd like**
-A clear and concise description of what you want to happen.
-
-**Describe alternatives you've considered**
-A clear and concise description of any alternative solutions or features you've considered.
-
-**Additional context**
-Add any other context or screenshots about the feature request here.

.github/ISSUE_TEMPLATE/feature_request.yml

@@ -0,0 +1,32 @@
+name: Feature request
+description: "Suggest an idea for this project \U0001F680"
+type: feature
+body:
+  - type: textarea
+    id: problem-description
+    attributes:
+      label: Is your feature request related to a problem? Please describe.
+      description: A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
+    validations:
+      required: true
+  - type: textarea
+    id: solution-description
+    attributes:
+      label: Describe the solution you'd like
+      description: A clear and concise description of what you want to happen.
+    validations:
+      required: true
+  - type: textarea
+    id: additional-context
+    attributes:
+      label: Additional context
+      description: Add any other context or screenshots about the feature request here.
+    validations:
+      required: false
+  - type: markdown
+    attributes:
+      value: |
+        ### Additional resources 🤓
+
+        - 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)

.github/ISSUE_TEMPLATE/task.yml

@@ -0,0 +1,11 @@
+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

@@ -1,40 +0,0 @@
-## 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)
-- [ ] 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  -->
-
-- [ ] Read the [contributing guide](https://github.com/formbricks/formbricks/blob/main/CONTRIBUTING.md)
-- [ ] 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`
-- [ ] Updated the Formbricks Docs if changes were necessary

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

@@ -0,0 +1,70 @@
+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

@@ -0,0 +1,10 @@
+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/labeler.yml

@@ -0,0 +1,6 @@
+"❗️ migrations":
+  - packages/database/migrations/**/migration.sql
+
+"❗️ .env changes":
+  - .env.example
+  - .env.docker

.github/pull_request_template.md

@@ -0,0 +1,40 @@
+<!-- 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/apply-issue-labels-to-pr.yml

@@ -0,0 +1,74 @@
+name: "Apply issue labels to PR"
+
+on:
+  pull_request_target:
+    types:
+      - opened
+
+jobs:
+  label_on_pr:
+    runs-on: ubuntu-latest
+
+    permissions:
+      contents: none
+      issues: read
+      pull-requests: write
+
+    steps:
+      - name: Apply labels from linked issue to PR
+        uses: actions/github-script@v5
+        with:
+          github-token: ${{ secrets.GITHUB_TOKEN }}
+          script: |
+            async function getLinkedIssues(owner, repo, prNumber) {
+              const query = `query GetLinkedIssues($owner: String!, $repo: String!, $prNumber: Int!) {
+                repository(owner: $owner, name: $repo) {
+                  pullRequest(number: $prNumber) {
+                    closingIssuesReferences(first: 10) {
+                      nodes {
+                        number
+                        labels(first: 10) {
+                          nodes {
+                            name
+                          }
+                        }
+                      }
+                    }
+                  }
+                }
+              }`;
+
+              const variables = {
+                owner: owner,
+                repo: repo,
+                prNumber: prNumber,
+              };
+
+              const result = await github.graphql(query, variables);
+              return result.repository.pullRequest.closingIssuesReferences.nodes;
+            }
+
+            const pr = context.payload.pull_request;
+            const linkedIssues = await getLinkedIssues(
+              context.repo.owner,
+              context.repo.repo,
+              pr.number
+            );
+
+            const labelsToAdd = new Set();
+            for (const issue of linkedIssues) {
+              if (issue.labels && issue.labels.nodes) {
+                for (const label of issue.labels.nodes) {
+                  labelsToAdd.add(label.name);
+                }
+              }
+            }
+
+            if (labelsToAdd.size) {
+              await github.rest.issues.addLabels({
+                owner: context.repo.owner,
+                repo: context.repo.repo,
+                issue_number: pr.number,
+                labels: Array.from(labelsToAdd),
+              });
+            }

.github/workflows/build-docs.yml

@@ -0,0 +1,28 @@
+name: Build Docs
+on:
+  workflow_call:
+jobs:
+  build:
+    name: Build Docs
+    runs-on: ubuntu-latest
+    timeout-minutes: 30
+
+    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
+
+      - run: |
+          pnpm build --filter=@formbricks/docs...
+        shell: bash

.github/workflows/build-web.yml

@@ -0,0 +1,18 @@
+name: Build Web
+on:
+  workflow_call:
+jobs:
+  build:
+    name: Build Formbricks-web
+    runs-on: ubuntu-latest
+    timeout-minutes: 30
+
+    steps:
+      - uses: actions/checkout@v3
+      - uses: ./.github/actions/dangerous-git-checkout
+
+      - name: Build & Cache Web Binaries
+        uses: ./.github/actions/cache-build-web
+        id: cache-build-web
+        with:
+          e2e_testing_mode: "0"

.github/workflows/checks.yml

@@ -1,28 +0,0 @@
-name: Checks
-on: [push]
-jobs:
-  build:
-    name: Build, lint, and test on Node ${{ matrix.node }} and ${{ matrix.os }}
-    runs-on: ubuntu-latest
-
-    env:
-      TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
-      TURBO_TEAM: ${{ secrets.TURBO_TEAM }}
-
-    steps:
-      - name: Checkout repo
-        uses: actions/checkout@v2
-
-      - name: Setup Node.js 18.x
-        uses: actions/setup-node@v2
-        with:
-          node-version: 18.x
-
-      - name: Install pnpm
-        uses: pnpm/action-setup@v2.2.4
-
-      - name: Install dependencies
-        run: pnpm install --config.platform=linux --config.architecture=x64
-
-      - name: Lint
-        run: pnpm lint

.github/workflows/chromatic.yml

@@ -0,0 +1,30 @@
+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/codeql.yml

@@ -0,0 +1,92 @@
+# For most projects, this workflow file will not need changing; you simply need
+# to commit it to your repository.
+#
+# You may wish to alter this file to override the set of languages analyzed,
+# or to provide custom queries or build logic.
+#
+# ******** NOTE ********
+# We have attempted to detect the languages in your repository. Please check
+# the `language` matrix defined below to confirm you have the correct set of
+# supported CodeQL languages.
+#
+name: "CodeQL Advanced"
+
+on:
+  push:
+    branches: [ "main" ]
+  pull_request:
+    branches: [ "main" ]
+  schedule:
+    - cron: '17 1 * * 1'
+
+jobs:
+  analyze:
+    name: Analyze (${{ matrix.language }})
+    # Runner size impacts CodeQL analysis time. To learn more, please see:
+    #   - https://gh.io/recommended-hardware-resources-for-running-codeql
+    #   - https://gh.io/supported-runners-and-hardware-resources
+    #   - https://gh.io/using-larger-runners (GitHub.com only)
+    # Consider using larger runners or machines with greater resources for possible analysis time improvements.
+    runs-on: ${{ (matrix.language == 'swift' && 'macos-latest') || 'ubuntu-latest' }}
+    permissions:
+      # required for all workflows
+      security-events: write
+
+      # required to fetch internal or private CodeQL packs
+      packages: read
+
+      # only required for workflows in private repositories
+      actions: read
+      contents: read
+
+    strategy:
+      fail-fast: false
+      matrix:
+        include:
+        - language: javascript-typescript
+          build-mode: none
+        # CodeQL supports the following values keywords for 'language': 'c-cpp', 'csharp', 'go', 'java-kotlin', 'javascript-typescript', 'python', 'ruby', 'swift'
+        # Use `c-cpp` to analyze code written in C, C++ or both
+        # Use 'java-kotlin' to analyze code written in Java, Kotlin or both
+        # Use 'javascript-typescript' to analyze code written in JavaScript, TypeScript or both
+        # To learn more about changing the languages that are analyzed or customizing the build mode for your analysis,
+        # see https://docs.github.com/en/code-security/code-scanning/creating-an-advanced-setup-for-code-scanning/customizing-your-advanced-setup-for-code-scanning.
+        # If you are analyzing a compiled language, you can modify the 'build-mode' for that language to customize how
+        # your codebase is analyzed, see https://docs.github.com/en/code-security/code-scanning/creating-an-advanced-setup-for-code-scanning/codeql-code-scanning-for-compiled-languages
+    steps:
+    - name: Checkout repository
+      uses: actions/checkout@v4
+
+    # Initializes the CodeQL tools for scanning.
+    - name: Initialize CodeQL
+      uses: github/codeql-action/init@v3
+      with:
+        languages: ${{ matrix.language }}
+        build-mode: ${{ matrix.build-mode }}
+        # If you wish to specify custom queries, you can do so here or in a config file.
+        # By default, queries listed here will override any specified in a config file.
+        # Prefix the list here with "+" to use these queries and those in the config file.
+
+        # For more details on CodeQL's query packs, refer to: https://docs.github.com/en/code-security/code-scanning/automatically-scanning-your-code-for-vulnerabilities-and-errors/configuring-code-scanning#using-queries-in-ql-packs
+        # queries: security-extended,security-and-quality
+
+    # If the analyze step fails for one of the languages you are analyzing with
+    # "We were unable to automatically build your code", modify the matrix above
+    # to set the build mode to "manual" for that language. Then modify this step
+    # to build your code.
+    # ℹ️ Command-line programs to run using the OS shell.
+    # 📚 See https://docs.github.com/en/actions/using-workflows/workflow-syntax-for-github-actions#jobsjob_idstepsrun
+    - if: matrix.build-mode == 'manual'
+      shell: bash
+      run: |
+        echo 'If you are using a "manual" build mode for one or more of the' \
+          'languages you are analyzing, replace this with the commands to build' \
+          'your code, for example:'
+        echo '  make bootstrap'
+        echo '  make release'
+        exit 1
+
+    - name: Perform CodeQL Analysis
+      uses: github/codeql-action/analyze@v3
+      with:
+        category: "/language:${{matrix.language}}"

.github/workflows/cron-surveyStatusUpdate.yml

@@ -0,0 +1,24 @@
+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 * * *"
+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

@@ -0,0 +1,24 @@
+name: Cron - Weekly summary
+
+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 08:00 on Monday.” (see https://crontab.guru)
+    - cron: "0 8 * * 1"
+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/weekly-summary \
+            -X POST \
+            -H 'content-type: application/json' \
+            -H 'x-api-key: ${{ env.CRON_SECRET }}' \
+            --fail

.github/workflows/e2e.yml

@@ -0,0 +1,95 @@
+name: E2E Tests
+on:
+  workflow_call:
+  workflow_dispatch:
+env:
+  TELEMETRY_DISABLED: 1
+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: Run E2E Tests
+        run: |
+          pnpm test:e2e
+
+      - uses: actions/upload-artifact@v3
+        if: always()
+        with:
+          name: playwright-report
+          path: playwright-report/
+          retention-days: 30

.github/workflows/labeler.yml

@@ -0,0 +1,19 @@
+name: "Pull Request Labeler"
+on:
+  - pull_request_target
+concurrency:
+  group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }}
+  cancel-in-progress: true
+jobs:
+  labeler:
+    name: Pull Request Labeler
+    permissions:
+      contents: read
+      pull-requests: write
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/labeler@v4
+        with:
+          repo-token: "${{ secrets.GITHUB_TOKEN }}"
+          # https://github.com/actions/labeler/issues/442#issuecomment-1297359481
+          sync-labels: ""

.github/workflows/lint.yml

@@ -0,0 +1,36 @@
+name: Lint
+on:
+  workflow_call:
+jobs:
+  build:
+    name: Linters
+    runs-on: ubuntu-latest
+    timeout-minutes: 15
+
+    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
+
+      - 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: Lint
+        run: pnpm lint

.github/workflows/pr.yml

@@ -0,0 +1,75 @@
+name: PR Update
+
+on:
+  pull_request:
+    branches:
+      - main
+  merge_group:
+  workflow_dispatch:
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.event.pull_request.number || github.ref }}
+  cancel-in-progress: true
+
+jobs:
+  changes:
+    name: Detect changes
+    runs-on: ubuntu-latest
+    permissions:
+      pull-requests: read
+    outputs:
+      has-files-requiring-all-checks: ${{ steps.filter.outputs.has-files-requiring-all-checks }}
+    steps:
+      - uses: actions/checkout@v3
+      - uses: ./.github/actions/dangerous-git-checkout
+      - uses: dorny/paths-filter@v2
+        id: filter
+        with:
+          filters: |
+            has-files-requiring-all-checks:
+              - "!(**.md|.github/CODEOWNERS)"
+
+  test:
+    name: Run Unit Tests
+    needs: [changes]
+    if: ${{ needs.changes.outputs.has-files-requiring-all-checks == 'true' }}
+    uses: ./.github/workflows/test.yml
+    secrets: inherit
+
+  lint:
+    name: Run Linters
+    needs: [changes]
+    if: ${{ needs.changes.outputs.has-files-requiring-all-checks == 'true' }}
+    uses: ./.github/workflows/lint.yml
+    secrets: inherit
+
+  build:
+    name: Build Formbricks-web
+    needs: [changes]
+    if: ${{ needs.changes.outputs.has-files-requiring-all-checks == 'true' }}
+    uses: ./.github/workflows/build-web.yml
+    secrets: inherit
+
+  docs:
+    name: Build Docs
+    needs: [changes]
+    if: ${{ needs.changes.outputs.has-files-requiring-all-checks == 'true' }}
+    uses: ./.github/workflows/build-docs.yml
+    secrets: inherit
+
+  e2e-test:
+    name: Run E2E Tests
+    needs: [changes]
+    if: ${{ needs.changes.outputs.has-files-requiring-all-checks == 'true' }}
+    uses: ./.github/workflows/e2e.yml
+    secrets: inherit
+
+  required:
+    name: PR Check Summary
+    needs: [lint, test, build, e2e-test, docs]
+    if: always()
+    runs-on: ubuntu-latest
+    steps:
+      - name: fail if conditional jobs failed
+        if: contains(needs.*.result, 'failure') || contains(needs.*.result, 'skipped') || contains(needs.*.result, 'cancelled')
+        run: exit 1

.github/workflows/release-changesets.yml

@@ -0,0 +1,46 @@
+name: Release Changesets
+
+on:
+  workflow_dispatch:
+  #push:
+  #  branches:
+  #    - main
+
+concurrency: ${{ github.workflow }}-${{ github.ref }}
+
+env:
+  TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
+  TURBO_TEAM: ${{ secrets.TURBO_TEAM }}
+
+jobs:
+  release:
+    name: Release
+    runs-on: ubuntu-latest
+    timeout-minutes: 15
+    env:
+      TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
+      TURBO_TEAM: ${{ secrets.TURBO_TEAM }}
+    steps:
+      - name: Checkout Repo
+        uses: actions/checkout@v2
+
+      - name: Setup Node.js 18.x
+        uses: actions/setup-node@v2
+        with:
+          node-version: 18.x
+
+      - name: Install pnpm
+        uses: pnpm/action-setup@v2.2.4
+
+      - name: Install Dependencies
+        run: pnpm install --config.platform=linux --config.architecture=x64
+
+      - name: Create Release Pull Request or Publish to npm
+        id: changesets
+        uses: changesets/action@v1
+        with:
+          # This expects you to have a script called release which does a build for your packages and calls changeset publish
+          publish: pnpm release
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}

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

@@ -0,0 +1,71 @@
+name: Docker for Data Migrations
+
+on:
+  workflow_dispatch:
+  push:
+    tags:
+      - "v*"
+
+env:
+  REGISTRY: ghcr.io
+  IMAGE_NAME: formbricks/data-migrations
+  DATABASE_URL: "postgresql://postgres:postgres@postgres:5432/formbricks?schema=public"
+
+jobs:
+  build-and-push:
+    runs-on: ubuntu-latest
+    permissions:
+      contents: read
+      packages: write
+      id-token: write
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v3
+
+      # https://github.com/docker/setup-qemu-action
+      - name: Set up QEMU
+        uses: docker/setup-qemu-action@v3
+      # https://github.com/docker/setup-buildx-action
+      - name: Set up Docker Buildx
+        id: buildx
+        uses: docker/setup-buildx-action@v3
+
+      - name: Install cosign
+        if: github.event_name != 'pull_request'
+        uses: sigstore/cosign-installer@v3.5.0
+
+      - name: Log in to GitHub Container Registry
+        uses: docker/login-action@v3
+        with:
+          registry: ${{ env.REGISTRY }}
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Extract Docker metadata
+        id: meta
+        uses: docker/metadata-action@v5
+        with:
+          images: ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }}
+          tags: |
+            type=ref,event=tag
+            type=raw,value=${{ github.ref_name }}
+            type=raw,value=latest
+
+      - name: Build and push Docker image
+        uses: docker/build-push-action@v3
+        with:
+          context: .
+          platforms: linux/amd64,linux/arm64
+          file: ./packages/database/Dockerfile
+          push: true
+          tags: ${{ steps.meta.outputs.tags }}
+          labels: ${{ steps.meta.outputs.labels }}
+          build-args: |
+            DATABASE_URL=${{ env.DATABASE_URL }}
+
+      - name: Sign the published Docker image
+        if: ${{ github.event_name != 'pull_request' }}
+        run: |
+          cosign sign --yes ghcr.io/${{ env.IMAGE_NAME }}:${{ github.ref_name }}
+          cosign sign --yes ghcr.io/${{ env.IMAGE_NAME }}:latest

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

@@ -0,0 +1,91 @@
+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

@@ -0,0 +1,94 @@
+name: Docker Release to Github
+
+# 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:
+  push:
+    tags:
+      - "v*"
+
+env:
+  # Use docker.io for Docker Hub if empty
+  REGISTRY: ghcr.io
+  # github.repository as <account>/<repo>
+  IMAGE_NAME: ${{ github.repository }}
+  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.yml

@@ -0,0 +1,44 @@
+name: Release on Dockerhub
+
+on:
+  push:
+    tags:
+      - "v*"
+
+jobs:
+  release-image-on-dockerhub:
+    name: Release on Dockerhub
+    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: Checkout Repo
+        uses: actions/checkout@v2
+
+      - name: Log in to Docker Hub
+        uses: docker/login-action@v2
+        with:
+          username: ${{ secrets.DOCKER_USERNAME }}
+          password: ${{ secrets.DOCKER_PASSWORD }}
+
+      - name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v2
+
+      - name: Get Release Tag
+        id: extract_release_tag
+        run: |
+          TAG=${{ github.ref }}
+          TAG=${TAG#refs/tags/v}
+          echo "RELEASE_TAG=$TAG" >> $GITHUB_ENV
+
+      - name: Build and push Docker image
+        uses: docker/build-push-action@v4
+        with:
+          context: .
+          file: ./apps/web/Dockerfile
+          push: true
+          tags: |
+            ${{ secrets.DOCKER_USERNAME }}/formbricks:${{ env.RELEASE_TAG }}
+            ${{ secrets.DOCKER_USERNAME }}/formbricks:latest

.github/workflows/release.yml

@@ -1,40 +0,0 @@
-name: Release
-
-on:
-  push:
-    branches:
-      - main
-
-concurrency: ${{ github.workflow }}-${{ github.ref }}
-
-jobs:
-  release:
-    name: Release
-    runs-on: ubuntu-latest
-    env:
-      TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
-      TURBO_TEAM: ${{ secrets.TURBO_TEAM }}
-    steps:
-      - name: Checkout Repo
-        uses: actions/checkout@v2
-
-      - name: Setup Node.js 18.x
-        uses: actions/setup-node@v2
-        with:
-          node-version: 18.x
-
-      - name: Install pnpm
-        uses: pnpm/action-setup@v2.2.2
-
-      - name: Install Dependencies
-        run: pnpm install --config.platform=linux --config.architecture=x64
-
-      - name: Create Release Pull Request or Publish to npm
-        id: changesets
-        uses: changesets/action@v1
-        with:
-          # This expects you to have a script called release which does a build for your packages and calls changeset publish
-          publish: pnpm release
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}

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

@@ -0,0 +1,61 @@
+name: "Check PR"
+
+on:
+  pull_request_target:
+    types:
+      - opened
+      - reopened
+      - edited
+      - synchronize
+
+permissions:
+  pull-requests: write
+
+jobs:
+  validate-pr:
+    name: PR title
+    runs-on: ubuntu-latest
+    steps:
+      - uses: amannn/action-semantic-pull-request@v5
+        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
+        # condition you can continue the execution with the populated error message.
+        if: always() && (steps.lint_pr_title.outputs.error_message != null)
+        with:
+          header: pr-title-lint-error
+          message: |
+            Hey there and thank you for opening this pull request! 👋🏼
+
+            We require pull request titles to follow the [Conventional Commits specification](https://www.conventionalcommits.org/en/v1.0.0/) and it looks like your proposed title needs to be adjusted.
+
+            Details:
+
+            ```
+            ${{ steps.lint_pr_title.outputs.error_message }}
+            ```
+
+      # Delete a previous comment when the issue has been resolved
+      - if: ${{ steps.lint_pr_title.outputs.error_message == null }}
+        uses: marocchino/sticky-pull-request-comment@v2
+        with:
+          header: pr-title-lint-error
+          message: |
+            Thank you for following the naming conventions for pull request titles! 🙏

.github/workflows/test.yml

@@ -0,0 +1,36 @@
+name: Tests
+on:
+  workflow_call:
+jobs:
+  build:
+    name: Unit Tests
+    runs-on: ubuntu-latest
+    timeout-minutes: 15
+
+    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
+
+      - 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: Test
+        run: pnpm test

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

@@ -0,0 +1,27 @@
+name: "Welcome new contributors"
+
+on:
+  issues:
+    types: opened
+  pull_request:
+    types: opened
+
+permissions:
+  pull-requests: write
+  issues: write
+
+jobs:
+  welcome-message:
+    name: Welcoming New Users
+    runs-on: ubuntu-latest
+    timeout-minutes: 10
+    if: github.event.action == 'opened'
+    steps:
+      - uses: actions/first-interaction@v1
+        with:
+          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. 😊
+          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

@@ -33,6 +33,10 @@ yarn-error.log*
 .env.test.local
 .env.production.local
 !packages/database/.env
+!apps/web/.env
+
+# Prisma generated files
+packages/database/zod
 
 # turbo
 .turbo
@@ -40,4 +44,21 @@ yarn-error.log*
 # nixos stuff
 .direnv
 
-Zone.Identifier
+Zone.Identifier
+
+# Playwright
+/test-results/
+/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

.gitpod/init.bash

@@ -0,0 +1,18 @@
+#!/bin/bash
+
+images=($(yq eval '.services.*.image' packages/database/docker-compose.yml))
+
+pull_image() {
+  docker pull "$1"
+}
+
+# install packages in background
+pnpm i &
+
+# pull images
+for image in "${images[@]}"
+do
+  pull_image "$image" &
+done
+
+wait

.gitpod/setup-demo.bash

@@ -0,0 +1,5 @@
+for task in $(yq -r -oy '.pipeline."@formbricks/demo#go".dependsOn[]' turbo.json); do
+  package="${task%#*}"
+  command="${task#*#}"
+  turbo --filter "$package" $command
+done

.gitpod/setup-web.bash

@@ -0,0 +1,5 @@
+for task in $(yq -r -oy '.pipeline."@formbricks/web#go".dependsOn[]' turbo.json); do
+  package="${task%#*}"
+  command="${task#*#}"
+  turbo --filter "$package" $command
+done

.husky/pre-commit

@@ -0,0 +1 @@
+pnpm lint-staged

.npmrc

@@ -3,4 +3,7 @@ link-workspace-packages = true
 shamefully-hoist = true
 shared-workspace-shrinkwrap = true
 access = public
-enable-pre-post-scripts = true
+enable-pre-post-scripts = true
+legacy-peer-deps=true
+node-linker=hoisted
+save-exact=true

.nvmrc

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

.prettierrc.js

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

.vercelignore

@@ -0,0 +1 @@
+apps/web/.env

.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",
-      "type": "firefox",
-      "request": "launch",
       "reAttach": true,
+      "request": "launch",
+      "type": "firefox",
       "url": "http://localhost:3002/",
       "webRoot": "${workspaceFolder}"
     },
     {
       "name": "Attach",
-      "type": "firefox",
-      "request": "attach"
+      "request": "attach",
+      "type": "firefox"
     }
-  ]
+  ],
+  // 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.tsdk": "node_modules/typescript/lib",
-  "typescript.preferences.importModuleSpecifier": "non-relative"
+  "typescript.preferences.importModuleSpecifier": "non-relative",
+  "typescript.tsdk": "node_modules/typescript/lib"
 }

CODE_OF_CONDUCT.md

@@ -0,0 +1,69 @@
+# Code of Conduct
+
+## Our Pledge
+
+In the interest of fostering an open and welcoming environment, we as contributors and maintainers pledge to make participation in Formbricks and our community a harassment-free experience for everyone, regardless of age, body size, disability, ethnicity, gender identity and expression, level of experience, education, socio-economic status, nationality, personal appearance, race, religion, or sexual identity and orientation.
+
+## Our Standards
+
+Examples of behavior that contributes to creating a positive environment include:
+
+- Using welcoming and inclusive language
+- Being respectful of differing viewpoints and experiences
+- Gracefully accepting constructive criticism
+- Focusing on what is best for the community
+- Showing empathy towards other community members
+
+Examples of unacceptable behavior by participants include:
+
+- The use of sexualized language or imagery and unwelcome sexual attention or advances
+- Trolling, insulting/derogatory comments, and personal or political attacks
+- Public or private harassment
+- Publishing others' private information, such as a physical or electronic address, without explicit permission
+- Other conduct that could reasonably be considered inappropriate in a professional setting
+
+## Our Responsibilities
+
+We as project maintainers are responsible for clarifying the standards of acceptable behavior and are expected to take appropriate and fair corrective action in response to any instances of unacceptable behavior.
+
+We have the right and responsibility to remove, edit, or reject comments, commits, code, wiki edits, issues, and other contributions that are not aligned with this Code of Conduct, or to ban temporarily or permanently any contributor for other behaviors that they deem inappropriate, threatening, offensive, or harmful.
+
+## Scope
+
+This Code of Conduct applies both within project spaces and in public spaces when an individual is representing the project or its community. Examples of representing a project or community include using an official project email address, posting via an official social media account, or acting as an appointed representative at an online or offline event.
+
+## Enforcement
+
+Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by contacting the project team at hola@formbricks.com - all complaints will be reviewed and investigated and will result in a response that is deemed necessary and appropriate to the circumstances. The project team is obligated to maintain confidentiality with regard to the reporter of an incident.
+
+## Enforcement Guidelines
+
+Community managers will follow these Community Impact Guidelines in determining the consequences for any action they deem in violation of this Code of Conduct:
+
+### 1. Correction
+
+**Community Impact**: Use of inappropriate language or other behavior deemed unprofessional or unwelcome in the community.
+
+**Consequence**: A private, written warning from community leaders, providing clarity around the nature of the violation and an explanation of why the behavior was inappropriate. A public apology may be requested.
+
+### 2. Warning
+
+**Community Impact**: A violation through a single incident or series of actions.
+
+**Consequence**: A warning with consequences for continued behavior. No interaction with the people involved, including unsolicited interaction with those enforcing the Code of Conduct, for a specified period of time. This includes avoiding interactions in community spaces as well as external channels like social media. Violating these terms may lead to a temporary or permanent ban.
+
+### 3. Temporary Ban
+
+**Community Impact**: A serious violation of community standards, including sustained inappropriate behavior.
+
+**Consequence**: A temporary ban from any sort of interaction or public communication with the community for a specified period of time. No public of private interaction with the people involved, including unsolicited interaction with those enforcing the Code of Conduct, is allowed during this period. Violating these terms may lead to a permanent ban.
+
+### 4. Permanent Ban
+
+**Community Impact**: Demonstrating a pattern of violation of community standards, including sustained inappropriate behavior, harassment of an individual, or aggression toward or disparagement of classes of individuals.
+
+**Consequence**: A permanent ban from any sort of public interaction within the community.
+
+## Attribution
+
+This Code of Conduct is adapted from the Contributor Covenant, version 2.0, available at [https://www.contributor-covenant.org/version/2/0/code_of_conduct.html](https://www.contributor-covenant.org/version/2/0/code_of_conduct.html).

CONTRIBUTING.md

@@ -1,29 +1,33 @@
-We are so happy that you are interested in contributing to Formbricks 🤗
+# 🚀 Join the Formbricks Tribe! 🧱
 
-There are many ways to contribute to Formbricks with writing Issues, fixing bugs, building new features or updating the docs.
+First and foremost, we're absolutely thrilled that you're considering becoming a part of the Formbricks Tribe! 🤗
 
-# Issues
+Discover a myriad of ways to leave your mark on Formbricks — whether it's by squashing bugs, crafting new features, or enhancing our documentation.
 
-Spotted a bug? Has deployment gone wrong? Do you have user feedback? [Raise an issue](https://github.com/formbricks/formbricks/issues/new/choose) for the fastest response.
+## 🐛 Issue Hunters
 
-... or pick up and fix an issue if you want to do a Pull Request.
+Did you stumble upon a bug? Encountered a hiccup in deployment? Perhaps you have some user feedback to share? Your quickest route to help us out is by [raising an issue](https://github.com/formbricks/formbricks/issues/new/choose). We're on standby to respond swiftly.
 
-# Feature requests
+## 💡 Feature Architects
 
-Raise an issue for these and tag it as an Enhancement. We love every idea. Please give us as much context on the why as possible.
+Are you brimming with brilliant ideas? For new features that can elevate Formbricks, create an issue and slap on the "Enhancement" tag. We adore every concept that you throw our way. Just make sure to provide us with the "why" behind your idea. We're all ears!
 
-# Creating a PR
+## 🛠 Crafting Pull Requests
 
-Please fork the repository, make your changes and create a new pull request if you want to make an update.
+Ready to dive into the code and make a real impact? Here's your path:
 
-If you want to speak to us before doing lots of work, please join our [Discord server](https://formbricks.com/discord) and tell us what you would like to work on - we're very responsive and friendly!
+1. **Read our Best Practices**: [It takes 5 minutes](https://formbricks.com/docs/developer-docs/contributing/get-started) but will help you save hours 🤓
 
-For QA of your Pull-Request, you can also get in touch with Matti on Discord. But we will also get to your PR without you taking additional action ;-)
+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.
 
-# Features
+1. **Tweak and Transform:** Work your coding magic and apply your changes.
 
-We are currently working on having a clear [Roadmap](https://github.com/orgs/formbricks/projects/1) for the next steps ahead.
+1. **Pull Request Act:** If you're ready to go, craft a new pull request closely following our PR template 🙏
 
-But you can also pick a feature that is not already on the roadmap if you think it creates a positive impact for Formbricks.
+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!
 
-If you are at all unsure, just raise it as an enhancement issue first and tell us that you like to work on it, and we'll very quickly respond.
+## 🚀 Aspiring Features
+
+If you spot a feature that isn't part of our official plan but could propel Formbricks forward, don't hesitate. Raise it as an enhancement issue, and let us know you're ready to take the lead. We'll be quick to respond.
+
+Together, let's craft the future of Formbricks, making it better, bolder, and more brilliant! 🚀🧱🌟

LICENSE

@@ -1,9 +1,9 @@
-Copyright (c) 2023 Matthias Nannt, Johannes Dancker
+Copyright (c) 2024 Formbricks GmbH
 
 Portions of this software are licensed as follows:
 
-- 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/" directory of this repository, if that directory exists, is licensed under the "MIT" license as defined in "packages/js/LICENSE".
+- 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 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.
 
@@ -67,7 +67,7 @@ modification follow.
 
                        TERMS AND CONDITIONS
 
-0. Definitions.
+1. Definitions.
 
 "This License" refers to version 3 of the GNU Affero General Public License.
 

README.md

@@ -1,78 +1,241 @@
-<p align="center">
-<a href="https://github.com/formbricks/formbricks">
-    <img src="https://user-images.githubusercontent.com/675065/203262290-3c2bc5b8-839c-468a-b675-e26a369c7fe2.png" alt="Logo" width="500">
-  </a>
-  <h3 align="center">Formbricks</h3>
+<div id="top"></div>
 
-  <p align="center">
-    The Open Source Survey & Experience Management solution for fast growing companies
-    <br />
-    <a href="https://formbricks.com/">Website</a>  |  <a href="https://formbricks.com/discord">Join Discord community</a>
-  </p>
+<p align="center">Help us grow and star us on Github! ⭐️</p>
+
+<p align="center">
+
+<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">
+
+</a>
+
+<h3 align="center">Formbricks</h3>
+
+<p align="center">
+Harvest user-insights, build irresistible experiences.
+<br />
+<a href="https://formbricks.com/">Website</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://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/snoopforms"><img src="https://img.shields.io/badge/Product%20Hunt-%232%20Product%20of%20the%20Day-orange?logo=producthunt&logoColor=%23fff" alt="Product Hunt"></a>
+<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>
 
 <br/>
 
-## About Formbricks
+<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>
+<div>
 
-<img width="1527" alt="formbricks-sneak" src="https://user-images.githubusercontent.com/675065/227726212-6ebf930e-6a20-4ffa-b966-56cd41bdf363.png">
+<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>
 
-Formbricks productizes best practices for qualitative in-app user discovery. Use micro-surveys to target the right users at the right time without making surveys annoying.
+## ✨ About Formbricks
 
-**Try it out in the cloud at [formbricks.com](https://formbricks.com)**
+<img width="1527" alt="formbricks-sneak" src="https://github-production-user-asset-6210df.s3.amazonaws.com/675065/249441967-ccb89ea3-82b4-4bf2-8d2c-528721ec313b.png">
 
-### Mission: Base your decisions on qualitative data.
+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.
 
-Formbricks helps you apply best practices from data-driven work and experience management to make better business decisions. Use Formbricks to collect and manage insights from your users; run a product market fit survey to know which audience to focus on and whether your value proposition is being recognized.
+**Try it out in the cloud at [formbricks.com](https://app.formbricks.com/auth/signup)**
+
+## 💪 Mission: Empower your team, craft an irresistible experience.
+
+Formbricks is both a free and open source survey platform - and a privacy-first experience management platform. Use in-app, website, link and email surveys to gather user and customer insights at every point of their journey. Leverage Formbricks Insight Platform or build your own. Life's too short for mediocre UX.
+
+### Table of Contents
+
+- [Features](#features)
+
+- [Getting Started](#getting-started)
+
+- [Cloud Version](#cloud-version)
+
+- [Self-hosted Version](#self-hosted-version)
+
+- [Development](#development)
+
+- [Contribution](#contribution)
+
+- [Contact](#contact-us)
+
+- [Security](#security)
+
+- [License](#license)
+
+<a id="features"></a>
 
 ### Features
 
-- 📲 Create in-product surveys with our no code editor with multiple question types
-- 📚 Choose from a variety of best-practice templates
-- 👩🏻 Launch and target your surveys to specific user groups without changing your application code
-- 🔗 Create shareable link surveys
-- 👨‍👩‍👦 Invite your team members to collaborate on your surveys
-- 🔌 Integrate Formbricks with Slack, Posthog, Zapier and more
-- 🔒 All open source, transparent and self-hostable
+- 📲 Create **conversion-optimized surveys** with our no-code editor with several question types.
 
-### Built With
+- 📚 Choose from a variety of best-practice **templates**.
 
-- [Typescript](https://www.typescriptlang.org/)
-- [Next.js](https://nextjs.org/)
-- [React](https://reactjs.org/)
-- [TailwindCSS](https://tailwindcss.com/)
-- [Prisma](https://prisma.io/)
+- 👩🏻 Launch and **target your surveys to specific user groups** without changing your application code.
 
-### Upcoming Features
+- 🔗 Create shareable **link surveys**.
 
-|     | Feature                                    |
-| --- | ------------------------------------------ |
-| 👷  | Zapier, Slack & Posthog Integration        |
-| 👷  | Branching Logic in Surveys                 |
-| 🗒️  | Filtering Options in Survey Analysis       |
-| 🗒️  | Multi-Language Functionality               |
-| 🗒️  | Auto-complete Surveys after at x responses |
-| 🗒️  | Pre-Fill Link-Surveys                      |
-| 🗒️  | E-Mail Surveys                             |
+- 👨‍👩‍👦 Invite your organization members to **collaborate** on your surveys.
 
-_👷 In Progress | 🗒️ Up Next_
+- 🔌 Integrate Formbricks with **Slack, Notion, Zapier, n8n and more**.
 
-## Cloud vs. self-hosted
+- 🔒 All **open source**, transparent and self-hostable.
 
-Formbricks is available Open-Source under AGPLv3 license. You can host Formbricks on your own servers without a subscription. Check out our [docs](https://formbricks.com/docs/self-hosting/deployment) to see how to self-host Formbricks.
+### Built on Open Source
 
-We also have a hosted cloud offering with a generous free plan to get you up and running as quickly as possible. For more information, please visit [formbricks.com](https://formbricks.com)
+- 💻 [Typescript](https://www.typescriptlang.org/)
 
-(In the future we may develop additional features that aren't in the free Open-Source version)
+- 🚀 [Next.js](https://nextjs.org/)
 
-## Contributing
+- ⚛️ [React](https://reactjs.org/)
+
+- 🎨 [TailwindCSS](https://tailwindcss.com/)
+
+- 📚 [Prisma](https://prisma.io/)
+
+- 🔒 [Auth.js](https://authjs.dev/)
+
+- 🧘‍♂️ [Zod](https://zod.dev/)
+
+- 🐛 [Vitest](https://vitest.dev/)
+
+<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>
+
+### ☁️ 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>
+
+### 🐳 Self-hosting Formbricks
+
+Formbricks is available Open-Source under AGPLv3 license. You can host Formbricks on your own servers using Docker without a subscription.
+
+If you opt for self-hosting Formbricks, here are a few options to consider:
+
+#### Docker
+
+To get started with self-hosting with Docker, take a look at our [self-hosting docs](https://formbricks.com/docs/self-hosting/deployment).
+
+#### Community-managed One Click Hosting
+
+##### Railway
+
+You can deploy Formbricks on [Railway](https://railway.app) using the button below.
+
+[![Deploy on Railway](https://railway.app/button.svg)](https://railway.app/new/template/PPDzCd)
+
+##### RepoCloud
+
+Or you can also deploy Formbricks on [RepoCloud](https://repocloud.io) using the button below.
+
+[![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
+
+Here is what you need to be able to run Formbricks:
+
+- [Node.js](https://nodejs.org/en) (Version: >=18.x)
+
+- [Pnpm](https://pnpm.io/)
+
+- [Docker](https://www.docker.com/) - to run PostgreSQL and MailHog
+
+### 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).
+
+### Gitpod Setup
+
+1. Click the button below to open this project in Gitpod.
+
+2. This will open a fully configured workspace in your browser with all the necessary dependencies already installed.
+
+[![Open in Gitpod](https://gitpod.io/button/open-in-gitpod.svg)](https://gitpod.io/#https://github.com/formbricks/formbricks)
+
+<a id="contribution"></a>
+
+## ✍️ Contribution
 
 We are very happy if you are interested in contributing to Formbricks 🤗
 
-There are many ways to contribute to Formbricks with writing Issues, fixing bugs, building new features or updating the docs. Please check out [our contribution guide](https://formbricks.com/docs/contributing/introduction) for more information.
+Here are a few options:
+
+- Star this repo.
+
+- Create issues every time you feel something is missing or goes wrong.
+
+- 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.
+
+## All Thanks To Our Contributors
+
+<a href="https://github.com/formbricks/formbricks/graphs/contributors">
+
+<img src="https://contrib.rocks/image?repo=formbricks/formbricks" />
+
+</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 id="license"></a>
+
+<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>

SECURITY.md

@@ -0,0 +1,75 @@
+# Security Policy of Formbricks
+
+This is Formbrick's security policy. Please reach out to us
+on Github or, if privately, via <security@formbricks.com>
+
+## Introduction
+
+Formbricks is dedicated to maintaining the integrity and security of our systems and our clients' data. In our pursuit to keep our technology environment safe, we welcome the collaborative efforts of our user community and security researchers to enhance security protocols and continuously secure our platform. This security policy outlines our approach towards handling data, ensuring secure practices, and managing the disclosure of vulnerabilities.
+
+## I. Third-Party Data Usage Policy
+
+We affirm our commitment towards meticulous validation of data usage and collection scope by any third-party library or integration utilized in our operations. We adhere to the following protocols:
+
+- Rigorous vetting of third-party services to confirm adherence to our data usage and privacy standards.
+- Continuous monitoring and assessment of third-party practices to ensure ongoing compliance.
+- Immediate action to mitigate risks if a third-party deviates from agreed-upon data practices.
+
+## II. Annual Penetration Testing (Pentest)
+
+To understand and bolster our security stature, Formbricks undertakes:
+
+- Annual penetration testing executed by an independent, skilled third party.
+- Prioritization of any identified issues, with immediate action on critical vulnerabilities.
+- Transparent communication and learnings shared with relevant stakeholders.
+
+## III. Vulnerability Reporting and Management
+
+Please do not use attacks on physical security, social engineering, distributed denial of service, spam or applications of third parties.
+
+### **A. When to Report a Vulnerability**
+
+We invite you to report if:
+
+- A potential security vulnerability in Formbricks is identified.
+- There is uncertainty about how a vulnerability affects our platform.
+- A vulnerability is detected in a dependent project of Formbricks.
+- An action was executed which, in your belief, should be restricted.
+
+### **B. When Reporting is Unnecessary**
+
+Avoid reporting if:
+
+- Assistance is needed to optimize Formbricks for security – please engage on Github Discussions for this.
+- Help is required for applying security-related updates.
+- The concern is not related to security.
+
+### **C. Vulnerability Reporting Procedure**
+
+In the interest of responsibly managing vulnerabilities, please adhere to the following procedure:
+
+> 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).
+   - Include:
+     - Problem description.
+     - Detailed, reproducible steps, with screenshots where possible.
+     - Affected version(s).
+     - Known possible mitigations.
+     - Your 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.
+3. **Ongoing Communication**:
+   - A project maintainer may engage with you for additional details or clarification.
+   - We appreciate your patience as we explore the reported item, verify its authenticity, and ascertain the existence of a vulnerability.
+
+---
+
+### Please Read the below carefully
+
+If you have followed the instructions above, we will **not** take any legal action against you in regard to the report,
+We will handle your report with strict confidentiality, and not pass on your personal details to third parties without your permission, We will keep you informed of the progress towards resolving the problem, In the public information concerning the problem reported, we will give your name as the discoverer of the problem (unless you desire otherwise).
+
+We, at Formbricks, wish to express our gratitude towards all individuals who assist us in fortifying our security posture. Your responsible disclosure and cooperation enable us to elevate our security protocols, safeguarding our platform and data therein.

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

@@ -0,0 +1,2 @@
+EXPO_PUBLIC_API_HOST=http://192.168.178.20:3000
+EXPO_PUBLIC_FORMBRICKS_ENVIRONMENT_ID=clzr04nkd000bcdl110j0ijyq

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

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

apps/demo-react-native/.gitignore

@@ -0,0 +1,35 @@
+# 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

@@ -0,0 +1,34 @@
+{
+  "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",
+    "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

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

apps/demo-react-native/index.js

@@ -0,0 +1,7 @@
+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

@@ -0,0 +1,21 @@
+// 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

@@ -0,0 +1,29 @@
+{
+  "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:*",
+    "expo": "52.0.18",
+    "expo-status-bar": "2.0.0",
+    "react": "18.3.1",
+    "react-dom": "18.3.1",
+    "react-native": "0.76.5",
+    "react-native-webview": "13.12.5"
+  },
+  "devDependencies": {
+    "@babel/core": "7.26.0",
+    "@types/react": "19.0.1",
+    "typescript": "5.7.2"
+  },
+  "private": true
+}

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

@@ -0,0 +1,53 @@
+import { StatusBar } from "expo-status-bar";
+import type { JSX } from "react";
+import { Button, LogBox, StyleSheet, Text, View } from "react-native";
+import Formbricks, { 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_API_HOST) {
+    throw new Error("EXPO_PUBLIC_API_HOST is required");
+  }
+
+  const config = {
+    environmentId: process.env.EXPO_PUBLIC_FORMBRICKS_ENVIRONMENT_ID,
+    apiHost: process.env.EXPO_PUBLIC_API_HOST,
+    userId: "random-user-id",
+    attributes: {
+      language: "en",
+      testAttr: "attr-test",
+    },
+  };
+
+  return (
+    <View style={styles.container}>
+      <Text>Formbricks React Native SDK Demo</Text>
+
+      <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);
+          });
+        }}
+      />
+      <StatusBar style="auto" />
+      <Formbricks initConfig={config} />
+    </View>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: "#fff",
+    alignItems: "center",
+    justifyContent: "center",
+  },
+});

apps/demo-react-native/tsconfig.json

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

apps/demo/.env.example

@@ -1,2 +1,5 @@
 NEXT_PUBLIC_FORMBRICKS_API_HOST=http://localhost:3000
-NEXT_PUBLIC_FORMBRICKS_ENVIRONMENT_ID=YOUR_ENVIRONMENT_ID
+NEXT_PUBLIC_FORMBRICKS_ENVIRONMENT_ID=YOUR_ENVIRONMENT_ID
+
+# Copy the environment ID for the URL of your Formbricks App and
+# paste it above to connect your Formbricks App with the Demo App.

apps/demo/.eslintrc.js

@@ -1,4 +1,3 @@
 module.exports = {
-  root: true,
-  extends: ["formbricks"],
+  extends: ["@formbricks/eslint-config/legacy-next.js"],
 };

apps/demo/README.md

@@ -1,38 +0,0 @@
-This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
-
-## Getting Started
-
-First, run the development server:
-
-```bash
-npm run dev
-# or
-yarn dev
-# or
-pnpm dev
-```
-
-Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
-
-You can start editing the page by modifying `pages/index.tsx`. The page auto-updates as you edit the file.
-
-[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.ts`.
-
-The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages.
-
-This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
-
-## Learn More
-
-To learn more about Next.js, take a look at the following resources:
-
-- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
-- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
-
-You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
-
-## Deploy on Vercel
-
-The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
-
-Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.

apps/demo/components/LayoutApp.tsx

@@ -1,6 +1,6 @@
-import Sidebar from "./Sidebar";
+import { Sidebar } from "./Sidebar";
 
-export default function LayoutApp({ children }: { children: React.ReactNode }) {
+export const LayoutApp = ({ children }: { children: React.ReactNode }) => {
   return (
     <div className="min-h-full">
       {/* Static sidebar for desktop */}
@@ -10,4 +10,4 @@ export default function LayoutApp({ children }: { children: React.ReactNode }) {
       <div className="flex flex-1 flex-col lg:pl-64">{children}</div>
     </div>
   );
-}
+};

apps/demo/components/Sidebar.tsx

@@ -1,31 +1,31 @@
-import { classNames } from "@/lib/utils";
 import {
   ClockIcon,
   CogIcon,
   CreditCardIcon,
-  DocumentChartBarIcon,
+  FileBarChartIcon,
+  HelpCircleIcon,
   HomeIcon,
-  QuestionMarkCircleIcon,
   ScaleIcon,
   ShieldCheckIcon,
-  UserGroupIcon,
-} from "@heroicons/react/24/outline";
+  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: UserGroupIcon, current: false },
-  { name: "Reports", href: "#", icon: DocumentChartBarIcon, 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: QuestionMarkCircleIcon },
+  { name: "Help", href: "#", icon: HelpCircleIcon },
   { name: "Privacy", href: "#", icon: ShieldCheckIcon },
 ];
 
-export default function Sidebar({}) {
+export const Sidebar = () => {
   return (
     <div className="flex flex-grow flex-col overflow-y-auto bg-cyan-700 pb-4 pt-5">
       <nav
@@ -62,4 +62,4 @@ export default function Sidebar({}) {
       </nav>
     </div>
   );
-}
+};

apps/demo/lib/utils.ts

@@ -1,3 +1,3 @@
-export function classNames(...classes: any) {
+export const 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/basic-features/typescript for more information.
+// see https://nextjs.org/docs/pages/api-reference/config/typescript for more information.

apps/demo/next.config.js

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

apps/demo/next.config.mjs

@@ -0,0 +1,17 @@
+/** @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,29 +4,21 @@
   "private": true,
   "scripts": {
     "clean": "rimraf .turbo node_modules .next",
-    "dev": "next dev -p 3002",
+    "dev": "next dev -p 3002 --turbopack",
+    "go": "next dev -p 3002 --turbopack",
     "build": "next build",
     "start": "next start",
     "lint": "next lint"
   },
   "dependencies": {
     "@formbricks/js": "workspace:*",
-    "@heroicons/react": "^2.0.17",
-    "@types/node": "18.15.11",
-    "@types/react": "18.0.33",
-    "@types/react-dom": "18.0.11",
-    "eslint": "8.37.0",
-    "eslint-config-formbricks": "workspace:*",
-    "next": "13.2.4",
-    "react": "18.2.0",
-    "react-dom": "18.2.0",
-    "typescript": "5.0.3"
+    "lucide-react": "0.468.0",
+    "next": "15.1.0",
+    "react": "19.0.0",
+    "react-dom": "19.0.0"
   },
   "devDependencies": {
-    "@tailwindcss/forms": "^0.5.3",
-    "autoprefixer": "^10.4.14",
-    "postcss": "^8.4.21",
-    "rimraf": "^5.0.0",
-    "tailwindcss": "^3.3.1"
+    "@formbricks/config-typescript": "workspace:*",
+    "@formbricks/eslint-config": "workspace:*"
   }
 }

apps/demo/pages/_app.tsx

@@ -1,47 +1,22 @@
-import formbricks from "@formbricks/js";
 import type { AppProps } from "next/app";
-import { useRouter } from "next/router";
-import { useEffect } from "react";
-import "../styles/globals.css";
-
-declare const window: any;
-
-if (typeof window !== "undefined") {
-  if (process.env.NEXT_PUBLIC_FORMBRICKS_ENVIRONMENT_ID && process.env.NEXT_PUBLIC_FORMBRICKS_API_HOST) {
-    formbricks.init({
-      environmentId: process.env.NEXT_PUBLIC_FORMBRICKS_ENVIRONMENT_ID,
-      apiHost: process.env.NEXT_PUBLIC_FORMBRICKS_API_HOST,
-      logLevel: "debug",
-    });
-    window.formbricks = formbricks;
-    formbricks.refresh();
-  }
-}
-
-export default function App({ Component, pageProps }: AppProps) {
-  const router = useRouter();
-
-  useEffect(() => {
-    // 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);
-      };
-    }
-  }, []);
+import Head from "next/head";
+import "../globals.css";
 
+const App = ({ Component, pageProps }: AppProps) => {
   return (
     <>
+      <Head>
+        <title>Demo App</title>
+      </Head>
       {(!process.env.NEXT_PUBLIC_FORMBRICKS_ENVIRONMENT_ID ||
         !process.env.NEXT_PUBLIC_FORMBRICKS_API_HOST) && (
         <div className="w-full bg-red-500 p-3 text-center text-sm text-white">
-          Please set Formbricks environment variables
+          Please set Formbricks environment variables in apps/demo/.env
         </div>
       )}
       <Component {...pageProps} />
     </>
   );
-}
+};
+
+export default App;

apps/demo/pages/_document.tsx

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

apps/demo/pages/app/index.tsx

@@ -1,378 +0,0 @@
-import LayoutApp from "@/components/LayoutApp";
-import { classNames } from "@/lib/utils";
-import { Bars3CenterLeftIcon, BellIcon, ScaleIcon } from "@heroicons/react/24/outline";
-import {
-  BanknotesIcon,
-  BuildingOfficeIcon,
-  CheckCircleIcon,
-  ChevronDownIcon,
-  ChevronRightIcon,
-  MagnifyingGlassIcon,
-} from "@heroicons/react/24/solid";
-import Image from "next/image";
-import formbricks from "@formbricks/js";
-
-const cards = [{ name: "Account balance", href: "#", icon: ScaleIcon, amount: "$30,659.45" }];
-const transactions = [
-  {
-    id: 1,
-    name: "Payment to Molly Sanders",
-    href: "#",
-    amount: "$20,000",
-    currency: "USD",
-    status: "success",
-    date: "July 11, 2020",
-    datetime: "2020-07-11",
-  },
-];
-const statusStyles: any = {
-  success: "bg-green-100 text-green-800",
-  processing: "bg-yellow-100 text-yellow-800",
-  failed: "bg-slate-100 text-slate-800",
-};
-
-export default function AppPage({}) {
-  return (
-    <LayoutApp>
-      <div className="flex h-16 flex-shrink-0 border-b border-slate-200 bg-white lg:border-none">
-        <button
-          type="button"
-          className="border-r border-slate-200 px-4 text-slate-400 focus:outline-none focus:ring-2 focus:ring-inset focus:ring-cyan-500 lg:hidden">
-          <span className="sr-only">Open sidebar</span>
-          <Bars3CenterLeftIcon className="h-6 w-6" aria-hidden="true" />
-        </button>
-        {/* Search bar */}
-        <div className="flex flex-1 justify-between px-4 sm:px-6 lg:mx-auto lg:max-w-6xl lg:px-8">
-          <div className="flex flex-1">
-            <form className="flex w-full md:ml-0" action="#" method="GET">
-              <label htmlFor="search-field" className="sr-only">
-                Search
-              </label>
-              <div className="relative w-full text-slate-400 focus-within:text-slate-600">
-                <div
-                  className="pointer-events-none absolute inset-y-0 left-0 flex items-center"
-                  aria-hidden="true">
-                  <MagnifyingGlassIcon className="h-5 w-5" aria-hidden="true" />
-                </div>
-                <input
-                  id="search-field"
-                  name="search-field"
-                  className="block h-full w-full border-transparent py-2 pl-8 pr-3 text-slate-900 placeholder-slate-500 focus:border-transparent focus:outline-none focus:ring-0 sm:text-sm"
-                  placeholder="Search transactions"
-                  type="search"
-                />
-              </div>
-            </form>
-          </div>
-          <div className="ml-4 flex items-center md:ml-6">
-            <button
-              className="mr-2 flex max-w-xs items-center rounded-full bg-white text-sm  font-medium text-slate-700 focus:outline-none focus:ring-2 focus:ring-cyan-500 focus:ring-offset-2 lg:rounded-md lg:p-2 lg:hover:bg-slate-50"
-              onClick={() => {
-                formbricks.track("Cancel Subscription");
-              }}>
-              Feedback
-            </button>
-            <button className="mr-2 flex max-w-xs items-center rounded-full bg-white text-sm  font-medium text-slate-700 focus:outline-none focus:ring-2 focus:ring-cyan-500 focus:ring-offset-2 lg:rounded-md lg:p-2 lg:hover:bg-slate-50">
-              No Code Feedback Btn Click
-            </button>
-            <button
-              className="mr-2 flex max-w-xs items-center rounded-full bg-white text-sm  font-medium text-slate-700 focus:outline-none focus:ring-2 focus:ring-cyan-500 focus:ring-offset-2 lg:rounded-md lg:p-2 lg:hover:bg-slate-50"
-              onClick={() => {
-                formbricks.setEmail("test@web.com");
-              }}>
-              Set Email
-            </button>
-            <button
-              className="mr-2 flex max-w-xs items-center rounded-full bg-white text-sm  font-medium text-slate-700 focus:outline-none focus:ring-2 focus:ring-cyan-500 focus:ring-offset-2 lg:rounded-md lg:p-2 lg:hover:bg-slate-50"
-              onClick={() => {
-                formbricks.setUserId("ASDASDAAAAAASSSSSSSASDASD");
-              }}>
-              Set Long UserID
-            </button>
-            <button
-              className="mr-2 flex max-w-xs items-center rounded-full bg-white text-sm  font-medium text-slate-700 focus:outline-none focus:ring-2 focus:ring-cyan-500 focus:ring-offset-2 lg:rounded-md lg:p-2 lg:hover:bg-slate-50"
-              onClick={() => {
-                formbricks.setAttribute("Plan", "Free");
-              }}>
-              Set attribute &quot;Free&quot;
-            </button>
-            <button
-              className="mr-2 flex max-w-xs items-center rounded-full bg-white text-sm  font-medium text-slate-700 focus:outline-none focus:ring-2 focus:ring-cyan-500 focus:ring-offset-2 lg:rounded-md lg:p-2 lg:hover:bg-slate-50"
-              onClick={() => {
-                formbricks.setAttribute("Plan", "Paid");
-              }}>
-              Set attribute &quot;Paid&quot;
-            </button>
-
-            {/* Profile dropdown */}
-            <div className="relative ml-3">
-              <div>
-                <button className="flex max-w-xs items-center rounded-full bg-white text-sm focus:outline-none focus:ring-2 focus:ring-cyan-500 focus:ring-offset-2 lg:rounded-md lg:p-2 lg:hover:bg-slate-50">
-                  <Image
-                    className="h-8 w-8 rounded-full"
-                    src="https://images.unsplash.com/photo-1494790108377-be9c29b29330?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80"
-                    width={32}
-                    height={32}
-                    alt=""
-                  />
-                  <span className="ml-3 hidden text-sm font-medium text-slate-700 lg:block">
-                    <span className="sr-only">Open user menu for </span>Emilia Birch
-                  </span>
-                  <ChevronDownIcon
-                    className="ml-1 hidden h-5 w-5 flex-shrink-0 text-slate-400 lg:block"
-                    aria-hidden="true"
-                  />
-                </button>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-      <main className="flex-1 pb-8">
-        {/* Page header */}
-        <div className="bg-white shadow">
-          <div className="px-4 sm:px-6 lg:mx-auto lg:max-w-6xl lg:px-8">
-            <div className="py-6 md:flex md:items-center md:justify-between lg:border-t lg:border-slate-200">
-              <div className="min-w-0 flex-1">
-                {/* Profile */}
-                <div className="flex items-center">
-                  <Image
-                    className="hidden h-16 w-16 rounded-full sm:block"
-                    src="https://images.unsplash.com/photo-1494790108377-be9c29b29330?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2.6&w=256&h=256&q=80"
-                    alt=""
-                    width={32}
-                    height={32}
-                  />
-                  <div>
-                    <div className="flex items-center">
-                      <Image
-                        className="h-16 w-16 rounded-full sm:hidden"
-                        src="https://images.unsplash.com/photo-1494790108377-be9c29b29330?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2.6&w=256&h=256&q=80"
-                        alt=""
-                        width={32}
-                        height={32}
-                      />
-                      <h1 className="ml-3 text-2xl font-bold leading-7 text-slate-900 sm:truncate sm:leading-9">
-                        Good morning, Emilia Birch
-                      </h1>
-                    </div>
-                    <dl className="mt-6 flex flex-col sm:ml-3 sm:mt-1 sm:flex-row sm:flex-wrap">
-                      <dt className="sr-only">Company</dt>
-                      <dd className="flex items-center text-sm font-medium capitalize text-slate-500 sm:mr-6">
-                        <BuildingOfficeIcon
-                          className="mr-1.5 h-5 w-5 flex-shrink-0 text-slate-400"
-                          aria-hidden="true"
-                        />
-                        Duke street studio
-                      </dd>
-                      <dt className="sr-only">Account status</dt>
-                      <dd className="mt-3 flex items-center text-sm font-medium capitalize text-slate-500 sm:mr-6 sm:mt-0">
-                        <CheckCircleIcon
-                          className="mr-1.5 h-5 w-5 flex-shrink-0 text-green-400"
-                          aria-hidden="true"
-                        />
-                        Verified account
-                      </dd>
-                    </dl>
-                  </div>
-                </div>
-              </div>
-              <div className="mt-6 flex space-x-3 md:ml-4 md:mt-0">
-                <button
-                  type="button"
-                  className="inline-flex items-center rounded-md border border-slate-300 bg-white px-4 py-2 text-sm font-medium text-slate-700 shadow-sm hover:bg-slate-50 focus:outline-none focus:ring-2 focus:ring-cyan-500 focus:ring-offset-2">
-                  Add money
-                </button>
-                <button
-                  type="button"
-                  className="inline-flex items-center rounded-md border border-transparent bg-cyan-600 px-4 py-2 text-sm font-medium text-white shadow-sm hover:bg-cyan-700 focus:outline-none focus:ring-2 focus:ring-cyan-500 focus:ring-offset-2">
-                  Send money
-                </button>
-              </div>
-            </div>
-          </div>
-        </div>
-
-        <div className="mt-8">
-          <div className="mx-auto max-w-6xl px-4 sm:px-6 lg:px-8">
-            <h2 className="text-lg font-medium leading-6 text-slate-900">Overview</h2>
-            <div className="mt-2 grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3">
-              {/* Card */}
-              {cards.map((card) => (
-                <div key={card.name} className="overflow-hidden rounded-lg bg-white shadow">
-                  <div className="p-5">
-                    <div className="flex items-center">
-                      <div className="flex-shrink-0">
-                        <card.icon className="h-6 w-6 text-slate-400" aria-hidden="true" />
-                      </div>
-                      <div className="ml-5 w-0 flex-1">
-                        <dl>
-                          <dt className="truncate text-sm font-medium text-slate-500">{card.name}</dt>
-                          <dd>
-                            <div className="text-lg font-medium text-slate-900">{card.amount}</div>
-                          </dd>
-                        </dl>
-                      </div>
-                    </div>
-                  </div>
-                  <div className="bg-slate-50 px-5 py-3">
-                    <div className="text-sm">
-                      <a href={card.href} className="font-medium text-cyan-700 hover:text-cyan-900">
-                        View all
-                      </a>
-                    </div>
-                  </div>
-                </div>
-              ))}
-            </div>
-          </div>
-
-          <h2 className="mx-auto mt-8 max-w-6xl px-4 text-lg font-medium leading-6 text-slate-900 sm:px-6 lg:px-8">
-            Recent activity
-          </h2>
-
-          {/* Activity list (smallest breakpoint only) */}
-          <div className="shadow sm:hidden">
-            <ul role="list" className="mt-2 divide-y divide-slate-200 overflow-hidden shadow sm:hidden">
-              {transactions.map((transaction) => (
-                <li key={transaction.id}>
-                  <a href={transaction.href} className="block bg-white px-4 py-4 hover:bg-slate-50">
-                    <span className="flex items-center space-x-4">
-                      <span className="flex flex-1 space-x-2 truncate">
-                        <BanknotesIcon className="h-5 w-5 flex-shrink-0 text-slate-400" aria-hidden="true" />
-                        <span className="flex flex-col truncate text-sm text-slate-500">
-                          <span className="truncate">{transaction.name}</span>
-                          <span>
-                            <span className="font-medium text-slate-900">{transaction.amount}</span>{" "}
-                            {transaction.currency}
-                          </span>
-                          <time dateTime={transaction.datetime}>{transaction.date}</time>
-                        </span>
-                      </span>
-                      <ChevronRightIcon className="h-5 w-5 flex-shrink-0 text-slate-400" aria-hidden="true" />
-                    </span>
-                  </a>
-                </li>
-              ))}
-            </ul>
-
-            <nav
-              className="flex items-center justify-between border-t border-slate-200 bg-white px-4 py-3"
-              aria-label="Pagination">
-              <div className="flex flex-1 justify-between">
-                <a
-                  href="#"
-                  className="relative inline-flex items-center rounded-md border border-slate-300 bg-white px-4 py-2 text-sm font-medium text-slate-700 hover:text-slate-500">
-                  Previous
-                </a>
-                <a
-                  href="#"
-                  className="relative ml-3 inline-flex items-center rounded-md border border-slate-300 bg-white px-4 py-2 text-sm font-medium text-slate-700 hover:text-slate-500">
-                  Next
-                </a>
-              </div>
-            </nav>
-          </div>
-
-          {/* Activity table (small breakpoint and up) */}
-          <div className="hidden sm:block">
-            <div className="mx-auto max-w-6xl px-4 sm:px-6 lg:px-8">
-              <div className="mt-2 flex flex-col">
-                <div className="min-w-full overflow-hidden overflow-x-auto align-middle shadow sm:rounded-lg">
-                  <table className="min-w-full divide-y divide-slate-200">
-                    <thead>
-                      <tr>
-                        <th
-                          className="bg-slate-50 px-6 py-3 text-left text-sm font-semibold text-slate-900"
-                          scope="col">
-                          Transaction
-                        </th>
-                        <th
-                          className="bg-slate-50 px-6 py-3 text-right text-sm font-semibold text-slate-900"
-                          scope="col">
-                          Amount
-                        </th>
-                        <th
-                          className="hidden bg-slate-50 px-6 py-3 text-left text-sm font-semibold text-slate-900 md:block"
-                          scope="col">
-                          Status
-                        </th>
-                        <th
-                          className="bg-slate-50 px-6 py-3 text-right text-sm font-semibold text-slate-900"
-                          scope="col">
-                          Date
-                        </th>
-                      </tr>
-                    </thead>
-                    <tbody className="divide-y divide-slate-200 bg-white">
-                      {transactions.map((transaction) => (
-                        <tr key={transaction.id} className="bg-white">
-                          <td className="w-full max-w-0 whitespace-nowrap px-6 py-4 text-sm text-slate-900">
-                            <div className="flex">
-                              <a
-                                href={transaction.href}
-                                className="group inline-flex space-x-2 truncate text-sm">
-                                <BanknotesIcon
-                                  className="h-5 w-5 flex-shrink-0 text-slate-400 group-hover:text-slate-500"
-                                  aria-hidden="true"
-                                />
-                                <p className="truncate text-slate-500 group-hover:text-slate-900">
-                                  {transaction.name}
-                                </p>
-                              </a>
-                            </div>
-                          </td>
-                          <td className="whitespace-nowrap px-6 py-4 text-right text-sm text-slate-500">
-                            <span className="font-medium text-slate-900">{transaction.amount}</span>
-                            {transaction.currency}
-                          </td>
-                          <td className="hidden whitespace-nowrap px-6 py-4 text-sm text-slate-500 md:block">
-                            <span
-                              className={classNames(
-                                statusStyles[transaction.status],
-                                "inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-medium capitalize"
-                              )}>
-                              {transaction.status}
-                            </span>
-                          </td>
-                          <td className="whitespace-nowrap px-6 py-4 text-right text-sm text-slate-500">
-                            <time dateTime={transaction.datetime}>{transaction.date}</time>
-                          </td>
-                        </tr>
-                      ))}
-                    </tbody>
-                  </table>
-                  {/* Pagination */}
-                  <nav
-                    className="flex items-center justify-between border-t border-slate-200 bg-white px-4 py-3 sm:px-6"
-                    aria-label="Pagination">
-                    <div className="hidden sm:block">
-                      <p className="text-sm text-slate-700">
-                        Showing <span className="font-medium">1</span> to{" "}
-                        <span className="font-medium">10</span> of <span className="font-medium">20</span>{" "}
-                        results
-                      </p>
-                    </div>
-                    <div className="flex flex-1 justify-between sm:justify-end">
-                      <a
-                        href="#"
-                        id="test-css"
-                        className="relative inline-flex items-center rounded-md border border-slate-300 bg-white px-4 py-2 text-sm font-medium text-slate-700 hover:bg-slate-50">
-                        CSS ID Test
-                      </a>
-                      <a
-                        href="#"
-                        className="relative ml-3 inline-flex items-center rounded-md border border-slate-300 bg-white px-4 py-2 text-sm font-medium text-slate-700 hover:bg-slate-50">
-                        Next
-                      </a>
-                    </div>
-                  </nav>
-                </div>
-              </div>
-            </div>
-          </div>
-        </div>
-      </main>
-    </LayoutApp>
-  );
-}

apps/demo/pages/index.tsx

@@ -0,0 +1,239 @@
+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;
+
+const 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(() => {
+    // enable Formbricks debug mode by adding formbricksDebug=true GET parameter
+    const addFormbricksDebugParam = () => {
+      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",
+      };
+
+      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", handleRouteChange);
+
+      return () => {
+        router.events.off("routeChangeComplete", handleRouteChange);
+      };
+    }
+  }, [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
+          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>
+                  <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 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"
+              onClick={() => {
+                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 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"
+                  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-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"
+                  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-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"
+                  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-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"
+                  className="underline dark:text-blue-500">
+                  user email
+                </a>{" "}
+                &apos;test@web.com&apos;
+              </p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default AppPage;

apps/demo/pages/signin/index.tsx

@@ -1,152 +0,0 @@
-import formbricks from "@formbricks/js";
-import { useRouter } from "next/router";
-import { FormEvent } from "react";
-
-export default function SiginPage() {
-  const router = useRouter();
-
-  const submitAction = (e: FormEvent) => {
-    e.preventDefault();
-    if (process.env.NEXT_PUBLIC_FORMBRICKS_ENVIRONMENT_ID && process.env.NEXT_PUBLIC_FORMBRICKS_API_HOST) {
-      formbricks.setEmail("matti@example.com");
-      formbricks.setUserId("123456");
-      formbricks.setAttribute("Plan", "Premium");
-    }
-    router.push("/app");
-  };
-  return (
-    <div className="flex min-h-full flex-col justify-center py-12 sm:px-6 lg:px-8">
-      <div className="sm:mx-auto sm:w-full sm:max-w-md">
-        <h2 className="mt-6 text-center text-3xl font-bold tracking-tight text-gray-900">
-          Sign in to your account
-        </h2>
-        <p className="mt-2 text-center text-sm text-gray-600">
-          Or{" "}
-          <a href="#" className="font-medium text-indigo-600 hover:text-indigo-500">
-            start your 14-day free trial
-          </a>
-        </p>
-      </div>
-
-      <div className="mt-8 sm:mx-auto sm:w-full sm:max-w-md">
-        <div className="bg-white px-4 py-8 shadow sm:rounded-lg sm:px-10">
-          <form className="space-y-6" onSubmit={submitAction}>
-            <div>
-              <label htmlFor="email" className="block text-sm font-medium leading-6 text-gray-900">
-                Email address
-              </label>
-              <div className="mt-2">
-                <input
-                  id="email"
-                  name="email"
-                  type="email"
-                  autoComplete="email"
-                  required
-                  className="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6"
-                />
-              </div>
-            </div>
-
-            <div>
-              <label htmlFor="password" className="block text-sm font-medium leading-6 text-gray-900">
-                Password
-              </label>
-              <div className="mt-2">
-                <input
-                  id="password"
-                  name="password"
-                  type="password"
-                  autoComplete="current-password"
-                  required
-                  className="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6"
-                />
-              </div>
-            </div>
-
-            <div className="flex items-center justify-between">
-              <div className="flex items-center">
-                <input
-                  id="remember-me"
-                  name="remember-me"
-                  type="checkbox"
-                  className="h-4 w-4 rounded border-gray-300 text-indigo-600 focus:ring-indigo-600"
-                />
-                <label htmlFor="remember-me" className="ml-2 block text-sm text-gray-900">
-                  Remember me
-                </label>
-              </div>
-
-              <div className="text-sm">
-                <a href="#" className="font-medium text-indigo-600 hover:text-indigo-500">
-                  Forgot your password?
-                </a>
-              </div>
-            </div>
-
-            <div>
-              <button
-                type="submit"
-                className="flex w-full justify-center rounded-md bg-indigo-500 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-indigo-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-indigo-600">
-                Sign in
-              </button>
-            </div>
-          </form>
-
-          <div className="mt-6">
-            <div className="relative">
-              <div className="absolute inset-0 flex items-center">
-                <div className="w-full border-t border-gray-300" />
-              </div>
-              <div className="relative flex justify-center text-sm">
-                <span className="bg-white px-2 text-gray-500">Or continue with</span>
-              </div>
-            </div>
-
-            <div className="mt-6 grid grid-cols-3 gap-3">
-              <div>
-                <a
-                  href="#"
-                  className="inline-flex w-full justify-center rounded-md bg-white px-4 py-2 text-gray-500 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50 focus:outline-offset-0">
-                  <span className="sr-only">Sign in with Facebook</span>
-                  <svg className="h-5 w-5" aria-hidden="true" fill="currentColor" viewBox="0 0 20 20">
-                    <path
-                      fillRule="evenodd"
-                      d="M20 10c0-5.523-4.477-10-10-10S0 4.477 0 10c0 4.991 3.657 9.128 8.438 9.878v-6.987h-2.54V10h2.54V7.797c0-2.506 1.492-3.89 3.777-3.89 1.094 0 2.238.195 2.238.195v2.46h-1.26c-1.243 0-1.63.771-1.63 1.562V10h2.773l-.443 2.89h-2.33v6.988C16.343 19.128 20 14.991 20 10z"
-                      clipRule="evenodd"
-                    />
-                  </svg>
-                </a>
-              </div>
-
-              <div>
-                <a
-                  href="#"
-                  className="inline-flex w-full justify-center rounded-md bg-white px-4 py-2 text-gray-500 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50 focus:outline-offset-0">
-                  <span className="sr-only">Sign in with Twitter</span>
-                  <svg className="h-5 w-5" aria-hidden="true" fill="currentColor" viewBox="0 0 20 20">
-                    <path d="M6.29 18.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0020 3.92a8.19 8.19 0 01-2.357.646 4.118 4.118 0 001.804-2.27 8.224 8.224 0 01-2.605.996 4.107 4.107 0 00-6.993 3.743 11.65 11.65 0 01-8.457-4.287 4.106 4.106 0 001.27 5.477A4.073 4.073 0 01.8 7.713v.052a4.105 4.105 0 003.292 4.022 4.095 4.095 0 01-1.853.07 4.108 4.108 0 003.834 2.85A8.233 8.233 0 010 16.407a11.616 11.616 0 006.29 1.84" />
-                  </svg>
-                </a>
-              </div>
-
-              <div>
-                <a
-                  href="#"
-                  className="inline-flex w-full justify-center rounded-md bg-white px-4 py-2 text-gray-500 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50 focus:outline-offset-0">
-                  <span className="sr-only">Sign in with GitHub</span>
-                  <svg className="h-5 w-5" aria-hidden="true" fill="currentColor" viewBox="0 0 20 20">
-                    <path
-                      fillRule="evenodd"
-                      d="M10 0C4.477 0 0 4.484 0 10.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0110 4.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.203 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.942.359.31.678.921.678 1.856 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0020 10.017C20 4.484 15.522 0 10 0z"
-                      clipRule="evenodd"
-                    />
-                  </svg>
-                </a>
-              </div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  );
-}

apps/demo/postcss.config.js

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

apps/demo/tailwind.config.js

@@ -5,6 +5,7 @@ module.exports = {
     "./pages/**/*.{js,ts,jsx,tsx}",
     "./components/**/*.{js,ts,jsx,tsx}",
   ],
+  darkMode: "class",
   theme: {
     extend: {},
   },

apps/demo/tsconfig.json

@@ -1,23 +1,5 @@
 {
-  "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"]
+  "exclude": ["node_modules"],
+  "extends": "@formbricks/config-typescript/nextjs.json",
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"]
 }

apps/docs/.env.example

@@ -0,0 +1,10 @@
+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=
+
+NEXT_PUBLIC_DOCSEARCH_APP_ID=
+NEXT_PUBLIC_DOCSEARCH_API_KEY=
+NEXT_PUBLIC_DOCSEARCH_INDEX_NAME=

apps/docs/.eslintrc.js

@@ -0,0 +1,3 @@
+module.exports = {
+  extends: ["@formbricks/eslint-config/legacy-next.js"],
+};

apps/docs/.gitignore

@@ -0,0 +1,38 @@
+# 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
+public/robots.txt

apps/docs/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.