Merge branch 'main' of https://github.com/Infisical/infisical into main

refactoring frontend (add eslint, absolute import)

.env.example

@@ -27,19 +27,14 @@ EMAIL_TOKEN_LIFETIME=
 # Required
 MONGO_URL=mongodb://root:example@mongo:27017/?authSource=admin
 
-# Optional credentials for MongoDB container instance
-MONGO_INITDB_ROOT_USERNAME=root
-MONGO_INITDB_ROOT_PASSWORD=example
-
-# Mongo-Express vars (needed for development only)
-ME_CONFIG_MONGODB_ADMINUSERNAME=root
-ME_CONFIG_MONGODB_ADMINPASSWORD=example
-ME_CONFIG_MONGODB_URL=mongodb://root:example@mongo:27017/
+# Optional credentials for MongoDB container instance and Mongo-Express
+MONGO_USERNAME=root
+MONGO_PASSWORD=example
 
 # Website URL
 # Required
-NODE_ENV=development
-NEXT_PUBLIC_WEBSITE_URL=http://localhost:8080
+
+SITE_URL=http://localhost:8080
 
 # Mail/SMTP
 # Required to send emails

.github/ISSUE_TEMPLATE/bug_report.md

@@ -0,0 +1,29 @@
+---
+name: Bug report
+about: Create a report to help us improve
+title: ''
+labels: bug
+assignees: ''
+
+---
+
+### Describe the bug
+A clear and concise description of what the bug is.
+
+### To Reproduce
+Steps to reproduce the behavior:
+1. Go to '...'
+2. Click on '....'
+3. Scroll down to '....'
+4. See error
+
+### Expected behavior
+A clear and concise description of what you expected to happen.
+
+### Screenshots
+If applicable, add screenshots to help explain your problem.
+
+### Platform you are having the issue on:
+
+### Additional context
+Add any other context about the problem here.

.github/ISSUE_TEMPLATE/feature_request.md

@@ -0,0 +1,17 @@
+---
+name: Feature Request
+about: Let us now what feature you would want to have in Infisical
+title: ''
+labels: 'feature request'
+assignees: ''
+
+---
+
+### Feature description
+A clear and concise description of what the the feature should be.
+
+### Why would it be useful?
+Why would this feature be useful for Infisical users? 
+
+### Additional context
+Add any other context about the problem here.

.github/workflows/docker-image.yml

@@ -0,0 +1,34 @@
+name: Push to Docker Hub
+
+on: [workflow_dispatch]
+
+jobs:
+  docker:
+    runs-on: ubuntu-latest
+    steps:
+      -
+        name: Set up QEMU
+        uses: docker/setup-qemu-action@v2
+      -
+        name: Set up Docker Buildx
+        uses: docker/setup-buildx-action@v2
+      -
+        name: Login to Docker Hub
+        uses: docker/login-action@v2
+        with:
+          username: ${{ secrets.DOCKERHUB_USERNAME }}
+          password: ${{ secrets.DOCKERHUB_TOKEN }}
+      -
+        name: Build and push backend
+        uses: docker/build-push-action@v3
+        with:
+          push: true
+          context: /backend
+          tags: infisical/backend:latest
+      -
+        name: Build and push frontend
+        uses: docker/build-push-action@v3
+        with:
+          push: true
+          context: /frontend
+          tags: infisical/frontend:latest

.gitignore

@@ -49,3 +49,6 @@ yarn-error.log*
 .env.production.local
 .vercel
 .env.infisical
+
+# Infisical init
+.infisical.json

CONTRIBUTING.md

@@ -2,6 +2,6 @@
 
 Thanks for taking the time to contribute! 😃 🚀
 
-Please refer to our [Contributing Guide](https://infisical.com/docs/contributing) for instructions on how to contribute.
+Please refer to our [Contributing Guide](https://infisical.com/docs/contributing/overview) for instructions on how to contribute.
 
 We also have some 🔥amazing🔥 merch for our contributors. Please reach out to tony@infisical.com for more info 👀

Makefile

@@ -5,10 +5,10 @@ push:
 	docker-compose -f docker-compose.yml push
 
 up-dev:
-	docker-compose -f docker-compose.dev.yml up
+	docker-compose -f docker-compose.dev.yml up --build
 
 up-prod:
-	docker-compose -f docker-compose.yml up
+	docker-compose -f docker-compose.yml up --build
 
 down:
-	docker-compose down
+	docker-compose down

README.md

@@ -7,9 +7,10 @@
 </p>
 
 <h4 align="center">
+  <a href="https://join.slack.com/t/infisical-users/shared_invite/zt-1kdbk07ro-RtoyEt_9E~fyzGo_xQYP6g">Slack</a> |
   <a href="https://infisical.com/signup">Infisical Cloud</a> |
-  <a href="https://infisical.com/docs/self_host_overview">Self-Hosting</a> |
-  <a href="https://infisical.com/docs/gettingStarted">Docs</a> |
+  <a href="https://infisical.com/docs/self-hosting/overview">Self-Hosting</a> |
+  <a href="https://infisical.com/docs/getting-started/introduction">Docs</a> |
   <a href="https://www.infisical.com">Website</a>
 </h4>
 
@@ -20,7 +21,7 @@
   <a href="https://github.com/infisical/infisical/blob/main/CONTRIBUTING.md">
     <img src="https://img.shields.io/badge/PRs-Welcome-brightgreen" alt="PRs welcome!" />
   </a>
-  <a href="https://join.slack.com/t/infisical/shared_invite/zt-1dgg63ln8-G7PCNJdCymAT9YF3j1ewVA">
+  <a href="https://join.slack.com/t/infisical-users/shared_invite/zt-1kdbk07ro-RtoyEt_9E~fyzGo_xQYP6g">
     <img src="https://img.shields.io/badge/chat-on%20Slack-blueviolet" alt="Slack community channel" />
   </a>
 </h4>
@@ -30,12 +31,12 @@
 **[Infisical](https://infisical.com)** is an open source, E2EE tool to help teams manage and sync environment variables across their development workflow and infrastructure. It's designed to be simple and take minutes to get going.
 
 - **User-Friendly Dashboard** to manage your team's environment variables within projects
-- **[Language-Agnostic CLI](https://infisical.com/docs/CLI)** that pulls and injects environment variables into your local workflow
-- **[Complete control over your data](https://infisical.com/docs/self_host_overview)** - host it yourself on any infrastructure
+- **[Language-Agnostic CLI](https://infisical.com/docs/cli/overview)** that pulls and injects environment variables into your local workflow
+- **[Complete control over your data](https://infisical.com/docs/self-hosting/overview)** - host it yourself on any infrastructure
 - **Navigate Multiple Environments** per project (e.g. development, staging, production, etc.)
 - **Personal/Shared** scoping for environment variables
-- **[Integrations](https://infisical.com/docs/Heroku)** with CI/CD and production infrastructure (Heroku available, more coming soon)
-- 🔜 **[1-Click Deploy](https://infisical.com/docs/linux)** to Digital Ocean and Heroku
+- **[Integrations](https://infisical.com/docs/integrations/heroku)** with CI/CD and production infrastructure (Heroku available, more coming soon)
+- 🔜 **1-Click Deploy** to Digital Ocean and Heroku
 - 🔜 **Authentication/Authorization** for projects (read/write controls soon)
 - 🔜 **Automatic Secret Rotation**
 - 🔜 **2FA**
@@ -44,21 +45,25 @@
 
 And more.
 
+## Get started
+
+To quickly get started, visit our [get started guide](https://infisical.com/docs/getting-started/introduction).
+
 ## What's cool about this?
 
 Infisical is simple, E2EE, and (soon to be) complete.
 
+According to a [report](https://www.ekransystem.com/en/blog/secrets-management) in 2019, only 10% of organizations use secret management solutions despite all using digital secrets to some extent.
+
 We're on a mission to make secret management more accessible to everyone — that means building for developers, not just security teams.
 
 If you care about efficiency and security, then Infisical is right for you.
 
-Need any integrations or want a new feature? Feel free to [create an issue](https://github.com/Infisical/infisical/issues) or [contribute](https://infisical.com/docs/contributing) directly to the repository.
+Need any integrations or want a new feature? Feel free to [create an issue](https://github.com/Infisical/infisical/issues) or [contribute](https://infisical.com/docs/contributing/overview) directly to the repository.
 
 ## Contributing
 
-For full documentation, visit [infisical.com/docs](https://infisical.com/docs).
-
-Whether it's big or small, we love contributions ❤️ Check out our guide to see how to [get started](./DEVELOPERS.md).
+Whether it's big or small, we love contributions ❤️ Check out our guide to see how to [get started](https://infisical.com/docs/contributing/overview).
 
 Not sure where to get started? [Book a free, non-pressure pairing sessions with one of our teammates](mailto:tony@infisical.com?subject=Pairing%20session&body=I'd%20like%20to%20do%20a%20pairing%20session!)!
 
@@ -66,7 +71,7 @@ Not sure where to get started? [Book a free, non-pressure pairing sessions with
 
 - [GitHub Discussions](https://github.com/Infisical/infisical/discussions) for help with building and discussion.
 - [GitHub Issues](https://github.com/Infisical/infisical-cli/issues) for any bugs and errors you encounter using Infisical.
-- [Community Slack](https://join.slack.com/t/infisical/shared_invite/zt-1dgg63ln8-G7PCNJdCymAT9YF3j1ewVA) for hanging out with the community and quick communication with the team.
+- [Community Slack](https://join.slack.com/t/infisical-users/shared_invite/zt-1kdbk07ro-RtoyEt_9E~fyzGo_xQYP6g) for hanging out with the community and quick communication with the team.
 
 ## Status
 
@@ -74,13 +79,21 @@ Not sure where to get started? [Book a free, non-pressure pairing sessions with
 - [ ] Public Beta: Stable enough for most non-enterprise use-cases.
 - [ ] Public: Production-ready.
 
+We're currently in Public Alpha.
+
+## Stay Up-to-Date
+
+Infisical officially launched as v.1.0 on November 21st, 2022. However, a lot of new features are coming very quickly. Watch **releases** of this repository to be notified about future updates:
+
+![infisical-star-github](https://github.com/Infisical/infisical/blob/main/.github/images/star-infisical.gif?raw=true)
+
 ## Integrations
 
 We're currently setting the foundation and building integrations so secrets can be synced everywhere. Any help is welcome! :)
 
-- [x] Docker
-- [x] Docker Compose
-- [x] Heroku
+- [x] [Docker](https://infisical.com/docs/integrations/docker)
+- [x] [Docker Compose](https://infisical.com/docs/integrations/docker-compose)
+- [x] [Heroku](https://infisical.com/docs/integrations/heroku)
 - [ ] Vercel
 - [ ] Kubernetes
 - [ ] AWS
@@ -90,8 +103,6 @@ We're currently setting the foundation and building integrations so secrets can
 - [ ] GitLab
 - [ ] CircleCI
 
-We're currently in Public Alpha.
-
 ## Open-source vs. paid
 
 This repo is entirely MIT licensed, with the exception of the `ee` directory which will contain premium enterprise features requring a Infisical license in the future. We're currently focused on developing non-enterprise offerings first that should suit most use-cases.
@@ -108,4 +119,4 @@ Looking to report a security vulnerability? Please don't post about it in GitHub
 <!-- prettier-ignore-start -->
 <!-- markdownlint-disable -->
 
-<a href="https://github.com/dangtony98"><img src="https://avatars.githubusercontent.com/u/25857006?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/vlad-matsiiako"><img src="https://avatars.githubusercontent.com/u/78047717?s=96&v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/maidul98"><img src="https://avatars.githubusercontent.com/u/9300960?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/hanywang2"><img src="https://avatars.githubusercontent.com/u/44352119?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/tobias-mintlify"><img src="https://avatars.githubusercontent.com/u/110702161?v=4" width="50" height="50" alt=""/></a>
+<a href="https://github.com/dangtony98"><img src="https://avatars.githubusercontent.com/u/25857006?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/mv-turtle"><img src="https://avatars.githubusercontent.com/u/78047717?s=96&v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/maidul98"><img src="https://avatars.githubusercontent.com/u/9300960?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/hanywang2"><img src="https://avatars.githubusercontent.com/u/44352119?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/tobias-mintlify"><img src="https://avatars.githubusercontent.com/u/110702161?v=4" width="50" height="50" alt=""/></a> <a href="https://github.com/gangjun06"><img src="https://avatars.githubusercontent.com/u/50910815?v=4" width="50" height="50" alt=""/></a>

backend/environment.d.ts

@@ -21,6 +21,7 @@ declare global {
       PRIVATE_KEY: string;
       PUBLIC_KEY: string;
       SENTRY_DSN: string;
+      SITE_URL: string;
       SMTP_HOST: string;
       SMTP_NAME: string;
       SMTP_PASSWORD: string;
@@ -31,7 +32,6 @@ declare global {
       STRIPE_PUBLISHABLE_KEY: string;
       STRIPE_SECRET_KEY: string;
       STRIPE_WEBHOOK_SECRET: string;
-      WEBSITE_URL: string;
     }
   }
 }

backend/src/config/index.ts

@@ -12,11 +12,12 @@ const MONGO_URL = process.env.MONGO_URL!;
 const NODE_ENV = process.env.NODE_ENV! || 'production';
 const OAUTH_CLIENT_SECRET_HEROKU = process.env.OAUTH_CLIENT_SECRET_HEROKU!;
 const OAUTH_TOKEN_URL_HEROKU = process.env.OAUTH_TOKEN_URL_HEROKU!;
-const POSTHOG_HOST = process.env.POSTHOG_HOST!;
-const POSTHOG_PROJECT_API_KEY = process.env.POSTHOG_PROJECT_API_KEY!;
+const POSTHOG_HOST = process.env.POSTHOG_HOST! || 'https://app.posthog.com';
+const POSTHOG_PROJECT_API_KEY = process.env.POSTHOG_PROJECT_API_KEY! || 'phc_nSin8j5q2zdhpFDI1ETmFNUIuTG4DwKVyIigrY10XiE';
 const PRIVATE_KEY = process.env.PRIVATE_KEY!;
 const PUBLIC_KEY = process.env.PUBLIC_KEY!;
 const SENTRY_DSN = process.env.SENTRY_DSN!;
+const SITE_URL = process.env.SITE_URL!;
 const SMTP_HOST = process.env.SMTP_HOST! || 'smtp.gmail.com';
 const SMTP_NAME = process.env.SMTP_NAME!;
 const SMTP_USERNAME = process.env.SMTP_USERNAME!;
@@ -27,7 +28,7 @@ const STRIPE_PRODUCT_STARTER = process.env.STRIPE_PRODUCT_STARTER!;
 const STRIPE_PUBLISHABLE_KEY = process.env.STRIPE_PUBLISHABLE_KEY!;
 const STRIPE_SECRET_KEY = process.env.STRIPE_SECRET_KEY!;
 const STRIPE_WEBHOOK_SECRET = process.env.STRIPE_WEBHOOK_SECRET!;
-const WEBSITE_URL = 'http://frontend:3000';
+const TELEMETRY_ENABLED = (process.env.TELEMETRY_ENABLED! !== 'false') && true;
 
 export {
 	PORT,
@@ -49,6 +50,7 @@ export {
 	PRIVATE_KEY,
 	PUBLIC_KEY,
 	SENTRY_DSN,
+	SITE_URL,
 	SMTP_HOST,
 	SMTP_NAME,
 	SMTP_USERNAME,
@@ -59,5 +61,5 @@ export {
 	STRIPE_PUBLISHABLE_KEY,
 	STRIPE_SECRET_KEY,
 	STRIPE_WEBHOOK_SECRET,
-	WEBSITE_URL
+	TELEMETRY_ENABLED
 };

backend/src/controllers/membershipController.ts

@@ -6,7 +6,7 @@ import {
 	deleteMembership as deleteMember
 } from '../helpers/membership';
 import { sendMail } from '../helpers/nodemailer';
-import { WEBSITE_URL } from '../config';
+import { SITE_URL } from '../config';
 import { ADMIN, MEMBER, GRANTED, ACCEPTED } from '../variables';
 
 /**
@@ -217,11 +217,10 @@ export const inviteUserToWorkspace = async (req: Request, res: Response) => {
 				inviterFirstName: req.user.firstName,
 				inviterEmail: req.user.email,
 				workspaceName: req.membership.workspace.name,
-				callback_url: WEBSITE_URL + '/login'
+				callback_url: SITE_URL + '/login'
 			}
 		});
 	} catch (err) {
-		console.error(err);
 		Sentry.setUser({ email: req.user.email });
 		Sentry.captureException(err);
 		return res.status(400).send({

backend/src/controllers/membershipOrgController.ts

@@ -1,7 +1,7 @@
 import { Request, Response } from 'express';
 import * as Sentry from '@sentry/node';
 import crypto from 'crypto';
-import { WEBSITE_URL, JWT_SIGNUP_LIFETIME, JWT_SIGNUP_SECRET } from '../config';
+import { SITE_URL, JWT_SIGNUP_LIFETIME, JWT_SIGNUP_SECRET } from '../config';
 import { MembershipOrg, Organization, User, Token } from '../models';
 import { deleteMembershipOrg as deleteMemberFromOrg } from '../helpers/membershipOrg';
 import { checkEmailVerification } from '../helpers/signup';
@@ -186,7 +186,7 @@ export const inviteUserToOrganization = async (req: Request, res: Response) => {
 					organizationName: organization.name,
 					email: inviteeEmail,
 					token,
-					callback_url: WEBSITE_URL + '/signupinvite'
+					callback_url: SITE_URL + '/signupinvite'
 				}
 			});
 		}

backend/src/controllers/organizationController.ts

@@ -1,11 +1,11 @@
 import { Request, Response } from 'express';
 import * as Sentry from '@sentry/node';
 import {
+	SITE_URL,
 	STRIPE_SECRET_KEY,
 	STRIPE_PRODUCT_STARTER,
 	STRIPE_PRODUCT_PRO,
-	STRIPE_PRODUCT_CARD_AUTH,
-	WEBSITE_URL
+	STRIPE_PRODUCT_CARD_AUTH
 } from '../config';
 import Stripe from 'stripe';
 const stripe = new Stripe(STRIPE_SECRET_KEY, {
@@ -350,13 +350,13 @@ export const createOrganizationPortalSession = async (
 				customer: req.membershipOrg.organization.customerId,
 				mode: 'setup',
 				payment_method_types: ['card'],
-				success_url: WEBSITE_URL + '/dashboard',
-				cancel_url: WEBSITE_URL + '/dashboard'
+				success_url: SITE_URL + '/dashboard',
+				cancel_url: SITE_URL + '/dashboard'
 			});
 		} else {
 			session = await stripe.billingPortal.sessions.create({
 				customer: req.membershipOrg.organization.customerId,
-				return_url: WEBSITE_URL + '/dashboard'
+				return_url: SITE_URL + '/dashboard'
 			});
 		}
 

backend/src/controllers/secretController.ts

@@ -7,16 +7,9 @@ import {
 	reformatPullSecrets
 } from '../helpers/secret';
 import { pushKeys } from '../helpers/key';
-import { PostHog } from 'posthog-node';
 import { ENV_SET } from '../variables';
-import { NODE_ENV, POSTHOG_PROJECT_API_KEY, POSTHOG_HOST } from '../config';
 
-let client: any;
-if (NODE_ENV === 'production' && POSTHOG_PROJECT_API_KEY && POSTHOG_HOST) {
-	client = new PostHog(POSTHOG_PROJECT_API_KEY, {
-		host: POSTHOG_HOST
-	});
-}
+import { postHogClient } from '../services';
 
 interface PushSecret {
 	ciphertextKey: string;
@@ -68,11 +61,10 @@ export const pushSecrets = async (req: Request, res: Response) => {
 			keys
 		});
 
-		if (client) {
-			// capture secrets pushed event in production
-			client.capture({
-				distinctId: req.user.email,
+		if (postHogClient) {
+			postHogClient.capture({
 				event: 'secrets pushed',
+				distinctId: req.user.email,
 				properties: {
 					numberOfSecrets: secrets.length,
 					environment,
@@ -81,6 +73,7 @@ export const pushSecrets = async (req: Request, res: Response) => {
 				}
 			});
 		}
+
 	} catch (err) {
 		Sentry.setUser({ email: req.user.email });
 		Sentry.captureException(err);
@@ -131,9 +124,9 @@ export const pullSecrets = async (req: Request, res: Response) => {
 			secrets = reformatPullSecrets({ secrets });
 		}
 
-		if (client) {
+		if (postHogClient) {
 			// capture secrets pushed event in production
-			client.capture({
+			postHogClient.capture({
 				distinctId: req.user.email,
 				event: 'secrets pulled',
 				properties: {
@@ -198,9 +191,9 @@ export const pullSecretsServiceToken = async (req: Request, res: Response) => {
 			workspace: req.serviceToken.workspace
 		};
 
-		if (client) {
+		if (postHogClient) {
 			// capture secrets pushed event in production
-			client.capture({
+			postHogClient.capture({
 				distinctId: req.serviceToken.user.email,
 				event: 'secrets pulled',
 				properties: {

backend/src/helpers/rateLimiter.ts

@@ -3,7 +3,7 @@ import rateLimit from 'express-rate-limit';
 // 300 requests per 15 minutes
 const apiLimiter = rateLimit({
 	windowMs: 15 * 60 * 1000,
-	max: 300,
+	max: 400,
 	standardHeaders: true,
 	legacyHeaders: false
 });
@@ -11,7 +11,7 @@ const apiLimiter = rateLimit({
 // 5 requests per hour
 const signupLimiter = rateLimit({
 	windowMs: 60 * 60 * 1000,
-	max: 5,
+	max: 10,
 	standardHeaders: true,
 	legacyHeaders: false
 });
@@ -19,7 +19,7 @@ const signupLimiter = rateLimit({
 // 10 requests per hour
 const loginLimiter = rateLimit({
 	windowMs: 60 * 60 * 1000,
-	max: 10,
+	max: 20,
 	standardHeaders: true,
 	legacyHeaders: false
 });
@@ -27,7 +27,7 @@ const loginLimiter = rateLimit({
 // 5 requests per hour
 const passwordLimiter = rateLimit({
 	windowMs: 60 * 60 * 1000,
-	max: 5,
+	max: 10,
 	standardHeaders: true,
 	legacyHeaders: false
 });

backend/src/index.ts

@@ -6,7 +6,8 @@ import mongoose from 'mongoose';
 import dotenv from 'dotenv';
 dotenv.config();
 import * as Sentry from '@sentry/node';
-import { PORT, SENTRY_DSN, NODE_ENV, MONGO_URL, WEBSITE_URL } from './config';
+// import { PostHogClient } from './services';
+import { PORT, SENTRY_DSN, NODE_ENV, MONGO_URL, SITE_URL, POSTHOG_PROJECT_API_KEY, POSTHOG_HOST, TELEMETRY_ENABLED } from './config';
 import { apiLimiter } from './helpers/rateLimiter';
 
 const app = express();
@@ -18,6 +19,12 @@ Sentry.init({
 	environment: NODE_ENV
 });
 
+// PostHogClient.init({
+// 	projectApiKey: POSTHOG_PROJECT_API_KEY,
+// 	host: POSTHOG_HOST,
+// 	telemetryEnabled: TELEMETRY_ENABLED
+// });
+
 import {
 	signup as signupRouter,
 	auth as authRouter,
@@ -38,7 +45,6 @@ import {
 } from './routes';
 
 const connectWithRetry = () => {
-	console.log('MONGO_URL', MONGO_URL);
 	mongoose.connect(MONGO_URL)
 	.then(() => console.log('Successfully connected to DB'))
 	.catch((e) => {
@@ -55,7 +61,7 @@ app.enable('trust proxy');
 app.use(cookieParser());
 app.use(cors({
 	credentials: true,
-	origin: WEBSITE_URL
+	origin: SITE_URL
 }));
 
 if (NODE_ENV === 'production') {

backend/src/routes/auth.ts

@@ -13,7 +13,7 @@ router.post(
 
 router.post(
 	'/login1',
-	// loginLimiter,
+	loginLimiter,
 	body('email').exists().trim().notEmpty(),
 	body('clientPublicKey').exists().trim().notEmpty(),
 	validateRequest,
@@ -22,7 +22,7 @@ router.post(
 
 router.post(
 	'/login2',
-	// loginLimiter,
+	loginLimiter,
 	body('email').exists().trim().notEmpty(),
 	body('clientProof').exists().trim().notEmpty(),
 	validateRequest,

backend/src/routes/signup.ts

@@ -7,7 +7,7 @@ import { signupLimiter } from '../helpers/rateLimiter';
 
 router.post(
 	'/email/signup',
-	// signupLimiter,
+	signupLimiter,
 	body('email').exists().trim().notEmpty().isEmail(),
 	validateRequest,
 	signupController.beginEmailSignup
@@ -15,7 +15,7 @@ router.post(
 
 router.post(
 	'/email/verify',
-	// signupLimiter,
+	signupLimiter,
 	body('email').exists().trim().notEmpty().isEmail(),
 	body('code').exists().trim().notEmpty(),
 	validateRequest,
@@ -24,7 +24,7 @@ router.post(
 
 router.post(
 	'/complete-account/signup',
-	// signupLimiter,
+	signupLimiter,
 	requireSignupAuth,
 	body('email').exists().trim().notEmpty().isEmail(),
 	body('firstName').exists().trim().notEmpty(),
@@ -42,7 +42,7 @@ router.post(
 
 router.post(
 	'/complete-account/invite',
-	// signupLimiter,
+	signupLimiter,
 	requireSignupAuth,
 	body('email').exists().trim().notEmpty().isEmail(),
 	body('firstName').exists().trim().notEmpty(),

backend/src/services/PostHogClient.ts

@@ -0,0 +1,15 @@
+import { PostHog } from 'posthog-node';
+import { NODE_ENV, POSTHOG_HOST, POSTHOG_PROJECT_API_KEY, TELEMETRY_ENABLED } from '../config';
+
+let postHogClient: any;
+if (
+    NODE_ENV === 'production'
+    && TELEMETRY_ENABLED
+) {
+    // case: enable opt-out telemetry in production
+    postHogClient = new PostHog(POSTHOG_PROJECT_API_KEY, {
+        host: POSTHOG_HOST
+    });
+}
+
+export default postHogClient;

backend/src/services/index.ts

@@ -0,0 +1,5 @@
+import postHogClient from './PostHogClient';
+
+export {
+    postHogClient
+}

cli/README.md

@@ -1,102 +0,0 @@
-## Install
-#### Windows 
-Use [Scoop](https://scoop.sh/) package manager
-
-```
-$ scoop bucket add org https://github.com/Infisical/scoop-infisical.git
-$ scoop install infisical
-$ infisical --version
-```
-
-To update:
-
-```
-$ scoop update infisical
-```
-
-#### Mac OS 
-Use [brew](https://brew.sh/) package manager
-
-```
-$ brew install infisical/get-cli/infisical  
-$ infisical --version
-```
-
-To update:
-
-```
-$ brew upgrade infisical
-```
-
-#### Linux
-##### Debian/Ubuntu (package manager: apt) 
-
-```
-Add Infisical apt repo 
-$ echo "deb [trusted=yes] https://apt.fury.io/infisical/ /" | tee -a /etc/apt/sources.list.d/infisical.list
-
-Add prerequisites
-$ apt update && apt -y install ca-certificates sudo 
-
-Install infisical cli
-$ sudo apt update && apt install infisical
-
-To make sure the CLI has been installed, you may run this command.
-$ infisical --version 
-```
-
-We do not yet have repositores setup for APK, YUM and APT package managers. However, we have several binaries which can be downloaded manually for your Linux. Please vist the [release age](https://github.com/Infisical/infisical/releases) 
-
-#### Install via bash and curl
-This script will attempt to download the correct version of Infisical CLI and add it to your path. No package manager needed.
-
-```
-curl https://raw.githubusercontent.com/Infisical/infisical/main/scripts/install.sh | sh
-```
-
-## Local Usage
-Once you have the CLI installed, using it is easy. 
-
-#### Steps 1
-Create a project at https://infisical.com/ if you haven't already add your secrets to it. 
-
-#### Step 2
-Login to the CLI by running the following command in your terminal 
-
-```
-infisical login 
-```
-
-#### Step 3
-After logging in, `CD` to the root of the project where you would like to inject your secrets into. Once you are in the root, run the following command in the terminal to link your Infisical project to your local project.
-
-```
-infisical init 
-```
-
-#### Step 3
-To inject the secrets from the project you have selected into your application process, run the following command.
-
-```
-infisical run -- <your application start command>
-```
-
-Example:
-
-```
-infisical run -- npm run dev 
-```
-
-## General production Usage
-Once you have the binary installed in your production environment, injecting secrets is easy. 
-
-#### Steps 1
-Get a Infisical Token for your project by visiting BLANK. Also note down the project ID for which you created the token for. 
-
-#### Steps 2
-Ensure your application has the environment variable `INFISICAL_TOKEN` asigned to the token you received in step one. Then run 
-
-```
-infisical run --projectId=<projectID> -- <your application start command>
-```
-

cli/packages/cmd/login.go

@@ -28,8 +28,9 @@ var loginCmd = &cobra.Command{
 	PreRun:                toggleDebug,
 	Run: func(cmd *cobra.Command, args []string) {
 		hasUserLoggedInbefore, currentLoggedInUserEmail, err := util.IsUserLoggedIn()
+
 		if err != nil {
-			log.Debugln(err)
+			log.Debugln("Unable to get current logged in user.", err)
 		}
 
 		if hasUserLoggedInbefore {
@@ -45,12 +46,6 @@ var loginCmd = &cobra.Command{
 			}
 		}
 
-		if err != nil {
-			log.Errorln("Unable to get current logged in user.")
-			log.Debugln(err)
-			return
-		}
-
 		email, password, err := askForLoginCredentials()
 		if err != nil {
 			log.Errorln("Unable to parse email and password for authentication")
@@ -119,8 +114,8 @@ func init() {
 
 func askForLoginCredentials() (email string, password string, err error) {
 	validateEmail := func(input string) error {
-		result, err := regexp.MatchString("^\\w+@[a-zA-Z_]+?\\.[a-zA-Z]{2,3}$", input)
-		if err != nil || !result {
+		matched, err := regexp.MatchString("^[\\w!#$%&'*+/=?`{|}~^-]+(?:\\.[\\w!#$%&'*+/=?`{|}~^-]+)*@(?:[a-zA-Z0-9-]+\\.)+[a-zA-Z]{2,6}$", input)
+		if err != nil || !matched {
 			return errors.New("this doesn't look like an email address")
 		}
 		return nil
@@ -160,6 +155,7 @@ func askForLoginCredentials() (email string, password string, err error) {
 }
 
 func getFreshUserCredentials(email string, password string) (*models.LoginTwoResponse, error) {
+	log.Debugln("getFreshUserCredentials:", "email", email, "password", password)
 	httpClient := resty.New()
 	httpClient.SetRetryCount(5)
 
@@ -180,7 +176,7 @@ func getFreshUserCredentials(email string, password string) (*models.LoginTwoRes
 		R().
 		SetBody(loginOneRequest).
 		SetResult(&loginOneResponseResult).
-		Post(fmt.Sprintf("%v/%v", util.INFISICAL_URL, "login1"))
+		Post(fmt.Sprintf("%v/v1/auth/login1", util.INFISICAL_URL))
 
 	if err != nil {
 		return nil, err
@@ -216,7 +212,7 @@ func getFreshUserCredentials(email string, password string) (*models.LoginTwoRes
 		R().
 		SetBody(LoginTwoRequest).
 		SetResult(&loginTwoResponseResult).
-		Post(fmt.Sprintf("%v/%v", util.INFISICAL_URL, "login2"))
+		Post(fmt.Sprintf("%v/v1/auth/login2", util.INFISICAL_URL))
 
 	if err != nil {
 		return nil, err

cli/packages/cmd/root.go

@@ -15,7 +15,7 @@ var rootCmd = &cobra.Command{
 	Short:             "Infisical CLI is used to inject environment variables into any process",
 	Long:              `Infisical is a simple, end-to-end encrypted service that enables teams to sync and manage their environment variables across their development life cycle.`,
 	CompletionOptions: cobra.CompletionOptions{DisableDefaultCmd: true},
-	Version:           "1.0.0",
+	Version:           "0.1.5",
 }
 
 // Execute adds all child commands to the root command and sets flags appropriately.
@@ -30,5 +30,5 @@ func Execute() {
 func init() {
 	rootCmd.Flags().BoolP("toggle", "t", false, "Help message for toggle")
 	rootCmd.PersistentFlags().BoolVarP(&debugLogging, "debug", "d", false, "Enable verbose logging")
-	rootCmd.PersistentFlags().StringVar(&util.INFISICAL_URL, "domain", "http://localhost:4000", "Point the CLI to your own backend")
+	rootCmd.PersistentFlags().StringVar(&util.INFISICAL_URL, "domain", "https://app.infisical.com/api", "Point the CLI to your own backend")
 }

cli/packages/cmd/run.go

@@ -33,6 +33,13 @@ var runCmd = &cobra.Command{
 			return
 		}
 
+		shouldExpandSecrets, err := cmd.Flags().GetBool("expand")
+		if err != nil {
+			log.Errorln("Unable to parse the substitute flag")
+			log.Debugln(err)
+			return
+		}
+
 		projectId, err := cmd.Flags().GetString("projectId")
 		if err != nil {
 			log.Errorln("Unable to parse the project id flag")
@@ -41,7 +48,7 @@ var runCmd = &cobra.Command{
 		}
 
 		var envsFromApi []models.SingleEnvironmentVariable
-		infisicalToken := os.Getenv(util.INFISICAL_SERVICE_TOKEN)
+		infisicalToken := os.Getenv(util.INFISICAL_TOKEN_NAME)
 		if infisicalToken == "" {
 			hasUserLoggedInbefore, loggedInUserEmail, err := util.IsUserLoggedIn()
 			if err != nil {
@@ -82,7 +89,13 @@ var runCmd = &cobra.Command{
 			}
 		}
 
-		execCmd(args[0], args[1:], envsFromApi)
+		if shouldExpandSecrets {
+			substitutions := util.SubstituteSecrets(envsFromApi)
+			execCmd(args[0], args[1:], substitutions)
+		} else {
+			execCmd(args[0], args[1:], envsFromApi)
+		}
+
 	},
 }
 
@@ -90,6 +103,7 @@ func init() {
 	rootCmd.AddCommand(runCmd)
 	runCmd.Flags().StringP("env", "e", "dev", "Set the environment (dev, prod, etc.) from which your secrets should be pulled from")
 	runCmd.Flags().String("projectId", "", "The project ID from which your secrets should be pulled from")
+	runCmd.Flags().Bool("expand", true, "Parse shell parameter expansions in your secrets")
 }
 
 // Credit: inspired by AWS Valut

cli/packages/models/error.go

@@ -0,0 +1,14 @@
+package models
+
+import log "github.com/sirupsen/logrus"
+
+// Custom error type so that we can give helpful messages in CLI
+type Error struct {
+	Err             error
+	DebugMessage    string
+	FriendlyMessage string
+}
+
+func (e *Error) printFriendlyMessage() {
+	log.Infoln(e.FriendlyMessage)
+}

cli/packages/util/common.go

@@ -9,10 +9,10 @@ const (
 	CONFIG_FILE_NAME                     = "infisical-config.json"
 	CONFIG_FOLDER_NAME                   = ".infisical"
 	INFISICAL_WORKSPACE_CONFIG_FILE_NAME = ".infisical.json"
-	INFISICAL_SERVICE_TOKEN              = "INFISICAL_SERVICE_TOKEN"
+	INFISICAL_TOKEN_NAME                 = "INFISICAL_TOKEN"
 )
 
-var INFISICAL_URL = "https://api.infisical.com"
+var INFISICAL_URL = "https://app.infisical.com/api"
 
 func GetHomeDir() (string, error) {
 	directory, err := os.UserHomeDir()

cli/packages/util/credentials.go

@@ -81,7 +81,7 @@ func IsUserLoggedIn() (hasUserLoggedIn bool, theUsersEmail string, err error) {
 
 		response, err := httpClient.
 			R().
-			Post(fmt.Sprintf("%v/%v", INFISICAL_URL, "checkAuth"))
+			Post(fmt.Sprintf("%v/v1/auth/checkAuth", INFISICAL_URL))
 
 		if err != nil {
 			return false, "", err

cli/packages/util/secrets.go

@@ -4,6 +4,7 @@ import (
 	"encoding/base64"
 	"errors"
 	"fmt"
+	"regexp"
 	"strings"
 
 	"github.com/Infisical/infisical-merge/packages/models"
@@ -31,7 +32,9 @@ func GetSecretsFromAPIUsingCurrentLoggedInUser(envName string, userCreds models.
 		SetQueryParam("environment", envName).
 		SetQueryParam("channel", "cli").
 		SetResult(&pullSecretsRequestResponse).
-		Get(fmt.Sprintf("%v/%v/%v", INFISICAL_URL, "secret", workspace.WorkspaceId)) // need to change workspace id
+		Get(fmt.Sprintf("%v/v1/secret/%v", INFISICAL_URL, workspace.WorkspaceId)) // need to change workspace id
+
+	log.Debugln("Response from get secrets:", response)
 
 	if err != nil {
 		return nil, err
@@ -116,7 +119,7 @@ func GetSecretsFromAPIUsingInfisicalToken(infisicalToken string, envName string,
 		SetQueryParam("environment", envName).
 		SetQueryParam("channel", "cli").
 		SetResult(&pullSecretsByInfisicalTokenResponse).
-		Get(fmt.Sprintf("%v/secret/%v/service-token", INFISICAL_URL, projectId))
+		Get(fmt.Sprintf("%v/v1/secret/%v/service-token", INFISICAL_URL, projectId))
 
 	if err != nil {
 		return nil, err
@@ -191,7 +194,7 @@ func GetWorkSpacesFromAPI(userCreds models.UserCredentials) (workspaces []models
 	response, err := httpClient.
 		R().
 		SetResult(&getWorkSpacesResponse).
-		Get(fmt.Sprintf("%v/%v", INFISICAL_URL, "workspace"))
+		Get(fmt.Sprintf("%v/v1/workspace", INFISICAL_URL))
 
 	if err != nil {
 		return nil, err
@@ -203,3 +206,73 @@ func GetWorkSpacesFromAPI(userCreds models.UserCredentials) (workspaces []models
 
 	return getWorkSpacesResponse.Workspaces, nil
 }
+
+func getExpandedEnvVariable(secrets []models.SingleEnvironmentVariable, variableWeAreLookingFor string, hashMapOfCompleteVariables map[string]string, hashMapOfSelfRefs map[string]string) string {
+	if value, found := hashMapOfCompleteVariables[variableWeAreLookingFor]; found {
+		return value
+	}
+
+	for _, secret := range secrets {
+		if secret.Key == variableWeAreLookingFor {
+			regex := regexp.MustCompile(`\${([^\}]*)}`)
+			variablesToPopulate := regex.FindAllString(secret.Value, -1)
+
+			// case: variable is a constant so return its value
+			if len(variablesToPopulate) == 0 {
+				return secret.Value
+			}
+
+			valueToEdit := secret.Value
+			for _, variableWithSign := range variablesToPopulate {
+				variableWithoutSign := strings.Trim(variableWithSign, "}")
+				variableWithoutSign = strings.Trim(variableWithoutSign, "${")
+
+				// case: reference to self
+				if variableWithoutSign == secret.Key {
+					hashMapOfSelfRefs[variableWithoutSign] = variableWithoutSign
+					continue
+				} else {
+					var expandedVariableValue string
+
+					if preComputedVariable, found := hashMapOfCompleteVariables[variableWithoutSign]; found {
+						expandedVariableValue = preComputedVariable
+					} else {
+						expandedVariableValue = getExpandedEnvVariable(secrets, variableWithoutSign, hashMapOfCompleteVariables, hashMapOfSelfRefs)
+						hashMapOfCompleteVariables[variableWithoutSign] = expandedVariableValue
+					}
+
+					// If after expanding all the vars above, is the current var a self ref? if so no replacement needed for it
+					if _, found := hashMapOfSelfRefs[variableWithoutSign]; found {
+						continue
+					} else {
+						valueToEdit = strings.ReplaceAll(valueToEdit, variableWithSign, expandedVariableValue)
+					}
+				}
+			}
+
+			return valueToEdit
+
+		} else {
+			continue
+		}
+	}
+
+	return "${" + variableWeAreLookingFor + "}"
+}
+
+func SubstituteSecrets(secrets []models.SingleEnvironmentVariable) []models.SingleEnvironmentVariable {
+	hashMapOfCompleteVariables := make(map[string]string)
+	hashMapOfSelfRefs := make(map[string]string)
+	expandedSecrets := []models.SingleEnvironmentVariable{}
+
+	for _, secret := range secrets {
+		expandedVariable := getExpandedEnvVariable(secrets, secret.Key, hashMapOfCompleteVariables, hashMapOfSelfRefs)
+		expandedSecrets = append(expandedSecrets, models.SingleEnvironmentVariable{
+			Key:   secret.Key,
+			Value: expandedVariable,
+		})
+
+	}
+
+	return expandedSecrets
+}

cli/packages/util/secrets_test.go

@@ -0,0 +1,160 @@
+package util
+
+import (
+	"testing"
+
+	"github.com/Infisical/infisical-merge/packages/models"
+)
+
+// References to self should return the value unaltered
+func Test_SubstituteSecrets_When_ReferenceToSelf(t *testing.T) {
+
+	var tests = []struct {
+		Key           string
+		Value         string
+		ExpectedValue string
+	}{
+		{Key: "A", Value: "${A}", ExpectedValue: "${A}"},
+		{Key: "A", Value: "${A} ${A}", ExpectedValue: "${A} ${A}"},
+		{Key: "A", Value: "${A}${A}", ExpectedValue: "${A}${A}"},
+	}
+
+	for _, test := range tests {
+		secret := models.SingleEnvironmentVariable{
+			Key:   test.Key,
+			Value: test.Value,
+		}
+
+		secrets := []models.SingleEnvironmentVariable{secret}
+		result := SubstituteSecrets(secrets)
+
+		if result[0].Value != test.ExpectedValue {
+			t.Errorf("Test_SubstituteSecrets_When_ReferenceToSelf: expected %s but got %s for input %s", test.ExpectedValue, result[0].Value, test.Value)
+		}
+
+	}
+}
+
+func Test_SubstituteSecrets_When_ReferenceDoesNotExist(t *testing.T) {
+
+	var tests = []struct {
+		Key           string
+		Value         string
+		ExpectedValue string
+	}{
+		{Key: "A", Value: "${X}", ExpectedValue: "${X}"},
+		{Key: "A", Value: "${H}HELLO", ExpectedValue: "${H}HELLO"},
+		{Key: "A", Value: "${L}${S}", ExpectedValue: "${L}${S}"},
+	}
+
+	for _, test := range tests {
+		secret := models.SingleEnvironmentVariable{
+			Key:   test.Key,
+			Value: test.Value,
+		}
+
+		secrets := []models.SingleEnvironmentVariable{secret}
+		result := SubstituteSecrets(secrets)
+
+		if result[0].Value != test.ExpectedValue {
+			t.Errorf("Test_SubstituteSecrets_When_ReferenceToSelf: expected %s but got %s for input %s", test.ExpectedValue, result[0].Value, test.Value)
+		}
+
+	}
+}
+
+func Test_SubstituteSecrets_When_ReferenceDoesNotExist_And_Self_Referencing(t *testing.T) {
+
+	tests := []struct {
+		Key           string
+		Value         string
+		ExpectedValue string
+	}{
+		{
+			Key:           "O",
+			Value:         "${P} ==$$ ${X} ${UNKNOWN} ${A}",
+			ExpectedValue: "DOMAIN === ${A} DOMAIN >>> ==$$ DOMAIN ${UNKNOWN} ${A}",
+		},
+		{
+			Key:           "X",
+			Value:         "DOMAIN",
+			ExpectedValue: "DOMAIN",
+		},
+		{
+			Key:           "A",
+			Value:         "*${A}* ${X}",
+			ExpectedValue: "*${A}* DOMAIN",
+		},
+		{
+			Key:           "H",
+			Value:         "${X} >>>",
+			ExpectedValue: "DOMAIN >>>",
+		},
+		{
+			Key:           "P",
+			Value:         "DOMAIN === ${A} ${H}",
+			ExpectedValue: "DOMAIN === ${A} DOMAIN >>>",
+		},
+		{
+			Key:           "T",
+			Value:         "${P} ==$$ ${X} ${UNKNOWN} ${A} ${P} ==$$ ${X} ${UNKNOWN} ${A}",
+			ExpectedValue: "DOMAIN === ${A} DOMAIN >>> ==$$ DOMAIN ${UNKNOWN} ${A} DOMAIN === ${A} DOMAIN >>> ==$$ DOMAIN ${UNKNOWN} ${A}",
+		},
+		{
+			Key:           "S",
+			Value:         "${ SSS$$ ${HEY}",
+			ExpectedValue: "${ SSS$$ ${HEY}",
+		},
+	}
+
+	secrets := []models.SingleEnvironmentVariable{}
+	for _, test := range tests {
+		secrets = append(secrets, models.SingleEnvironmentVariable{Key: test.Key, Value: test.Value})
+	}
+
+	results := SubstituteSecrets(secrets)
+
+	for index, expanded := range results {
+		if expanded.Value != tests[index].ExpectedValue {
+			t.Errorf("Test_SubstituteSecrets_When_ReferenceToSelf: expected [%s] but got [%s] for input [%s]", tests[index].ExpectedValue, expanded.Value, tests[index].Value)
+		}
+	}
+}
+
+func Test_SubstituteSecrets_When_No_SubstituteNeeded(t *testing.T) {
+
+	tests := []struct {
+		Key           string
+		Value         string
+		ExpectedValue string
+	}{
+		{
+			Key:           "DOMAIN",
+			Value:         "infisical.com",
+			ExpectedValue: "infisical.com",
+		},
+		{
+			Key:           "API_KEY",
+			Value:         "hdgsvjshcgkdckhevdkd",
+			ExpectedValue: "hdgsvjshcgkdckhevdkd",
+		},
+		{
+			Key:           "ENV",
+			Value:         "PROD",
+			ExpectedValue: "PROD",
+		},
+	}
+
+	secrets := []models.SingleEnvironmentVariable{}
+	for _, test := range tests {
+		secrets = append(secrets, models.SingleEnvironmentVariable{Key: test.Key, Value: test.Value})
+	}
+
+	results := SubstituteSecrets(secrets)
+
+	for index, expanded := range results {
+		if expanded.Value != tests[index].ExpectedValue {
+			t.Errorf("Test_SubstituteSecrets_When_ReferenceToSelf: expected [%s] but got [%s] for input [%s]", tests[index].ExpectedValue, expanded.Value, tests[index].Value)
+		}
+	}
+}

cli/upload_to_cloudsmith.sh

@@ -1,15 +1,15 @@
 cd dist
 for i in *.apk; do
     [ -f "$i" ] || break
-    cloudsmith push alpine infisical/infisical-cli/alpine/any-version $i
+    cloudsmith push alpine --republish infisical/infisical-cli/alpine/any-version $i
 done
 
 for i in *.deb; do
     [ -f "$i" ] || break
-    cloudsmith push deb --no-republish infisical/infisical-cli/any-distro/any-version $i
+    cloudsmith push deb --republish infisical/infisical-cli/any-distro/any-version $i
 done
 
 for i in *.rpm; do
     [ -f "$i" ] || break
-    cloudsmith push rpm --no-republish infisical/infisical-cli/any-distro/any-version $i
+    cloudsmith push rpm --republish infisical/infisical-cli/any-distro/any-version $i
 done

docker-compose.dev.yml

@@ -4,6 +4,7 @@ services:
   nginx:
     container_name: infisical-dev-nginx
     image: nginx
+    restart: always
     ports:
       - 8080:80
     volumes:
@@ -29,6 +30,8 @@ services:
       - /app/node_modules
     command: npm run dev
     env_file: .env
+    environment:
+      - NODE_ENV=development
     networks:
       - infisical-dev
   
@@ -47,6 +50,12 @@ services:
       - ./frontend/styles:/app/styles
       - ./frontend/components:/app/components
     env_file: .env
+    environment:
+      - NEXT_PUBLIC_ENV=development
+      - NEXT_PUBLIC_WEBSITE_URL=${SITE_URL}
+      - NEXT_PUBLIC_POSTHOG_HOST=${POSTHOG_HOST}
+      - NEXT_PUBLIC_POSTHOG_API_KEY=${POSTHOG_PROJECT_API_KEY}
+      - NEXT_PUBLIC_TELEMETRY_ENABLED=${TELEMETRY_ENABLED}
     networks:
       - infisical-dev
 
@@ -55,6 +64,9 @@ services:
     container_name: infisical-dev-mongo
     restart: always
     env_file: .env
+    environment:
+      - MONGO_INITDB_ROOT_USERNAME=${MONGO_USERNAME}
+      - MONGO_INITDB_ROOT_PASSWORD=${MONGO_PASSWORD}
     volumes:
       - mongo-data:/data/db
     networks:
@@ -65,6 +77,10 @@ services:
     image: mongo-express
     restart: always
     env_file: .env
+    environment:
+      - ME_CONFIG_MONGODB_ADMINUSERNAME=${MONGO_USERNAME}
+      - ME_CONFIG_MONGODB_ADMINPASSWORD=${MONGO_PASSWORD}
+      - ME_CONFIG_MONGODB_URL=mongodb://${MONGO_USERNAME}:${MONGO_PASSWORD}@mongo:27017/
     ports:
       - 8081:8081
     networks:

docker-compose.yml

@@ -4,6 +4,7 @@ services:
   nginx:
     container_name: infisical-nginx
     image: nginx
+    restart: always
     ports:
       - 80:80
       - 443:443
@@ -25,12 +26,10 @@ services:
       context: ./backend
       dockerfile: Dockerfile
     image: infisical/backend
-    volumes:
-      - ./backend/src:/app/src
-      - ./backend/nodemon.json:/app/nodemon.json
-      - /app/node_modules
     command: npm run start
     env_file: .env
+    environment:
+      - NODE_ENV=production
     networks:
       - infisical
   
@@ -44,13 +43,12 @@ services:
       context: ./frontend
       dockerfile: Dockerfile.prod
     image: infisical/frontend
-    volumes:
-      - ./frontend/pages:/app/pages
-      - ./frontend/public:/app/public
-      - ./frontend/styles:/app/styles
-      - ./frontend/components:/app/components
-      - ./frontend/next.config.js:/app/next.config.js
     env_file: .env
+    environment:
+      - NEXT_PUBLIC_ENV=production
+      - NEXT_PUBLIC_WEBSITE_URL=${SITE_URL}
+      - NEXT_PUBLIC_POSTHOG_HOST=${POSTHOG_HOST}
+      - NEXT_PUBLIC_POSTHOG_API_KEY=${POSTHOG_PROJECT_API_KEY}
     networks:
       - infisical
 
@@ -58,6 +56,10 @@ services:
     container_name: infisical-mongo
     image: mongo
     restart: always
+    env_file: .env
+    environment:
+      - MONGO_INITDB_ROOT_USERNAME=${MONGO_USERNAME}
+      - MONGO_INITDB_ROOT_PASSWORD=${MONGO_PASSWORD}
     volumes:
       - mongo-data:/data/db
     networks:

docs/cli/overview.mdx

@@ -1,10 +1,12 @@
 ---
-title: "Installation"
+title: "Overview"
 ---
 
-Prerequisite: [Setup an account](../../getting-started/dashboard/create-account) with Infisical Cloud or via self-hosted installation.
+Prerequisite: Set up an account with [Infisical Cloud](https://app.infisical.com) or via a [self-hosted installation](/self-hosting/overview).
 
-Follow the guide for your OS below to install the CLI.
+The Infisical CLI provides a way to inject environment variables from the platform into your apps and infrastructure.
+
+## Installation
 
 <Tabs>
    <Tab title="MacOS">
@@ -18,7 +20,7 @@ Follow the guide for your OS below to install the CLI.
     	infisical --version
     	```
 
-    	To update:
+    	## Updates
 
     	```bash
     	brew upgrade infisical
@@ -37,7 +39,7 @@ Follow the guide for your OS below to install the CLI.
     		infisical --version
     		```
 
-    		To update:
+    		## Updates
 
     		```bash
     		scoop update infisical
@@ -59,7 +61,7 @@ Follow the guide for your OS below to install the CLI.
 
     	Then install CLI
     	```bash
-    	$ apk update && apk add infisical
+    	$ sudo apk update && sudo apk add infisical
     	```
 
    </Tab>
@@ -73,7 +75,7 @@ Follow the guide for your OS below to install the CLI.
 
     	Then install CLI
     	```bash
-    	$ yum install infisical
+    	$ sudo yum install infisical
     	```
 
    </Tab>
@@ -88,7 +90,7 @@ Follow the guide for your OS below to install the CLI.
 
     	Then install CLI
     	```bash
-    	$ apt-get update && apt-get install -y infisical
+    	$ sudo apt-get update && sudo apt-get install -y infisical
     	```
 
    </Tab>

docs/cli/reference/commands.mdx

@@ -0,0 +1,20 @@
+---
+title: "Commands"
+---
+
+## Commands
+
+| Command | Description                                                          |
+| ------- | -------------------------------------------------------------------- |
+| `login` | Used to authenticate and set the logged in user.                     |
+| `init`  | Used to link a local project to the platform.                        |
+| `run`   | Used to inject envars from the platform into an application process. |
+
+## Global options
+
+| Option            | Description                                     |
+| ----------------- | ----------------------------------------------- |
+| `--help`, `-h`    | List help for any command                       |
+| `--debug`, `-d`   | Enable verbose logging                          |
+| `--domain`        | Use to direct Infisical to a self-hosted domain |
+| `--version`, `-v` | Print version information and quit              |

docs/cli/reference/init.mdx

@@ -0,0 +1,13 @@
+---
+title: "infisical init"
+---
+
+```bash
+infisical init
+```
+
+## Description
+
+Link a local project to the platform
+
+The command creates a `infisical.json` file containing your Project ID.

docs/cli/reference/login.mdx

@@ -0,0 +1,13 @@
+---
+title: "infisical login"
+---
+
+```bash
+infisical login
+```
+
+## Description
+
+Verify a user and save credentials to the system keyring.
+
+To change the logged in user, run the command again to overwrite the previous login.

docs/cli/reference/run.mdx

@@ -0,0 +1,19 @@
+---
+title: "infisical run"
+---
+
+```bash
+infisical run [options] -- [your application start command]
+```
+
+## Description
+
+Inject environment variables from the platform into an application process.
+
+## Options
+
+| Option         | Description                                                                                                 | Default value |
+| -------------- | ----------------------------------------------------------------------------------------------------------- | ------------- |
+| `--env`        | Used to set the environment that secrets are pulled from. Accepted values: `dev`, `staging`, `test`, `prod` | `dev`         |
+| `--projectId`  | Used to link a local project to the platform (required only if injecting via the service token method)      | `None`        |
+| `--expand`     | Parse shell parameter expansions in your secrets (e.g., `${DOMAIN}`)      | `true`        |

docs/cli/usage.mdx

@@ -0,0 +1,52 @@
+---
+title: "Usage"
+---
+
+Prerequisite: [Install the CLI](/cli/overview)
+
+## Log in to the Infisical CLI
+
+```bash
+infisical login
+```
+
+## Initialize Infisical for your project
+
+```bash
+# move to your project
+cd /path/to/project
+
+# initialize infisical
+infisical init
+```
+
+## Inject environment variables
+
+```bash
+# inject environment variables into app
+infisical run -- [your application start command]
+```
+
+Options you can specify:
+
+| Option         | Description                                                                                                 | Default value |
+| -------------  | ----------------------------------------------------------------------------------------------------------- | ------------- |
+| `--env`        | Used to set the environment that secrets are pulled from. Accepted values: `dev`, `staging`, `test`, `prod` | `dev`         |
+| `--projectId`  | Used to link a local project to the platform (required only if injecting via the service token method)      | `None`        |
+| `--expand`     | Parse shell parameter expansions in your secrets (e.g., `${DOMAIN}`)      | `true`        |
+
+## Examples:
+
+```bash
+# example with node
+infisical run -- node index.js
+
+# example with node (nodemon)
+infisical run -- nodemon index.js
+
+# example with node (nodemon) pulling in secrets from test environment
+infisical run --env=test -- nodemon index.js
+
+# example with flask
+infisical run -- flask run
+```

docs/contributing/architecture.mdx

@@ -1,27 +0,0 @@
----
-title: "Architecture"
----
-
-Infisical is an open-source collection of services for simple secret management built on top of Typescript, Javascript (ongoing conversion to TS), and Go. It's all dockerized and can be spun up with Docker Compose.
-
-![architecture](../images/architecture-diagram2.png)
-
-## NGINX
-
-NGINX is a reverse-proxy and load balancer that sits in front of Infisical. It forwards requests to the frontend and backend services.
-
-## Frontend
-
-The frontend service renders the Web UI using Next.js.
-
-## Backend
-
-The backend service provides the back-of-house logic for secret management.
-
-## Database
-
-The (MongoDB) database stores all data and (encrypted) secrets.
-
-## CLI
-
-The platform-agnostic CLI allows you to inject environment variables from Infisical into apps and infrastructure.

docs/contributing/developing.mdx

@@ -40,6 +40,7 @@ docker-compose -f docker-compose.dev.yml up
 
 The docker-compose development environment consists of:
 
+- nginx
 - frontend
 - backend
 - mongo

docs/getting-started/cli/cli-guide.mdx

@@ -1,56 +0,0 @@
----
-title: "Usage"
----
-
-Prerequisite: [Install the CLI](../../getting-started/cli/installation)
-
-## Login
-
-Login in using the `login` command in your terminal. Logging in is a one-time, post-installation action that authenticates you with the platform — to change users, you can run the command again.
-
-```bash
-infisical login
-```
-
-## Initialization
-
-In the root of your local project, initialize Infisical and follow steps to connect your project to the platform.
-
-```bash
-cd /path/to/project
-
-# initialization
-infisical init
-```
-
-## Injecting environment variables
-
-To inject environment variables from the platform to your project, use the `run` command.
-
-```bash
-# command
-infisical run -- [your application start command]
-```
-
-Options you can specify:
-
-| Option        | Description                                                                                                 | Default value |
-| ------------- | ----------------------------------------------------------------------------------------------------------- | ------------- |
-| `--env`       | Used to set the environment that secrets are pulled from. Accepted values: `dev`, `staging`, `test`, `prod` | `dev`         |
-| `--projectId` | Used to link a local project to the platform (required only if injecting via the service token method)      | `None`        |
-
-Examples:
-
-```bash
-# example with node
-infisical run -- node index.js
-
-# example with node (nodemon)
-infisical run -- nodemon index.js
-
-# example with node (nodemon) pulling in secrets from test environment
-infisical run --env=test -- nodemon index.js
-
-# example with flask
-infisical run -- flask run
-```

docs/getting-started/cli/reference.mdx

@@ -1,55 +0,0 @@
----
-title: "Reference"
----
-
-## Commands
-
-| Command | Description                                                          | Options                |
-| ------- | -------------------------------------------------------------------- | ---------------------- |
-| `login` | Used to authenticate and set the logged in user.                     |
-| `init`  | Used to link a local project to the platform.                        |
-| `run`   | Used to inject envars from the platform into an application process. | `--projectId`, `--env` |
-
-## Global options
-
-| Option            | Description                        |
-| ----------------- | ---------------------------------- |
-| `--help`, `-h`    | List help for any command          |
-| `--debug`, `-d`   | Enable verbose logging             |
-| `--domain`        | Use to direct Infisical to         |
-| `--version`, `-v` | Print version information and quit |
-
-### Login
-
-Used to authenticate and set the logged in user.
-
-Post-authentication credentials are saved securely in your system keyring. Since only one user can be logged in at a time, to change the logged in user, run the command again to overwrite the previous login.
-
-```bash
-infisical login
-```
-
-### Init
-
-Used to link a local project to the platform (cloud or self-hosted)
-
-Run this command at the root of your local project. You will have to run this command for each new project you create locally.
-
-```bash
-infisical init
-```
-
-### Run
-
-Used to inject environment variables from the platform into an application process.
-
-```bash
-infisical run [options] -- [your application start command]
-```
-
-Options you can specify:
-
-| Option        | Description                                                                                                 | Default value |
-| ------------- | ----------------------------------------------------------------------------------------------------------- | ------------- |
-| `--env`       | Used to set the environment that secrets are pulled from. Accepted values: `dev`, `staging`, `test`, `prod` | `dev`         |
-| `--projectId` | Used to link a local project to the platform (required only if injecting via the service token method)      | `None`        |

docs/getting-started/dashboard/create-account.mdx

@@ -4,7 +4,7 @@ title: "Sign up"
 
 ## Self-hosted
 
-If you're using a self-hosted installation, follow the [setup](/self-hosting/overview) then open your website URL `{WEBSITE_URL}/login`.
+If you're using a self-hosted installation, follow the [setup](/self-hosting/overview) then open your site URL `{SITE_URL}`.
 
 ## Infisical Cloud
 

docs/getting-started/dashboard/integrations.mdx

@@ -8,6 +8,6 @@ We’re still early with integrations but you’ll be able to sync environment v
 
 Check out integrations:
 
-- Heroku
-- Docker
-- Docker Compose
+- [Heroku](/integrations/heroku)
+- [Docker](/integrations/docker)
+- [Docker Compose](/integrations/docker-compose)

docs/getting-started/dashboard/token.mdx

@@ -4,11 +4,11 @@ title: "Infisical Token"
 
 An Infisical Token is needed to authenticate the CLI when there isn't an easy way to manually type in your login credentials to sync environment variables to your applications.
 
-It grants read-only access to a particular environment and project for a specified amount of time; once the token expires, any CLI application that relies on it for authentication will be denied access to retrieve related secrets.
+It grants read-only access to a particular environment and project for a specified amount of time.
 
 This is useful in the following contexts:
 
-- [Docker](../../integrations/docker)/[Docker-Compose](../../integrations/docker-compose) integration: An Infisical Token can be passed to a Docker container as an environment variable for the CLI to authenticate and pull its corresponding secrets.
+- [Docker](/integrations/docker)/[Docker-Compose](/integrations/docker-compose) integration: An Infisical Token can be passed to a Docker container as an environment variable for the CLI to authenticate and pull its corresponding secrets.
 
 ## Generate an Infisical Token
 
@@ -19,5 +19,3 @@ It's possible to generate an Infisical token in the settings of a project.
 ![token name](../../images/project-token-name.png)
 
 ![token added](../../images/project-token-added.png)
-
-To use the Infisical Token in the CLI, check out the docs for that [here](../../getting-started/cli/token).

docs/getting-started/features.mdx

@@ -20,46 +20,24 @@ The CLI is used to inject environment variables into applications and infrastruc
 - Inject environment variables.
 - Inject environment variables into containers via service tokens for Docker.
 
-## Integrations
-
-We're still early with integrations but you'll be able to sync environment variables across your entire infrastructure from local development to CI/CD and production.
-
-| Integration    | Status      |
-| -------------- | ----------- |
-| Docker         | Available   |
-| Docker-Compose | Available   |
-| Kubernetes     | Coming soon |
-| Vercel         | Coming soon |
-| AWS            | Coming soon |
-| GCP            | Coming soon |
-| Azure          | Coming soon |
-| DigitalOcean   | Coming soon |
-| GitLab         | Coming soon |
-| CircleCI       | Coming soon |
-| TravisCI       | Coming soon |
-| GitHub Actions | Coming soon |
-| Jenkins        | Coming soon |
-
-Missing an integration? Throw in a request.
-
 ## Roadmap
 
 We're building the future of secret management, one that's comprehensive and accessible to all. Some high-level features we have in mind:
 
-| Feature                               | Status           |
-| ------------------------------------- | ---------------- |
-| Integrations                          | Ongoing          |
-| More hosting options                  | Ongoing          |
-| 1-Click Deploys                       | Ongoing          |
-| Account recovery: Backup key          | Ongoing          |
-| Account recovery: Member-assisted     | Noet yet started |
-| Slack & MS teams integrations         | Not yet started  |
-| Access logs                           | Not yet started  |
-| Version control for secrets           | Not yet started  |
-| 2FA                                   | Not yet started  |
-| Restricted IPs                        | Not yet started  |
-| Read/write access controls            | Not yet started  |
-| Secret rotation                       | Not yet started  |
-| Comparing secrets across environments | Not yet started  |
+| Feature                               | Status      |
+| ------------------------------------- | ----------- |
+| Integrations                          | Ongoing     |
+| More hosting options                  | Ongoing     |
+| 1-Click Deploys                       | Ongoing     |
+| Account recovery: Backup key          | Ongoing     |
+| Account recovery: Member-assisted     | Coming soon |
+| Slack & MS teams integrations         | Coming soon |
+| Access logs                           | Coming soon |
+| Version control for secrets           | Coming soon |
+| 2FA                                   | Coming soon |
+| Restricted IPs                        | Coming soon |
+| Read/write access controls            | Coming soon |
+| Secret rotation                       | Coming soon |
+| Comparing secrets across environments | Coming soon |
 
-Interested in contributing? Check out the guide.
+Interested in contributing? Check out the [guide](/contributing/overview).

docs/getting-started/introduction.mdx

@@ -2,20 +2,36 @@
 title: "Introduction"
 ---
 
-<iframe
-  src="https://www.youtube.com/embed/0q_IroMV1ns"
-  width="100%"
-  height="400"
-></iframe>
+Infisical is an [open-source](https://opensource.com/resources/what-open-source), [end-to-end encrypted](https://en.wikipedia.org/wiki/End-to-end_encryption) secret manager that enables teams to easily manage and sync their environment variables.
 
-Infisical is an [open-source](https://opensource.com/resources/what-open-source), end-to-end encrypted (E2EE) secret manager that enables teams to easily manage and sync their environment variables.
+Start syncing environment variables with [Infisical Cloud](https://app.infisical.com) or learn how to [host Infisical](/self-hosting/overview) yourself.
 
-It stops [secret sprawl](https://www.gitguardian.com/glossary/secret-sprawl-definition) by providing a single source-of-truth for environment variables. It offers a dashboard for teams to manage environment variables and a platform-agnostic CLI to inject them into apps and infrastructure.
-
-Some problems we solve:
-
-- Leaking .env files to version control.
-- Debugging missing environment variables.
-- Sending environment variables over email.
-
-Infisical uses [end-to-end encryption](https://en.wikipedia.org/wiki/End-to-end_encryption) to ensure that only designated team members can read their environment variables; unless intended for specific integrations, environment variables are always encrypted before being sent to the server.
+<CardGroup cols={2}>
+  <Card
+    title="Quickstart"
+    href="/getting-started/quickstart"
+    icon="timer"
+    color="#ea5a0c"
+  >
+    Tour Infisical in a few minutes.
+  </Card>
+  <Card href="/cli/overview" title="CLI" icon="square-terminal" color="#16a34a">
+    Install the CLI to inject secrets into apps and infra.
+  </Card>
+  <Card
+    href="/self-hosting/overview"
+    title="Self-hosting"
+    icon="server"
+    color="#0285c7"
+  >
+    Learn how to configure and deploy Infisical.
+  </Card>
+  <Card
+    href="/integrations/heroku"
+    title="Integrations"
+    icon="plug"
+    color="#dc2626"
+  >
+    Explore integrations for Docker, AWS, Heroku, etc.
+  </Card>
+</CardGroup>

docs/getting-started/quickstart.mdx

@@ -0,0 +1,43 @@
+---
+title: "Quickstart"
+---
+
+This example demonstrates how to store and inject environment variables from [Infisical Cloud](https://app.infisical.com) into your application.
+
+Note that the Infisical CLI is platform-agnostic and can inject environment variables across many tech stacks and frameworks.
+
+## Set up Infisical Cloud
+
+1. Login or create an accout at `app.infisical.com`.
+2. Create a new project.
+3. Populate your environment variables as in the image below.
+
+![project quickstart](../images/project-quickstart.png)
+
+## Set up the CLI
+
+1. Follow the instructions to [install the CLI](/cli/overview).
+
+2. Initialize Infisical for your project.
+
+```bash
+# move to your project
+cd /path/to/project
+
+# initialize infisical
+infisical init
+```
+
+## Start your app with environment variables injected
+
+```bash
+# inject environment variables into app
+infisical run -- [your application start command]
+```
+
+<Info>
+  Check out our [integrations](/integrations/overview) for injecting environment
+  variables into frameworks and platforms like Docker.
+</Info>
+
+Your app should be running with the environment variables injected.

docs/getting-started/security/statement.mdx

@@ -1,11 +0,0 @@
----
-title: "Statement"
----
-
-As a secrets manager, we are deeply committed to enforcing the privacy and security of all users and data on the platform but acknowledge that it is virtually impossible to guarantee perfect security; unfortunately, even the most secure systems have vulnerabilities.
-
-As part of our commitment, we do our best to maintain platform privacy and security, notify users if anything goes wrong, and rectify adverse situations immediately if anything happens. As Infisical grows, we will be adding more opt-in security measures to ensure better data protection and maintain trust within the growing community. With that, let’s make the most simple and secure secrets management system out there!
-
-Best,
-
-Infisical Team

docs/integrations/docker-compose.mdx

@@ -3,20 +3,25 @@ title: "Docker Compose"
 ---
 
 ### Step 1: Add CLI to your Dockerfile
-Follow steps 1 through 3 on our [guide to configure Infisical CLI](/docker) in your Dockerfile. 
+
+Follow steps 1 through 3 on our [guide to configure Infisical CLI](../getting-started/cli/installation) in your Dockerfile.
 
 ### Step 2: Generate Infisical Token
+
 In order for Infisical CLI to authenticate and retrieve your project's secrets without exposing your login credentials, you must generate a Infisical Token.
-To learn how, visit [Infisical Token](../getting-started/cli/infisical-token). Once you have generated the token, keep it handy. 
+To learn how, visit [Infisical Token](../getting-started/cli/infisical-token). Once you have generated the token, keep it handy.
 
 <Info>
-If you have multiple services and they do not use the same secrets, you will have to generate a Infisical Token for each service.
+  If you have multiple services and they do not use the same secrets, you will
+  have to generate a Infisical Token for each service.
 </Info>
 
 ### Step 3: Tell Docker Compose your Infisical Token
-For each service you want to inject secrets into, set an environment variable called `INFISICAL_TOKEN` equal to a useful shell variable name.
-This will ensure that you can set Infisical Tokens for multiple services. 
 
+For each service you want to inject secrets into, set an environment variable called `INFISICAL_TOKEN` equal to a helpful identifier variable.
+This will ensure that you can set Infisical Tokens for multiple services.
+
+For the example below, we have set `INFISICAL_TOKEN_FOR_WEB` and `INFISICAL_TOKEN_FOR_API` as the `INFISICAL_TOKEN` for the corresponding service.
 
 ```yaml
 # Example Docker Compose file
@@ -26,32 +31,30 @@ services:
     image: auledge-frontend
     container_name: auledge-frontend
     environment:
-      - INFISICAL_TOKEN: ${INFISICAL_TOEKN_FOR_WEB}
+      - INFISICAL_TOKEN=${INFISICAL_TOKEN_FOR_WEB}
 
   api:
     build: .
     image: auledge-backend
     container_name: auledge-backend
     environment:
-      - INFISICAL_TOKEN: ${INFISICAL_TOEKN_FOR_API}
-
+      - INFISICAL_TOKEN=${INFISICAL_TOKEN_FOR_API}
 ```
-### 4: Set shell variables
-Next, set the shell variables you defined in your compose file. This can be done manually or via your CI/CD environment. Once donce, it will be used to populate the corresponding `INFISICAL_TOKEN`
-in your Docker Compose file. 
 
-``` bash
+### 4: Export shell variables
+
+Next, set the shell variables you defined in your compose file. This can be done manually or via your CI/CD environment. Once done, it will be used to populate the corresponding `INFISICAL_TOKEN`
+in your Docker Compose file.
+
+```bash
 #Example
 
 # Token refers to the token we generated in step 2 for this service
-INFISICAL_TOEKN_FOR_WEB=<token>
+export INFISICAL_TOKEN_FOR_WEB=<token>
 
 # Token refers to the token we generated in step 2 for this service
-INFISICAL_TOEKN_FOR_API=<token>
-```
+export INFISICAL_TOKEN_FOR_API=<token>
 
-Then run your compose file in the same terminal. 
-
-```bash 
-docker-compose
+# Then run your compose file in the same terminal.
+docker-compose ...
 ```

docs/integrations/docker.mdx

@@ -2,8 +2,6 @@
 title: "Docker"
 ---
 
-Prerequisite: [Infisical Token and How to Generate One](../../getting-started/dashboard/token).
-
 ## Step 1: Add CLI to your Dockerfile
 
 <Tabs>
@@ -33,7 +31,7 @@ Prerequisite: [Infisical Token and How to Generate One](../../getting-started/da
 
 ## Step 2: Generate Infisical Token
 
-In order for the CLI to authenticate and retrieve your project's secrets without requiring your login credentials, you must [generate an Infisical Token](../../getting-started/dashboard/token); keep it handy.
+[Generate an Infisical Token](../../getting-started/dashboard/token) and keep it handy.
 
 ## Step 3: Set start command of your container
 
@@ -56,7 +54,7 @@ Required options:
 The CLI looks out for an environment variable called the `INFISICAL_TOKEN` which you can set depending on where you run the CLI. If `INFISICAL_TOKEN` is detected by the CLI, it will authenticate and retrieve the environment variables which the token is authorized for.
 
 ```bash
- docker run --env INFISICAL_TOKEN=<the-token-you-got-from-step-2>...
+ docker run --env INFISICAL_TOKEN=[the-token-you-got-from-step-2]...
 ```
 
 Note: `INFISICAL_TOKEN` is the token you generated in step 2.

docs/integrations/overview.mdx

@@ -0,0 +1,24 @@
+---
+title: "Overview"
+---
+
+Integrations allow environment variables to be synced across your entire infrastructure from local development to CI/CD and production.
+
+Missing an integration? Throw in a [request](https://github.com/Infisical/infisical/issues).
+
+| Integration                                    | Status      |
+| ---------------------------------------------- | ----------- |
+| [Docker](/integrations/docker)                 | Available   |
+| [Docker-Compose](/integrations/docker-compose) | Available   |
+| [Heroku](/integrations/heroku)                 | Available   |
+| Kubernetes                                     | Coming soon |
+| Vercel                                         | Coming soon |
+| AWS                                            | Coming soon |
+| GCP                                            | Coming soon |
+| Azure                                          | Coming soon |
+| DigitalOcean                                   | Coming soon |
+| GitLab                                         | Coming soon |
+| CircleCI                                       | Coming soon |
+| TravisCI                                       | Coming soon |
+| GitHub Actions                                 | Coming soon |
+| Jenkins                                        | Coming soon |

docs/mint.json

@@ -21,31 +21,36 @@
       "to": "#F8B7BD"
     }
   },
-  "topbarLinks": [{ "name": "Log In", "url": "https://infisical.com/login" }],
+  "topbarLinks": [{ "name": "Log In", "url": "https://app.infisical.com/login" }],
   "topbarCtaButton": {
     "name": "Start for Free",
-    "url": "https://infisical.com/signup"
+    "url": "https://app.infisical.com/signup"
   },
   "anchors": [
     {
       "name": "Blog",
       "icon": "newspaper",
-      "url": "https://infisical.com/blog"
+      "url": "https://blog.infisical.com/"
     }
   ],
   "navigation": [
     {
-      "group": "Platform",
+      "group": " ",
       "pages": [
-        "getting-started/introduction",
-        "getting-started/features",
+        {
+          "group": "Overview",
+          "pages": [
+            "getting-started/introduction",
+            "getting-started/quickstart",
+            "getting-started/features"
+          ]
+        },
         {
           "group": "Security",
           "pages": [
-            "getting-started/security/overview",
-            "getting-started/security/data-model",
-            "getting-started/security/mechanics",
-            "getting-started/security/statement"
+            "security/overview",
+            "security/data-model",
+            "security/mechanics"
           ]
         },
         {
@@ -56,49 +61,56 @@
             "getting-started/dashboard/project",
             "getting-started/dashboard/integrations",
             "getting-started/dashboard/token"
-          ]
+          ] 
         },
         {
-          "group": "Command Line",
+          "group": "CLI",
           "pages": [
-            "getting-started/cli/installation", 
-            "getting-started/cli/cli-guide", 
-            "getting-started/cli/token",
-            "getting-started/cli/reference"
+            "cli/overview",
+            "cli/usage",
+            {
+              "group": "Reference",
+              "pages": [
+                "cli/reference/commands",
+                "cli/reference/login",
+                "cli/reference/init",
+                "cli/reference/run"
+              ]
+            }
           ]
-        }
-      ]
-    },
-    {
-      "group": "Integrations",
-      "pages": [
-        "integrations/heroku",
-        "integrations/docker",
-        "integrations/docker-compose"
-      ]
-    },
-    {
-      "group": "Self-hosting",
-      "pages": [
-        "self-hosting/overview",
-        {
-          "group": "Deployments",
-          "pages": ["self-hosting/deployments/linux"]
         },
         {
-          "group": "Configuration",
-          "pages": ["self-hosting/configuration/envars"]
+          "group": "Integrations",
+          "pages": [
+            "integrations/overview",
+            "integrations/heroku",
+            "integrations/docker",
+            "integrations/docker-compose"
+          ]
+        },
+        {
+          "group": "Self-hosting",
+          "pages": [
+            "self-hosting/overview",
+            {
+              "group": "Deployments",
+              "pages": ["self-hosting/deployments/linux"]
+            },
+            {
+              "group": "Configuration",
+              "pages": ["self-hosting/configuration/envars"]
+            }
+          ]
+        },
+        {
+          "group": "Contributing",
+          "pages": [
+            "contributing/overview",
+            "contributing/code-of-conduct",
+            "contributing/developing"
+          ]
         }
       ]
-    },
-    {
-      "group": "Contributing",
-      "pages": [
-        "contributing/overview",
-        "contributing/code-of-conduct",
-        "contributing/developing",
-        "contributing/architecture"
-      ]
     }
   ],
   "backgroundImage": "/images/background.png"

docs/security/overview.mdx

@@ -18,3 +18,13 @@ In subsequent sections, we refer:
 
 - To users uploading their secrets to Infisical as “senders” and those receiving secrets as “receivers". For instance, if Bob and Alice are both enrolled in a project and Bob adds new secrets to the project to be pulled by Alice, then Bob is considered to be the sender and Alice the receiver.
 - To any activity involving uploading or modifying secrets to Infisical as "pushing" and fetching secrets from Infisical as "pulling."
+
+## Statement
+
+As a secrets manager, we are deeply committed to enforcing the privacy and security of all users and data on the platform but acknowledge that it is virtually impossible to guarantee perfect security; unfortunately, even the most secure systems have vulnerabilities.
+
+As part of our commitment, we do our best to maintain platform privacy and security, notify users if anything goes wrong, and rectify adverse situations immediately if anything happens. As Infisical grows, we will be adding more opt-in security measures to ensure better data protection and maintain trust within the growing community. With that, let’s make the most simple and secure secrets management system out there!
+
+Best,
+
+Infisical Team

docs/self-hosting/configuration/envars.mdx

@@ -7,29 +7,27 @@ description: ""
 
 Configuring Infisical requires setting some environment variables. There is a file called `.env.example` at the root directory of our main repo that you can use to create a `.env` before you start the server.
 
-| Variable                          | Description                                                                                                 | Default Value    |
-| --------------------------------- | ----------------------------------------------------------------------------------------------------------- | ---------------- |
-| `PRIVATE_KEY`                     | ❗️ NaCl-generated server secret key                                                                        | `None`           |
-| `PUBLIC_KEY`                      | ❗️ NaCl-generated server public key                                                                        | `None`           |
-| `ENCRYPTION_KEY`                  | ❗️ Strong hex encryption key                                                                               | `None`           |
-| `JWT_SIGNUP_SECRET`               | ❗️JWT token secret                                                                                         | `None`           |
-| `JWT_REFRESH_SECRET`              | ❗️ JWT token secret                                                                                        | `None`           |
-| `JWT_AUTH_SECRET`                 | ❗️ JWT token secret                                                                                        | `None`           |
-| `JWT_SIGNUP_LIFETIME`             | JWT token lifetime expressed in seconds or a string describing a time span (e.g. 60, "2 days", "10h", "7d") | `15m`            |
-| `JWT_REFRESH_LIFETIME`            | JWT token lifetime expressed in seconds or a string describing a time span (e.g. 60, "2 days", "10h", "7d") | `90d`            |
-| `JWT_AUTH_LIFETIME`               | JWT token lifetime expressed in seconds or a string describing a time span (e.g. 60, "2 days", "10h", "7d") | `10d`            |
-| `EMAIL_TOKEN_LIFETIME`            | Email OTP/magic-link lifetime expressed in seconds                                                          | `86400`          |
-| `MONGO_URL`                       | ❗️ MongoDB instance connection string either to container instance or MongoDB Cloud                        | `None`           |
-| `MONGO_INITDB_ROOT_USERNAME`      | MongoDB container username                                                                                  | `None`           |
-| `MONGO_INITDB_ROOT_PASSWORD`      | MongoDB container password                                                                                  | `None`           |
-| `ME_CONFIG_MONGODB_ADMINUSERNAME` | Same as `MONGO_USERNAME` for mongo-express in development                                                   | `None`           |
-| `ME_CONFIG_MONGODB_ADMINPASSWORD` | Same as `MONGO_PASSWORD` for mongo-express in development                                                   | `None`           |
-| `NODE_ENV`                        | ❗️ `production` or `development`                                                                           | `None`           |
-| `NEXT_PUBLIC_WEBSITE_URL`         | ❗️ Site URL - should be an absolute URL including the protocol (e.g. `https://infisical.com`)              | `None`           |
-| `SMT_HOST`                        | Whether the user joined the community                                                                       | `smtp.gmail.com` |
-| `SMTP_NAME`                       | ❗️ Whether the user joined the community                                                                   | `None`           |
-| `SMTP_USERNAME`                   | ❗️ Whether the user joined the community                                                                   | `None`           |
-| `SMTP_PASSWORD`                   | ❗️ Whether the user joined the community                                                                   | `None`           |
-| `OAUTH_CLIENT_SECRET_HEROKU`      | OAuth client secret for Heroku integration                                                                  | `None`           |
-| `OAUTH_TOKEN_URL_HEROKU`          | OAuth token URL for Heroku integration                                                                      | `None`           |
-| `SENTRY_DSN`                      | DSN for error-monitoring with Sentry                                                                        | `None`           |
+| Variable                     | Description                                                                                                 | Default Value    |
+| ---------------------------- | ----------------------------------------------------------------------------------------------------------- | ---------------- |
+| `PRIVATE_KEY`                | ❗️ NaCl-generated server secret key                                                                        | `None`           |
+| `PUBLIC_KEY`                 | ❗️ NaCl-generated server public key                                                                        | `None`           |
+| `ENCRYPTION_KEY`             | ❗️ Strong hex encryption key                                                                               | `None`           |
+| `JWT_SIGNUP_SECRET`          | ❗️JWT token secret                                                                                         | `None`           |
+| `JWT_REFRESH_SECRET`         | ❗️ JWT token secret                                                                                        | `None`           |
+| `JWT_AUTH_SECRET`            | ❗️ JWT token secret                                                                                        | `None`           |
+| `JWT_SIGNUP_LIFETIME`        | JWT token lifetime expressed in seconds or a string describing a time span (e.g. 60, "2 days", "10h", "7d") | `15m`            |
+| `JWT_REFRESH_LIFETIME`       | JWT token lifetime expressed in seconds or a string describing a time span (e.g. 60, "2 days", "10h", "7d") | `90d`            |
+| `JWT_AUTH_LIFETIME`          | JWT token lifetime expressed in seconds or a string describing a time span (e.g. 60, "2 days", "10h", "7d") | `10d`            |
+| `EMAIL_TOKEN_LIFETIME`       | Email OTP/magic-link lifetime expressed in seconds                                                          | `86400`          |
+| `MONGO_URL`                  | ❗️ MongoDB instance connection string either to container instance or MongoDB Cloud                        | `None`           |
+| `MONGO_USERNAME`             | MongoDB username if using container                                                                         | `None`           |
+| `MONGO_PASSWORD`             | MongoDB password if using container                                                                         | `None`           |
+| `SITE_URL`                   | ❗️ Site URL - should be an absolute URL including the protocol (e.g. `https://app.infisical.com`)          | `None`           |
+| `SMT_HOST`                   | Whether the user joined the community                                                                       | `smtp.gmail.com` |
+| `SMTP_NAME`                  | Hostname to connect to for establishing SMTP connections (e.g. `Team`)                                      | `None`           |
+| `SMTP_USERNAME`              | ❗️ Credential to connect to host (e.g. `team@infisical.com`)                                               | `None`           |
+| `SMTP_PASSWORD`              | ❗️ Credential to connect to host                                                                           | `None`           |
+| `TELEMETRY_ENABLED`          | `true` or `false`. [More](../overview).                                                                     | `true`           |
+| `OAUTH_CLIENT_SECRET_HEROKU` | OAuth client secret for Heroku integration                                                                  | `None`           |
+| `OAUTH_TOKEN_URL_HEROKU`     | OAuth token URL for Heroku integration                                                                      | `None`           |
+| `SENTRY_DSN`                 | DSN for error-monitoring with Sentry                                                                        | `None`           |

docs/self-hosting/deployments/linux.mdx

@@ -33,7 +33,7 @@ wget -O .env https://raw.githubusercontent.com/Infisical/infisical/main/.env.exa
 wget -O docker-compose.yml https://raw.githubusercontent.com/Infisical/infisical/main/docker-compose.yml
 
 # Download nginx config
-mkdir nginx && cd nginx && wget -O https://raw.githubusercontent.com/Infisical/infisical/main/nginx/default.conf
+mkdir nginx && cd nginx && wget -O default.conf https://raw.githubusercontent.com/Infisical/infisical/main/nginx/default.dev.conf
 cd ..
 ```
 
@@ -48,7 +48,7 @@ nano .env
 
 ```bash
 # Start up services in detached mode
-docker-compose -f docker-compose.prod.yml up -d
+docker-compose -f docker-compose.yml up -d
 ```
 
-5. Your Infisical installation is complete and should be running on ports 40 and 443. Please note that the containers are not exposed to the internet and only bind to the localhost. It's up to you to configure a firewall, SSL certificates, and implement any additional security measures.
+5. Your Infisical installation is complete and should be running on port 8080. Please note that the containers are not exposed to the internet and only bind to the localhost. It's up to you to configure a firewall, SSL certificates, and implement any additional security measures.

docs/self-hosting/overview.mdx

@@ -16,3 +16,15 @@ Infisical Cloud also comes with some extra features unavailabe in the self-hoste
 ## Deployment options
 
 Infisical can be deployed on a Linux VM with docker-compose. We're rolling out more specific deployment options for DigitalOcean, AWS, GCP, and Azure soon.
+
+Options:
+
+- [Linux VM](/self-hosting/deployments/linux)
+
+## Telemetry
+
+Infisical collects telemetry data about general usage.
+
+The data helps us understand how the product is doing and guide our product development to create the best possible platform; it also helps us demonstrate growth for investors as we support Infisical as open-source software.
+
+To opt out of telemetry, you can set `TELEMETRY_ENABLED=false` within the [environment variables](./configuration/envars).

frontend/.eslintrc.json

@@ -0,0 +1,46 @@
+{
+  "extends": "next/core-web-vitals",
+  "plugins": [
+    "simple-import-sort"
+  ],
+  "rules": {
+    "react-hooks/exhaustive-deps": "off",
+    "simple-import-sort/exports": "warn",
+    "simple-import-sort/imports": [
+      "warn",
+      {
+        "groups": [
+          // Node.js builtins. You could also generate this regex if you use a `.js` config.
+          // For example: `^(${require("module").builtinModules.join("|")})(/|$)`
+          // Note that if you use the `node:` prefix for Node.js builtins,
+          // you can avoid this complexity: You can simply use "^node:".
+          [
+            "^(assert|buffer|child_process|cluster|console|constants|crypto|dgram|dns|domain|events|fs|http|https|module|net|os|path|punycode|querystring|readline|repl|stream|string_decoder|sys|timers|tls|tty|url|util|vm|zlib|freelist|v8|process|async_hooks|http2|perf_hooks)(/.*|$)"
+          ],
+          // Packages `react` related packages
+          [
+            "^react",
+            "^next",
+            "^@?\\w"
+          ],
+          // Internal packages.
+          [
+            "^~(/.*|$)"
+          ],
+          // Relative imports
+          [
+            "^\\.\\.(?!/?$)",
+            "^\\.\\./?$",
+            "^\\./(?=.*/)(?!/?$)",
+            "^\\.(?!/?$)",
+            "^\\./?$"
+          ],
+          // Style imports.
+          [
+            "^.+\\.?(css|scss)$"
+          ]
+        ]
+      }
+    ]
+  }
+}

frontend/Dockerfile.dev

@@ -7,10 +7,9 @@ WORKDIR /app
 # Copy over dependency files 
 COPY package.json ./
 COPY package-lock.json ./
-COPY yarn.lock ./
 
 # Install 
-RUN yarn install 
+RUN npm install 
 
 # Copy over next.js config 
 COPY next.config.js ./next.config.js
@@ -18,4 +17,4 @@ COPY next.config.js ./next.config.js
 # Copy all files 
 COPY . .
 
-CMD ["yarn", "dev"]
+CMD ["npm", "run", "dev"]

frontend/Dockerfile.prod

@@ -7,7 +7,6 @@ WORKDIR /app
 # Copy over dependency files 
 COPY package.json ./
 COPY package-lock.json ./
-COPY yarn.lock ./
 
 # Install 
 RUN npm install 

frontend/components/RouteGuard.js

@@ -1,7 +1,9 @@
-import { useState, useEffect } from "react";
-import { useRouter } from "next/router";
-import checkAuth from "../pages/api/auth/CheckAuth";
+import { useEffect,useState } from "react";
 import Image from "next/image";
+import { useRouter } from "next/router";
+
+import checkAuth from "~/pages/api/auth/CheckAuth";
+
 import { publicPaths } from "../const";
 
 // #TODO: finish spinner only when the data loads fully
@@ -11,9 +13,11 @@ export default function RouteGuard({ children }) {
 	const router = useRouter();
 	const [authorized, setAuthorized] = useState(false);
 
-	useEffect(async () => {
+	useEffect(() => {
 		// on initial load - run auth check
-		await authCheck(router.asPath);
+		(async () => {
+			await authCheck(router.asPath);
+		})();
 
 		// on route change start - hide page content by setting authorized to false
 		// #TODO: add the loading page when not yet authorized.
@@ -31,7 +35,6 @@ export default function RouteGuard({ children }) {
 			router.events.off("routeChangeComplete", authCheck);
 			// router.events.off("routeChangeError", onError);
 		};
-
 		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, []);
 
@@ -79,4 +82,4 @@ export default function RouteGuard({ children }) {
 			</div>
 		);
 	}
-}
+}

frontend/components/analytics/posthog.js

@@ -1,10 +1,12 @@
 import posthog from "posthog-js";
 
+import { ENV, POSTHOG_API_KEY, POSTHOG_HOST, TELEMETRY_ENABLED } from "../utilities/config";
+
 export const initPostHog = () => {
 	if (typeof window !== "undefined") {
-		if (process.env.NEXT_PUBLIC_ENV == "production") {
-			posthog.init(process.env.NEXT_PUBLIC_POSTHOG_API_KEY, {
-				api_host: process.env.NEXT_PUBLIC_POSTHOG_HOST,
+		if (ENV == "production" && TELEMETRY_ENABLED) {
+			posthog.init(POSTHOG_API_KEY, {
+				api_host: POSTHOG_HOST,
 			});
 		}
 	}

frontend/components/basic/Error.js

@@ -1,6 +1,6 @@
 import React, { useState } from "react";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { faExclamationTriangle } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 
 export default function Error({ text }) {
 	return (

frontend/components/basic/InputField.js

@@ -1,6 +1,6 @@
 import React from "react";
-import Error from "./Error";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { useState } from "react";
+import { useRouter } from "next/router";
 import {
 	faCircle,
 	faCircleExclamation,
@@ -8,9 +8,10 @@ import {
 	faEye,
 	faEyeSlash,
 } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+
 import guidGenerator from "../utilities/randomId";
-import { useState } from "react";
-import { useRouter } from "next/router";
+import Error from "./Error";
 
 const InputField = (props) => {
 	const [passwordVisible, setPasswordVisible] = useState(false);

frontend/components/basic/Listbox.js

@@ -1,9 +1,9 @@
 import React from "react";
-import { Listbox, Transition } from "@headlessui/react";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { faCheck, faPlus, faAngleDown } from "@fortawesome/free-solid-svg-icons";
 import { Fragment } from "react";
 import { useRouter } from "next/router";
+import { faAngleDown,faCheck, faPlus } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { Listbox, Transition } from "@headlessui/react";
 
 /**
  * This is the component that we use for drop down lists.

frontend/components/basic/buttons/Button.js

@@ -1,8 +1,8 @@
 import React from "react";
-import Link from "next/link";
 import Image from "next/image";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import Link from "next/link";
 import { faPlus } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 
 var classNames = require("classnames");
 

frontend/components/basic/dialog/AddIncidentContactDialog.js

@@ -1,8 +1,10 @@
-import { Dialog, Transition } from "@headlessui/react";
 import { Fragment, useState } from "react";
-import InputField from "../InputField";
-import addIncidentContact from "../../../pages/api/organization/addIncidentContact";
+import { Dialog, Transition } from "@headlessui/react";
+
+import addIncidentContact from "~/pages/api/organization/addIncidentContact";
+
 import Button from "../buttons/Button";
+import InputField from "../InputField";
 
 const AddIncidentContactDialog = ({
 	isOpen,

frontend/components/basic/dialog/AddProjectMemberDialog.js

@@ -1,8 +1,9 @@
-import { Dialog, Transition } from "@headlessui/react";
 import { Fragment, useState } from "react";
-import ListBox from "../Listbox";
 import { useRouter } from "next/router";
+import { Dialog, Transition } from "@headlessui/react";
+
 import Button from "../buttons/Button";
+import ListBox from "../Listbox";
 
 const AddProjectMemberDialog = ({
 	isOpen,

frontend/components/basic/dialog/AddServiceTokenDialog.js

@@ -1,15 +1,17 @@
-import { Dialog, Transition } from "@headlessui/react";
 import { Fragment, useState } from "react";
-import ListBox from "../Listbox";
 import { useRouter } from "next/router";
-import Button from "../buttons/Button";
-import InputField from "../InputField";
-import getLatestFileKey from "../../../pages/api/workspace/getLatestFileKey";
-import { decryptAssymmetric, encryptAssymmetric } from "../../utilities/crypto";
-import addServiceToken from "../../../pages/api/serviceToken/addServiceToken";
-import nacl from "tweetnacl";
 import { faCheck, faCopy } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { Dialog, Transition } from "@headlessui/react";
+import nacl from "tweetnacl";
+
+import addServiceToken from "~/pages/api/serviceToken/addServiceToken";
+import getLatestFileKey from "~/pages/api/workspace/getLatestFileKey";
+
+import { decryptAssymmetric, encryptAssymmetric } from "../../utilities/cryptography/crypto";
+import Button from "../buttons/Button";
+import InputField from "../InputField";
+import ListBox from "../Listbox";
 
 const envMapping = {
 	Development: "dev",
@@ -28,7 +30,7 @@ const AddServiceTokenDialog = ({
 	isOpen,
 	closeModal,
 	workspaceId,
-	workspaceName
+	workspaceName,
 }) => {
 	const router = useRouter();
 	const [serviceToken, setServiceToken] = useState("");
@@ -38,52 +40,52 @@ const AddServiceTokenDialog = ({
 	const [serviceTokenCopied, setServiceTokenCopied] = useState(false);
 
 	const generateServiceToken = async () => {
-		const latestFileKey = await getLatestFileKey(workspaceId); 
+		const latestFileKey = await getLatestFileKey(workspaceId);
 
 		const key = decryptAssymmetric({
 			ciphertext: latestFileKey.latestKey.encryptedKey,
 			nonce: latestFileKey.latestKey.nonce,
 			publicKey: latestFileKey.latestKey.sender.publicKey,
-			privateKey: localStorage.getItem("PRIVATE_KEY")
+			privateKey: localStorage.getItem("PRIVATE_KEY"),
 		});
 
 		// generate new public/private key pair
 		const pair = nacl.box.keyPair();
 		const publicKey = nacl.util.encodeBase64(pair.publicKey);
 		const privateKey = nacl.util.encodeBase64(pair.secretKey);
-		
+
 		// encrypt workspace key under newly-generated public key
 		const { ciphertext: encryptedKey, nonce } = encryptAssymmetric({
 			plaintext: key,
 			publicKey,
-			privateKey
+			privateKey,
 		});
 
 		let newServiceToken = await addServiceToken({
-			name: serviceTokenName, 
-			workspaceId, 
+			name: serviceTokenName,
+			workspaceId,
 			environment: envMapping[serviceTokenEnv],
-			expiresIn: expiryMapping[serviceTokenExpiresIn], 
-			publicKey, 
+			expiresIn: expiryMapping[serviceTokenExpiresIn],
+			publicKey,
 			encryptedKey,
-			nonce
-		})
-		
-		const serviceToken = newServiceToken + ',' + privateKey;
+			nonce,
+		});
+
+		const serviceToken = newServiceToken + "," + privateKey;
 		setServiceToken(serviceToken);
-	}
+	};
 
 	function copyToClipboard() {
 		// Get the text field
 		var copyText = document.getElementById("serviceToken");
-	  
+
 		// Select the text field
 		copyText.select();
 		copyText.setSelectionRange(0, 99999); // For mobile devices
-	  
-		 // Copy the text inside the text field
+
+		// Copy the text inside the text field
 		navigator.clipboard.writeText(copyText.value);
-	  
+
 		setServiceTokenCopied(true);
 		setTimeout(() => setServiceTokenCopied(false), 2000);
 		// Alert the copied text
@@ -94,7 +96,7 @@ const AddServiceTokenDialog = ({
 		closeModal();
 		setServiceTokenName("");
 		setServiceToken("");
-	}
+	};
 
 	return (
 		<div className="z-50">
@@ -123,18 +125,25 @@ const AddServiceTokenDialog = ({
 								leaveFrom="opacity-100 scale-100"
 								leaveTo="opacity-0 scale-95"
 							>
-								{serviceToken == "" 
-								?	<Dialog.Panel className="w-full max-w-md transform rounded-md bg-bunker-800 border border-gray-700 p-6 text-left align-middle shadow-xl transition-all">
+								{serviceToken == "" ? (
+									<Dialog.Panel className="w-full max-w-md transform rounded-md bg-bunker-800 border border-gray-700 p-6 text-left align-middle shadow-xl transition-all">
 										<Dialog.Title
 											as="h3"
 											className="text-lg font-medium leading-6 text-gray-400 z-50"
 										>
-											Add a service token for {workspaceName}
+											Add a service token for{" "}
+											{workspaceName}
 										</Dialog.Title>
 										<div className="mt-2 mb-4">
 											<div className="flex flex-col">
 												<p className="text-sm text-gray-500">
-													Specify the name, environment, and expiry period. When a token is generated, you will only be able to see it once before it disappears. Make sure to save it somewhere.
+													Specify the name,
+													environment, and expiry
+													period. When a token is
+													generated, you will only be
+													able to see it once before
+													it disappears. Make sure to
+													save it somewhere.
 												</p>
 											</div>
 										</div>
@@ -154,7 +163,12 @@ const AddServiceTokenDialog = ({
 											<ListBox
 												selected={serviceTokenEnv}
 												onChange={setServiceTokenEnv}
-												data={["Development", "Staging", "Production", "Testing"]}
+												data={[
+													"Development",
+													"Staging",
+													"Production",
+													"Testing",
+												]}
 												width="full"
 												text="Environment: "
 											/>
@@ -162,8 +176,14 @@ const AddServiceTokenDialog = ({
 										<div className="max-h-28">
 											<ListBox
 												selected={serviceTokenExpiresIn}
-												onChange={setServiceTokenExpiresIn}
-												data={["1 day", "7 days", "1 month"]}
+												onChange={
+													setServiceTokenExpiresIn
+												}
+												data={[
+													"1 day",
+													"7 days",
+													"1 month",
+												]}
 												width="full"
 												text="Expires in: "
 											/>
@@ -171,17 +191,24 @@ const AddServiceTokenDialog = ({
 										<div className="max-w-max">
 											<div className="mt-6 flex flex-col justify-start w-max">
 												<Button
-													onButtonPressed={() => generateServiceToken()}
+													onButtonPressed={() =>
+														generateServiceToken()
+													}
 													color="mineshaft"
 													text="Add Service Token"
 													textDisabled="Add Service Token"
 													size="md"
-													active={serviceTokenName == "" ? false : true}
+													active={
+														serviceTokenName == ""
+															? false
+															: true
+													}
 												/>
 											</div>
 										</div>
 									</Dialog.Panel>
-								:	<Dialog.Panel className="w-full max-w-md transform rounded-md bg-bunker-800 border border-gray-700 p-6 text-left align-middle shadow-xl transition-all">
+								) : (
+									<Dialog.Panel className="w-full max-w-md transform rounded-md bg-bunker-800 border border-gray-700 p-6 text-left align-middle shadow-xl transition-all">
 										<Dialog.Title
 											as="h3"
 											className="text-lg font-medium leading-6 text-gray-400 z-50"
@@ -191,17 +218,40 @@ const AddServiceTokenDialog = ({
 										<div className="mt-2 mb-4">
 											<div className="flex flex-col">
 												<p className="text-sm text-gray-500">
-													Once you close this popup, you will never see your service token again
+													Once you close this popup,
+													you will never see your
+													service token again
 												</p>
 											</div>
 										</div>
 										<div className="w-full">
 											<div className="flex justify-end items-center bg-white/[0.07] text-base mt-2 mr-2 rounded-md text-gray-400 w-full h-36">
-												<input type="text" value={serviceToken} id="serviceToken" className="invisible bg-white/0 text-gray-400 py-2 w-full px-2 min-w-full outline-none"></input>
-												<div className="bg-white/0 max-w-md text-sm text-gray-400 py-2 w-full pl-14 pr-2 break-words outline-none">{serviceToken}</div>
+												<input
+													type="text"
+													value={serviceToken}
+													id="serviceToken"
+													className="invisible bg-white/0 text-gray-400 py-2 w-full px-2 min-w-full outline-none"
+												></input>
+												<div className="bg-white/0 max-w-md text-sm text-gray-400 py-2 w-full pl-14 pr-2 break-words outline-none">
+													{serviceToken}
+												</div>
 												<div className="group font-normal h-full relative inline-block text-gray-400 underline hover:text-primary duration-200">
-													<button onClick={copyToClipboard} className="h-full pl-3.5 pr-4 border-l border-white/20 py-2 hover:bg-white/[0.12] duration-200">
-														{serviceTokenCopied ? <FontAwesomeIcon icon={faCheck} className="pr-0.5"/> : <FontAwesomeIcon icon={faCopy} />}
+													<button
+														onClick={
+															copyToClipboard
+														}
+														className="h-full pl-3.5 pr-4 border-l border-white/20 py-2 hover:bg-white/[0.12] duration-200"
+													>
+														{serviceTokenCopied ? (
+															<FontAwesomeIcon
+																icon={faCheck}
+																className="pr-0.5"
+															/>
+														) : (
+															<FontAwesomeIcon
+																icon={faCopy}
+															/>
+														)}
 													</button>
 													<span className="absolute hidden group-hover:flex group-hover:animate-popup duration-300 w-28 -left-8 -top-20 translate-y-full px-3 py-2 bg-chicago-900 rounded-md text-center text-gray-400 text-sm">
 														Click to Copy
@@ -211,14 +261,16 @@ const AddServiceTokenDialog = ({
 										</div>
 										<div className="mt-6 flex flex-col justify-start w-max">
 											<Button
-												onButtonPressed={() => closeAddServiceTokenModal()}
+												onButtonPressed={() =>
+													closeAddServiceTokenModal()
+												}
 												color="mineshaft"
 												text="Close"
 												size="md"
 											/>
 										</div>
 									</Dialog.Panel>
-									}
+								)}
 							</Transition.Child>
 						</div>
 					</div>

frontend/components/basic/dialog/AddUserDialog.js

@@ -1,8 +1,10 @@
-import { Dialog, Transition } from "@headlessui/react";
 import { Fragment } from "react";
-import InputField from "../InputField";
 import { useRouter } from "next/router";
+import { Dialog, Transition } from "@headlessui/react";
+
+import { STRIPE_PRODUCT_STARTER } from "../../utilities/config";
 import Button from "../buttons/Button";
+import InputField from "../InputField";
 
 const AddUserDialog = ({
 	isOpen,
@@ -70,7 +72,7 @@ const AddUserDialog = ({
 											isRequired
 										/>
 									</div>
-									{currentPlan == process.env.NEXT_PUBLIC_STRIPE_PRODUCT_STARTER && <div className="flex flex-row">
+									{currentPlan == STRIPE_PRODUCT_STARTER && <div className="flex flex-row">
 										<button
 											type="button"
 											className="inline-flex justify-center rounded-md py-1 text-sm text-gray-500 focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2"

frontend/components/basic/dialog/AddWorkspaceDialog.js

@@ -1,9 +1,10 @@
-import { Dialog, Transition } from "@headlessui/react";
 import { Fragment, useState } from "react";
-import InputField from "../InputField";
 import Image from "next/image";
-import { Checkbox } from "../table/Checkbox";
+import { Dialog, Transition } from "@headlessui/react";
+
 import Button from "../buttons/Button";
+import InputField from "../InputField";
+import { Checkbox } from "../table/Checkbox";
 
 /**
  * The dialog modal for when the user wants to create a new workspace

frontend/components/basic/dialog/DeleteUserDialog.js

@@ -1,5 +1,6 @@
-import { Dialog, Transition } from '@headlessui/react'
 import { Fragment, useState } from 'react'
+import { Dialog, Transition } from '@headlessui/react'
+
 import InputField from '../InputField';
 
 // #TODO: USE THIS. Currently it's not. Kinda complicated to set up because of state.

frontend/components/basic/layout.js

@@ -1,28 +1,29 @@
+/* eslint-disable react-hooks/exhaustive-deps */
+import { useEffect, useState } from "react";
 import Link from "next/link";
 import { useRouter } from "next/router";
-import { useEffect, useState } from "react";
+import {
+	faGear,
+	faHouse,
+	faLink,
+	faMobile,
+	faUser,
+} from "@fortawesome/free-solid-svg-icons";
+import { faPlus } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+
+import getOrganizations from "~/pages/api/organization/getOrgs";
+import getOrganizationUserProjects from "~/pages/api/organization/GetOrgUserProjects";
+import getOrganizationUsers from "~/pages/api/organization/GetOrgUsers";
+import addUserToWorkspace from "~/pages/api/workspace/addUserToWorkspace";
+import createWorkspace from "~/pages/api/workspace/createWorkspace";
+import getWorkspaces from "~/pages/api/workspace/getWorkspaces";
 
 import NavBarDashboard from "../navigation/NavBarDashboard";
-import Listbox from "./Listbox";
-import getWorkspaces from "../../pages/api/workspace/getWorkspaces";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import {
-	faHouse,
-	faUser,
-	faGear,
-	faMobile,
-	faLink,
-} from "@fortawesome/free-solid-svg-icons";
-import AddWorkspaceDialog from "./dialog/AddWorkspaceDialog";
-import createWorkspace from "../../pages/api/workspace/createWorkspace";
-import getOrganizationUserProjects from "../../pages/api/organization/GetOrgUserProjects";
-import getOrganizationUsers from "../../pages/api/organization/GetOrgUsers";
-import addUserToWorkspace from "../../pages/api/workspace/addUserToWorkspace";
-import getOrganizations from "../../pages/api/organization/getOrgs";
-import { faPlus } from "@fortawesome/free-solid-svg-icons";
-
-import { decryptAssymmetric, encryptAssymmetric } from "../utilities/crypto";
+import { decryptAssymmetric, encryptAssymmetric } from "../utilities/cryptography/crypto";
 import Button from "./buttons/Button";
+import AddWorkspaceDialog from "./dialog/AddWorkspaceDialog";
+import Listbox from "./Listbox";
 
 export default function Layout({ children }) {
 	const router = useRouter();
@@ -48,9 +49,7 @@ export default function Layout({ children }) {
 		setLoading(true);
 		setTimeout(() => setLoading(false), 1500);
 		const workspaces = await getWorkspaces();
-		const currentWorkspaces = workspaces.map(
-			(workspace) => workspace.name
-		);
+		const currentWorkspaces = workspaces.map((workspace) => workspace.name);
 		if (!currentWorkspaces.includes(workspaceName)) {
 			const newWorkspace = await createWorkspace(
 				workspaceName,
@@ -141,7 +140,10 @@ export default function Layout({ children }) {
 
 	useEffect(async () => {
 		// Put a user in a workspace if they're not in one yet
-		if (localStorage.getItem("orgData.id") == null || localStorage.getItem("orgData.id") == "") {
+		if (
+			localStorage.getItem("orgData.id") == null ||
+			localStorage.getItem("orgData.id") == ""
+		) {
 			const userOrgs = await getOrganizations();
 			localStorage.setItem("orgData.id", userOrgs[0]._id);
 		}
@@ -150,7 +152,11 @@ export default function Layout({ children }) {
 			orgId: localStorage.getItem("orgData.id"),
 		});
 		let userWorkspaces = orgUserProjects;
-		if (userWorkspaces.length == 0 && (router.asPath != "/noprojects" && !router.asPath.includes("settings"))) {
+		if (
+			userWorkspaces.length == 0 &&
+			router.asPath != "/noprojects" &&
+			!router.asPath.includes("settings")
+		) {
 			router.push("/noprojects");
 		} else if (router.asPath != "/noprojects") {
 			const intendedWorkspaceId = router.asPath
@@ -158,7 +164,9 @@ export default function Layout({ children }) {
 				[router.asPath.split("/").length - 1].split("?")[0];
 
 			// If a user is not a member of a workspace they are trying to access, just push them to one of theirs
-			if (intendedWorkspaceId != "heroku" && !userWorkspaces
+			if (
+				intendedWorkspaceId != "heroku" &&
+				!userWorkspaces
 					.map((workspace) => workspace._id)
 					.includes(intendedWorkspaceId)
 			) {
@@ -207,7 +215,10 @@ export default function Layout({ children }) {
 						workspaceMapping[workspaceSelected] +
 						"?Development"
 				);
-				localStorage.setItem("projectData.id", workspaceMapping[workspaceSelected])
+				localStorage.setItem(
+					"projectData.id",
+					workspaceMapping[workspaceSelected]
+				);
 			}
 		} catch (error) {
 			console.log(error);
@@ -226,8 +237,8 @@ export default function Layout({ children }) {
 								<div className="text-gray-400 self-start ml-1 mb-1 text-xs font-semibold tracking-wide">
 									PROJECT
 								</div>
-								{workspaceList.length>0 
-									? <Listbox
+								{workspaceList.length > 0 ? (
+									<Listbox
 										selected={workspaceSelected}
 										onChange={setWorkspaceSelected}
 										data={workspaceList}
@@ -235,58 +246,67 @@ export default function Layout({ children }) {
 										text=""
 										workspaceMapping={workspaceMapping}
 									/>
-									: <Button
+								) : (
+									<Button
 										text="Add Project"
 										onButtonPressed={openModal}
 										color="mineshaft"
 										size="md"
 										icon={faPlus}
 									/>
-								}
+								)}
 							</div>
 							<ul>
-								{workspaceList.length > 0 && menuItems.map(({ href, title, emoji }) => (
-									<li className="mt-1.5 mx-2" key={title}>
-										{router.asPath.split("/")[1] ===
-											href.split("/")[1] &&
-										(["project", "billing", "org", "personal"].includes(
-											router.asPath.split("/")[2]
-										)
-											? router.asPath.split("/")[2] ===
-											  href.split("/")[2]
-											: true) ? (
-											<div
-												className={`flex p-2 text-white text-sm rounded cursor-pointer bg-mineshaft-50/10`}
-											>
-												<div className="bg-primary w-1 rounded-xl mr-1"></div>
-												<p className="ml-2 mr-4">
-													{emoji}
-												</p>
-												{title}
-											</div>
-										) : router.asPath == "/noprojects" ? (
-											<div
-												className={`flex p-2 text-white text-sm rounded`}
-											>
-												<p className="ml-2 mr-4">
-													{emoji}
-												</p>
-												{title}
-											</div>
-										) : (
-											<Link href={href}>
+								{workspaceList.length > 0 &&
+									menuItems.map(({ href, title, emoji }) => (
+										<li className="mt-1.5 mx-2" key={title}>
+											{router.asPath.split("/")[1] ===
+												href.split("/")[1] &&
+											([
+												"project",
+												"billing",
+												"org",
+												"personal",
+											].includes(
+												router.asPath.split("/")[2]
+											)
+												? router.asPath.split(
+														"/"
+												  )[2] === href.split("/")[2]
+												: true) ? (
 												<div
-													className={`flex p-2 text-white text-sm rounded cursor-pointer hover:bg-mineshaft-50/5`}
+													className={`flex p-2 text-white text-sm rounded cursor-pointer bg-mineshaft-50/10`}
+												>
+													<div className="bg-primary w-1 rounded-xl mr-1"></div>
+													<p className="ml-2 mr-4">
+														{emoji}
+													</p>
+													{title}
+												</div>
+											) : router.asPath ==
+											  "/noprojects" ? (
+												<div
+													className={`flex p-2 text-white text-sm rounded`}
 												>
 													<p className="ml-2 mr-4">
 														{emoji}
 													</p>
 													{title}
 												</div>
-											</Link>
-										)}
-									</li>
-								))}
+											) : (
+												<Link href={href}>
+													<div
+														className={`flex p-2 text-white text-sm rounded cursor-pointer hover:bg-mineshaft-50/5`}
+													>
+														<p className="ml-2 mr-4">
+															{emoji}
+														</p>
+														{title}
+													</div>
+												</Link>
+											)}
+										</li>
+									))}
 							</ul>
 						</nav>
 					</aside>

frontend/components/basic/popups/BottomRightPopup.js

@@ -1,8 +1,6 @@
 import React from "react";
+import { faXmark } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import {
-	faXmark,
-} from "@fortawesome/free-solid-svg-icons";
 
 export default function BottonRightPopup({
 	buttonText,
@@ -11,22 +9,34 @@ export default function BottonRightPopup({
 	emoji,
 	textLine1,
 	textLine2,
-	setCheckDocsPopUpVisible
+	setCheckDocsPopUpVisible,
 }) {
 	return (
-		<div class="z-50 drop-shadow-xl border-gray-600/50 border flex flex-col items-start bg-bunker max-w-xl text-gray-200 pt-3 pb-4 rounded-xl absolute bottom-0 right-0 mr-6 mb-6" role="alert">
+		<div
+			class="z-50 drop-shadow-xl border-gray-600/50 border flex flex-col items-start bg-bunker max-w-xl text-gray-200 pt-3 pb-4 rounded-xl absolute bottom-0 right-0 mr-6 mb-6"
+			role="alert"
+		>
 			<div className="flex flex-row items-center justify-between w-full border-b border-gray-600/70 pb-3 px-6">
 				<div className="font-bold text-xl mr-2 mt-0.5 flex flex-row">
 					<div>{titleText}</div>
 					<div class="ml-2.5">{emoji}</div>
 				</div>
-				<button className="mt-1" onClick={() => setCheckDocsPopUpVisible(false)}>
-					<FontAwesomeIcon icon={faXmark} className="text-gray-400 text-2xl hover:text-red duration-200 cursor-pointer" />
+				<button
+					className="mt-1"
+					onClick={() => setCheckDocsPopUpVisible(false)}
+				>
+					<FontAwesomeIcon
+						icon={faXmark}
+						className="text-gray-400 text-2xl hover:text-red duration-200 cursor-pointer"
+					/>
 				</button>
 			</div>
-			<div class="block sm:inline px-6 mt-4 mb-0.5 text-gray-300">{textLine1}</div>
+			<div class="block sm:inline px-6 mt-4 mb-0.5 text-gray-300">
+				{textLine1}
+			</div>
 			<div class="block sm:inline mb-4 px-6">{textLine2}</div>
 			<div className="flex flex-row px-6 w-full">
+				{/*eslint-disable-next-line react/jsx-no-target-blank */}
 				<a
 					class="font-bold p-2 bg-white/10 rounded-md w-full hover:bg-primary duration-200 hover:text-black flex justify-center"
 					href={buttonLink}

frontend/components/basic/table/ServiceTokenTable.js

@@ -1,8 +1,9 @@
 import React, { useEffect, useState } from "react";
 import { useRouter } from "next/router";
 import { faX } from "@fortawesome/free-solid-svg-icons";
-import Button from "../buttons/Button";
+
 import guidGenerator from "../../utilities/randomId";
+import Button from "../buttons/Button";
 
 const roles = ["admin", "user"];
 

frontend/components/basic/table/UserTable.js

@@ -1,19 +1,21 @@
 import React, { useEffect, useMemo, useState } from "react";
 import { useRouter } from "next/router";
-import Listbox from "../Listbox";
-import uploadKeys from "../../../pages/api/workspace/uploadKeys";
-import getLatestFileKey from "../../../pages/api/workspace/getLatestFileKey";
-import deleteUserFromWorkspace from "../../../pages/api/workspace/deleteUserFromWorkspace";
-import changeUserRoleInWorkspace from "../../../pages/api/workspace/changeUserRoleInWorkspace";
-import deleteUserFromOrganization from "../../../pages/api/organization/deleteUserFromOrganization";
 import { faX } from "@fortawesome/free-solid-svg-icons";
-import Button from "../buttons/Button";
+
+import deleteUserFromOrganization from "~/pages/api/organization/deleteUserFromOrganization";
+import changeUserRoleInWorkspace from "~/pages/api/workspace/changeUserRoleInWorkspace";
+import deleteUserFromWorkspace from "~/pages/api/workspace/deleteUserFromWorkspace";
+import getLatestFileKey from "~/pages/api/workspace/getLatestFileKey";
+import uploadKeys from "~/pages/api/workspace/uploadKeys";
+
 import guidGenerator from "../../utilities/randomId";
+import Button from "../buttons/Button";
+import Listbox from "../Listbox";
 
 const {
 	decryptAssymmetric,
 	encryptAssymmetric,
-} = require("../../utilities/crypto");
+} = require("../../utilities/cryptography/crypto");
 const nacl = require("tweetnacl");
 nacl.util = require("tweetnacl-util");
 
@@ -81,7 +83,7 @@ const UserTable = ({
 		]);
 	};
 
-	useEffect(async () => {
+	useEffect(() => {
 		setMyRole(userData.filter((user) => user.email == myUser)[0]?.role);
 	}, [userData, myUser]);
 
@@ -145,7 +147,10 @@ const UserTable = ({
 							)
 							.map((row, index) => {
 								return (
-									<tr key={guidGenerator()} className="bg-bunker-800 hover:bg-bunker-800/5">
+									<tr
+										key={guidGenerator()}
+										className="bg-bunker-800 hover:bg-bunker-800/5"
+									>
 										<td className="pl-6 py-2 border-mineshaft-700 border-t text-gray-300">
 											{row.firstName}
 										</td>

frontend/components/billing/Card.js

@@ -1,72 +0,0 @@
-import React from "react";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { faCheck, faQuestionCircle } from "@fortawesome/free-solid-svg-icons";
-import { faCcMastercard, faCcVisa } from "@fortawesome/free-brands-svg-icons";
-import { faCircle } from "@fortawesome/free-solid-svg-icons";
-
-export default function Card({ card, changeSelectedCard, selected }) {
-	function creditCardBrandIcon(cc) {
-		if (cc == "visa") {
-			return faCcVisa;
-		} else if ((cc = "mastercard")) {
-			return faCcMastercard;
-		} else return faQuestionCircle;
-	}
-
-	return (
-		<button onClick={() => changeSelectedCard(card.id)}>
-			<div
-				className={`flex flex-col p-3 items-start justify-between mr-2 w-52 h-28 bg-primary/5 rounded-lg duration-200 ${
-					card.id == selected
-						? "border-primary text-primary"
-						: "border-gray-500 text-gray-300"
-				} hover:border-primary border-2 hover:text-primary cursor-pointer`}
-			>
-				<div className="flex flex-row items-center justify-between w-full">
-					<FontAwesomeIcon
-						className="text-3xl mr-4"
-						icon={creditCardBrandIcon(card.card.brand)}
-					/>
-					{card.id == selected && (
-						<FontAwesomeIcon
-							className="text-xl ml-2 mr-2"
-							icon={faCheck}
-						/>
-					)}
-				</div>
-				<div className="flex flex-row items-center justify-between w-full">
-					<div className="flex flex-row items-center">
-						<p className="tracking-tighter mr-1 mt-0.5 flex">
-							{"****".split("").map(() => (
-								<FontAwesomeIcon
-									className="text-xxxs mr-0.5"
-									icon={faCircle}
-								/>
-							))}
-						</p>
-						<p className="tracking-tighter mr-1 mt-0.5 flex">
-							{"****".split("").map(() => (
-								<FontAwesomeIcon
-									className="text-xxxs mr-0.5"
-									icon={faCircle}
-								/>
-							))}
-						</p>
-						<p className="tracking-tighter mr-1 mt-0.5 flex">
-							{"****".split("").map(() => (
-								<FontAwesomeIcon
-									className="text-xxxs mr-0.5"
-									icon={faCircle}
-								/>
-							))}
-						</p>
-						<p className="text-xs">{card.card.last4}</p>
-					</div>
-					<p className="text-xs">
-						{card.card.exp_month + "/" + card.card.exp_year}
-					</p>
-				</div>
-			</div>
-		</button>
-	);
-}

frontend/components/billing/Plan.js

@@ -1,5 +1,6 @@
 import React from "react";
-import StripeRedirect from "../../pages/api/organization/StripeRedirect";
+
+import StripeRedirect from "~/pages/api/organization/StripeRedirect";
 
 export default function Plan({ plan }) {
 	return (
@@ -27,12 +28,12 @@ export default function Plan({ plan }) {
 						{plan.priceExplanation}
 					</p>
 				</div>
-			<p className="relative z-10 max-w-fit px-6 text-base text-gray-400">
-				{plan.text}
-			</p>
-			<p className="relative z-10 max-w-fit px-6 text-base text-gray-400">
-				{plan.subtext}
-			</p>
+				<p className="relative z-10 max-w-fit px-6 text-base text-gray-400">
+					{plan.text}
+				</p>
+				<p className="relative z-10 max-w-fit px-6 text-base text-gray-400">
+					{plan.subtext}
+				</p>
 			</div>
 			<div className="flex flex-row items-center">
 				{plan.current == false ? (
@@ -54,7 +55,17 @@ export default function Plan({ plan }) {
 										: "hover:bg-primary hover:text-black hover:border-primary"
 								} bg-bunker duration-200 cursor-pointer rounded-md flex w-max`}
 							>
-								<button onClick={() => StripeRedirect({orgId: localStorage.getItem("orgData.id")})}>{plan.buttonTextMain}</button>
+								<button
+									onClick={() =>
+										StripeRedirect({
+											orgId: localStorage.getItem(
+												"orgData.id"
+											),
+										})
+									}
+								>
+									{plan.buttonTextMain}
+								</button>
 							</div>
 						)}
 						<a href="/pricing" target='_blank rel="noopener"'>

frontend/components/dashboard/DashboardInputField.js

@@ -1,55 +1,130 @@
-import React from "react";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import React, { Fragment } from "react";
 import { faCircle } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+
 import guidGenerator from "../utilities/randomId";
 
+/**
+ * This function splits the input of a dashboard field into the parts that are inside and outside of ${...}
+ * @param {string} text - the value of the input in the Dashboard Input Field
+ * @returns
+ */
+const findReferences = (text) => {
+	var splitText = text.split("${");
+	let textArray = [splitText[0]];
+	for (var i = 1; i < splitText.length; i++) {
+		let insideBrackets = "${" + splitText[i].split("}")[0];
+		if (splitText[i].includes("}")) {
+			insideBrackets += "}";
+		}
+		textArray.push(insideBrackets);
+		textArray.push(splitText[i].split("}")[1]);
+	}
+	return textArray;
+};
 
-const DashboardInputField = ({label, index, onChangeHandler, type, value, placeholder, isRequired, blurred, isStatic}) => {
-	if (isStatic === true) {
-		return (
-			<div className="flex flex-col my-2 md:my-4 justify-center w-full max-w-md">
-				<p className="text-sm font-semibold text-gray-400 mb-0.5">
-					{label}
-				</p>
-				{text && (
-					<p className="text-xs text-gray-400 mb-2">{text}</p>
-				)}
-				<input
-					onChange={(e) => console.log(e.target.value, index)}
-					type={type}
-					placeholder={placeholder}
-					value={value}
-					required={isRequired}
-					className="bg-bunker-800 text-gray-400 border border-gray-600 rounded-md text-md p-2 w-full min-w-16 outline-none"
-					readOnly
-				/>
-			</div>
-		);
-	} else {
+/**
+ * This component renders the input fields on the dashboard
+ * @param {object} obj - the order number of a keyPair
+ * @param {number} obj.index - the order number of a keyPair
+ * @param {function} obj.onChangeHandler - what happens when the input is modified
+ * @param {string} obj.type - whether the input field is for a Key Name or for a Key Value
+ * @param {string} obj.value - value of the InputField
+ * @param {boolean} obj.blurred - whether the input field should be blurred (behind the gray dots) or not; this can be turned on/off in the dashboard
+ * @returns
+ */
+const DashboardInputField = ({
+	index,
+	onChangeHandler,
+	type,
+	value,
+	blurred,
+}) => {
+	if (type === "varName") {
 		return (
 			<div className="flex-col w-full">
 				<div
-					className={`group flex flex-col justify-center w-full max-w-2xl border border-mineshaft-500 rounded-md`}
+					className={`group relative flex flex-col justify-center w-full max-w-2xl border border-mineshaft-500 rounded-md`}
 				>
 					<input
 						onChange={(e) => onChangeHandler(e.target.value, index)}
 						type={type}
-						placeholder={placeholder}
 						value={value}
-						required={isRequired}
-						className={`${
-							blurred
-								? "text-bunker-800 group-hover:text-gray-400 focus:text-gray-400 active:text-gray-400"
-								: ""
-						} peer ph-no-capture bg-bunker-800 rounded-md text-gray-400 text-md px-2 py-1.5 w-full min-w-16 outline-none focus:ring-4 focus:ring-primary/50 duration-200`}
+						className="asolute z-10 peer font-mono ph-no-capture bg-bunker-800 rounded-md caret-white text-gray-400 text-md px-2 py-1.5 w-full min-w-16 outline-none focus:ring-4 focus:ring-primary/50 duration-200"
 						spellCheck="false"
 					/>
+				</div>
+			</div>
+		);
+	} else if (type === "value") {
+		return (
+			<div className="flex-col w-full">
+				<div
+					className={`group relative flex flex-col justify-center w-full max-w-2xl border border-mineshaft-500 rounded-md`}
+				>
+					<input
+						onChange={(e) => onChangeHandler(e.target.value, index)}
+						type={type}
+						value={value}
+						className={`${
+							blurred
+								? "text-transparent group-hover:text-transparent focus:text-transparent active:text-transparent"
+								: ""
+						} asolute z-10 peer font-mono ph-no-capture bg-transparent rounded-md caret-white text-transparent text-md px-2 py-1.5 w-full min-w-16 outline-none focus:ring-4 focus:ring-primary/50 duration-200`}
+						spellCheck="false"
+					/>
+					<div
+						className={`${
+							blurred
+								? "text-bunker-800 group-hover:text-gray-400 peer-focus:text-gray-400 peer-active:text-gray-400"
+								: ""
+						} flex flex-row font-mono absolute z-0 ph-no-capture bg-bunker-800 h-9 rounded-md text-gray-400 text-md px-2 py-1.5 w-full min-w-16 outline-none focus:ring-4 focus:ring-primary/50 duration-100`}
+					>
+						{findReferences(value).map((texts, id) => {
+							if (id % 2 == 0 || texts.length <= 2) {
+								return (
+									<span className="ph-no-capture" key={id}>
+										{texts}
+									</span>
+								);
+							}
+							return (
+								<span
+									className="ph-no-capture text-yellow"
+									key={id}
+								>
+									{texts.slice(0, 2)}
+									<span className="ph-no-capture text-yellow-200/80">
+										{texts.slice(2, texts.length - 1)}
+									</span>
+									{texts.slice(
+										texts.length - 1,
+										texts.length
+									) == "}" ? (
+										<span className="ph-no-capture text-yellow">
+											{texts.slice(
+												texts.length - 1,
+												texts.length
+											)}{" "}
+										</span>
+									) : (
+										<span className="ph-no-capture text-yellow-400">
+											{texts.slice(
+												texts.length - 1,
+												texts.length
+											)}{" "}
+										</span>
+									)}
+								</span>
+							);
+						})}
+					</div>
 					{blurred && (
-						<div className="peer pr-24 group-hover:hidden peer-hover:hidden peer-focus:hidden peer-active:invisible absolute h-10 w-fit max-w-xl rounded-md flex items-center text-gray-400/50 text-clip overflow-hidden">
+						<div className="z-20 peer pr-2 bg-bunker-800 group-hover:hidden peer-hover:hidden peer-focus:hidden peer-active:invisible absolute h-9 w-fit max-w-xl rounded-md flex items-center text-gray-400/50 text-clip overflow-hidden">
 							<p className="ml-2"></p>
 							{value
 								.split("")
-								.slice(0,42)
+								.slice(0, 42)
 								.map(() => (
 									<FontAwesomeIcon
 										key={guidGenerator()}

frontend/components/dashboard/DropZone.js

@@ -1,13 +1,12 @@
 import { useState } from "react";
-
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { faUpload } from "@fortawesome/free-solid-svg-icons";
-import guidGenerator from "../utilities/randomId";
-
-import Error from "../basic/Error";
 import Image from "next/image";
-import parse from "../utilities/file";
+import { faUpload } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+
 import Button from "../basic/buttons/Button";
+import Error from "../basic/Error";
+import parse from "../utilities/file";
+import guidGenerator from "../utilities/randomId";
 
 const DropZone = ({
 	setData,

frontend/components/navigation/NavBarDashboard.js

@@ -1,37 +1,39 @@
-import React, { useState, Fragment, useEffect } from "react";
-import { useRouter } from "next/router";
-
+/* eslint-disable react-hooks/exhaustive-deps */
+/* eslint-disable react/jsx-key */
+import React, { Fragment, useEffect,useState } from "react";
 import Image from "next/image";
-
-import logout from "../../pages/api/auth/Logout";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { useRouter } from "next/router";
+import { faGithub,faSlack } from "@fortawesome/free-brands-svg-icons";
 import { faCircleQuestion } from "@fortawesome/free-regular-svg-icons";
 import {
+	faAngleDown,
 	faBook,
-	faGear,
 	faCoins,
-	faRightFromBracket,
 	faEnvelope,
-	faPlus, 
-	faAngleDown
+	faGear,
+	faPlus,
+	faRightFromBracket,
 } from "@fortawesome/free-solid-svg-icons";
-import { faSlack, faGithub } from "@fortawesome/free-brands-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { Menu, Transition } from "@headlessui/react";
-import getUser from "../../pages/api/user/getUser";
-import getOrganizations from "../../pages/api/organization/getOrgs";
-import getOrganization from "../../pages/api/organization/GetOrg";
+
+import logout from "~/pages/api/auth/Logout";
+import getOrganization from "~/pages/api/organization/GetOrg";
+import getOrganizations from "~/pages/api/organization/getOrgs";
+import getUser from "~/pages/api/user/getUser";
+
 import guidGenerator from "../utilities/randomId";
 
 const supportOptions = [
 	[
 		<FontAwesomeIcon className="text-lg pl-1.5 pr-3" icon={faSlack} />,
-		"[NEW] Join Slack Forum",
-		"https://join.slack.com/t/infisical/shared_invite/zt-1dgg63ln8-G7PCNJdCymAT9YF3j1ewVA",
+		"Join Slack Forum",
+		"https://join.slack.com/t/infisical-users/shared_invite/zt-1kdbk07ro-RtoyEt_9E~fyzGo_xQYP6g",
 	],
 	[
 		<FontAwesomeIcon className="text-lg pl-1.5 pr-3" icon={faBook} />,
 		"Read Docs",
-		"https://infisical.com/docs/gettingStarted",
+		"https://infisical.com/docs/getting-started/introduction",
 	],
 	[
 		<FontAwesomeIcon className="text-lg pl-1.5 pr-3" icon={faGithub} />,
@@ -87,7 +89,7 @@ export default function Navbar({ onButtonPressed }) {
 			</div>
 			<div className="relative flex justify-start items-center mx-2 z-40">
 				<Menu as="div" className="relative inline-block text-left">
-					<div className="mr-4"> 
+					<div className="mr-4">
 						<Menu.Button className="inline-flex w-full justify-center rounded-md px-2 py-2 text-sm font-medium text-gray-200 rounded-md hover:bg-white/10 duration-200 focus:outline-none focus-visible:ring-2 focus-visible:ring-white focus-visible:ring-opacity-75">
 							<FontAwesomeIcon
 								className="text-xl"
@@ -106,6 +108,7 @@ export default function Navbar({ onButtonPressed }) {
 					>
 						<Menu.Items className="absolute right-0 mt-0.5 w-64 origin-top-right rounded-md bg-bunker border border-mineshaft-700 shadow-lg ring-1 ring-black z-20 ring-opacity-5 focus:outline-none px-2 py-1.5">
 							{supportOptions.map((option) => (
+								// eslint-disable-next-line react/jsx-no-target-blank
 								<a
 									key={guidGenerator()}
 									target="_blank"
@@ -128,7 +131,10 @@ export default function Navbar({ onButtonPressed }) {
 					<div>
 						<Menu.Button className="inline-flex w-full justify-center rounded-md pr-2 pl-2 py-2 text-sm font-medium text-gray-200 rounded-md hover:bg-white/10 duration-200 focus:outline-none focus-visible:ring-2 focus-visible:ring-white focus-visible:ring-opacity-75">
 							{user?.firstName} {user?.lastName}
-							<FontAwesomeIcon icon={faAngleDown} className="ml-2 mt-1 text-sm text-gray-300 hover:text-lime-100"/>
+							<FontAwesomeIcon
+								icon={faAngleDown}
+								className="ml-2 mt-1 text-sm text-gray-300 hover:text-lime-100"
+							/>
 						</Menu.Button>
 					</div>
 					<Transition
@@ -145,13 +151,15 @@ export default function Navbar({ onButtonPressed }) {
 								<div className="text-gray-400 self-start ml-2 mt-2 text-xs font-semibold tracking-wide">
 									SIGNED IN AS
 								</div>
-								<div 
+								<div
 									onClick={() =>
 										router.push(
-											"/settings/personal/" + router.query.id
+											"/settings/personal/" +
+												router.query.id
 										)
 									}
-									className="flex flex-row items-center px-1 mx-1 my-1 hover:bg-white/5 cursor-pointer rounded-md">
+									className="flex flex-row items-center px-1 mx-1 my-1 hover:bg-white/5 cursor-pointer rounded-md"
+								>
 									<div className="bg-white/10 h-8 w-9 rounded-full flex items-center justify-center text-gray-300">
 										{user?.firstName?.charAt(0)}
 									</div>
@@ -159,7 +167,8 @@ export default function Navbar({ onButtonPressed }) {
 										<div>
 											<p className="text-gray-300 px-2 pt-1 text-sm">
 												{" "}
-												{user?.firstName} {user?.lastName}
+												{user?.firstName}{" "}
+												{user?.lastName}
 											</p>
 											<p className="text-gray-400 px-2 pb-1 text-xs">
 												{" "}
@@ -235,7 +244,10 @@ export default function Navbar({ onButtonPressed }) {
 										className="relative flex justify-start cursor-pointer select-none py-2 pl-10 pr-4 rounded-md text-gray-400 hover:bg-primary/100 duration-200 hover:text-black hover:font-semibold mt-1"
 									>
 										<span className="rounded-lg absolute inset-y-0 left-0 flex items-center pl-3 pr-4">
-											<FontAwesomeIcon icon={faPlus} className="ml-1" />
+											<FontAwesomeIcon
+												icon={faPlus}
+												className="ml-1"
+											/>
 										</span>
 										<div className="text-sm ml-1">
 											Invite Members
@@ -243,43 +255,45 @@ export default function Navbar({ onButtonPressed }) {
 									</div>
 								</button>
 							</div>
-							{orgs?.length > 1 && <div className="px-1 pt-1">
-								<div className="text-gray-400 self-start ml-2 mt-2 text-xs font-semibold tracking-wide">
-									OTHER ORGANIZATIONS
-								</div>
-								<div className="flex flex-col items-start px-1 mt-3 mb-2">
-									{orgs
-										.filter(
-											(org) =>
-												org._id !=
-												localStorage.getItem(
-													"orgData.id"
-												)
-										)
-										.map((org) => (
-											<div
-												key={guidGenerator()}
-												onClick={() => {
-													localStorage.setItem(
-														"orgData.id",
-														org._id
-													);
-													router.reload();
-												}}
-												className="flex flex-row justify-start items-center hover:bg-white/5 w-full p-1.5 cursor-pointer rounded-md"
-											>
-												<div className="bg-white/10 h-7 w-8 rounded-md flex items-center justify-center text-gray-300">
-													{org.name.charAt(0)}
+							{orgs?.length > 1 && (
+								<div className="px-1 pt-1">
+									<div className="text-gray-400 self-start ml-2 mt-2 text-xs font-semibold tracking-wide">
+										OTHER ORGANIZATIONS
+									</div>
+									<div className="flex flex-col items-start px-1 mt-3 mb-2">
+										{orgs
+											.filter(
+												(org) =>
+													org._id !=
+													localStorage.getItem(
+														"orgData.id"
+													)
+											)
+											.map((org) => (
+												<div
+													key={guidGenerator()}
+													onClick={() => {
+														localStorage.setItem(
+															"orgData.id",
+															org._id
+														);
+														router.reload();
+													}}
+													className="flex flex-row justify-start items-center hover:bg-white/5 w-full p-1.5 cursor-pointer rounded-md"
+												>
+													<div className="bg-white/10 h-7 w-8 rounded-md flex items-center justify-center text-gray-300">
+														{org.name.charAt(0)}
+													</div>
+													<div className="flex items-center justify-between w-full">
+														<p className="text-gray-300 px-2 text-sm">
+															{org.name}
+														</p>
+													</div>
 												</div>
-												<div className="flex items-center justify-between w-full">
-													<p className="text-gray-300 px-2 text-sm">
-														{org.name}
-													</p>
-												</div>
-											</div>
-										))}
+											))}
+									</div>
 								</div>
-							</div>}
+							)}
 							<div className="px-1 py-1">
 								<Menu.Item>
 									{({ active }) => (

frontend/components/navigation/NavHeader.js

@@ -1,47 +1,57 @@
 import React, { useEffect, useState } from "react";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { faAngleRight, faQuestionCircle } from "@fortawesome/free-solid-svg-icons";
-import { faCcMastercard, faCcVisa } from "@fortawesome/free-brands-svg-icons";
-import { faCircle } from "@fortawesome/free-solid-svg-icons";
-import getOrganization from "../../pages/api/organization/GetOrg";
-import getWorkspaceInfo from "../../pages/api/workspace/getWorkspaceInfo";
 import { useRouter } from "next/router";
+import { faCcMastercard, faCcVisa } from "@fortawesome/free-brands-svg-icons";
+import {
+	faAngleRight,
+	faQuestionCircle,
+} from "@fortawesome/free-solid-svg-icons";
+import { faCircle } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 
-export default function NavHeader({ pageName, isProjectRelated}) {
-    const [orgName, setOrgName] = useState("");
-    const [workspaceName, setWorkspaceName] = useState("");
-    const router = useRouter();
+import getOrganization from "~/pages/api/organization/GetOrg";
+import getWorkspaceInfo from "~/pages/api/workspace/getWorkspaceInfo";
 
-    useEffect(async () => {
-		let org = await getOrganization({
-			orgId: localStorage.getItem("orgData.id"),
-		});
-		setOrgName(org.name);
-		let workspace = await getWorkspaceInfo({
-			workspaceId: router.query.id,
-		});
-		setWorkspaceName(workspace.name);
-    }, []);
+export default function NavHeader({ pageName, isProjectRelated }) {
+	const [orgName, setOrgName] = useState("");
+	const [workspaceName, setWorkspaceName] = useState("");
+	const router = useRouter();
+
+	useEffect(() => {
+		(async () => {
+			let org = await getOrganization({
+				orgId: localStorage.getItem("orgData.id"),
+			});
+			setOrgName(org.name);
+			let workspace = await getWorkspaceInfo({
+				workspaceId: router.query.id,
+			});
+			setWorkspaceName(workspace.name);
+		})();
+		// eslint-disable-next-line react-hooks/exhaustive-deps
+	}, []);
 
 	return (
-        <div className="pt-20 ml-6 flex flex-row items-center">
-            <div className="bg-primary-900 h-6 w-6 rounded-md flex items-center justify-center text-mineshaft-100 mr-2">
-                {orgName?.charAt(0)}
-            </div>
-            <div className="text-primary text-sm font-semibold">
-                {orgName}
-            </div>
-            {isProjectRelated && <>
-                <FontAwesomeIcon icon={faAngleRight} className="ml-3 text-sm text-gray-400 mr-3" />
-                <div className="font-semibold text-primary text-sm">
-                    {workspaceName}
-                </div>
-            </>
-            }
-            <FontAwesomeIcon icon={faAngleRight} className="ml-3 text-sm text-gray-400 mr-3" />
-            <div className="text-gray-400 text-sm">
-                {pageName}
-            </div>
-        </div>
+		<div className="pt-20 ml-6 flex flex-row items-center">
+			<div className="bg-primary-900 h-6 w-6 rounded-md flex items-center justify-center text-mineshaft-100 mr-2">
+				{orgName?.charAt(0)}
+			</div>
+			<div className="text-primary text-sm font-semibold">{orgName}</div>
+			{isProjectRelated && (
+				<>
+					<FontAwesomeIcon
+						icon={faAngleRight}
+						className="ml-3 text-sm text-gray-400 mr-3"
+					/>
+					<div className="font-semibold text-primary text-sm">
+						{workspaceName}
+					</div>
+				</>
+			)}
+			<FontAwesomeIcon
+				icon={faAngleRight}
+				className="ml-3 text-sm text-gray-400 mr-3"
+			/>
+			<div className="text-gray-400 text-sm">{pageName}</div>
+		</div>
 	);
 }

frontend/components/utilities/SecurityClient.js

@@ -1,29 +1,28 @@
-import token from "../../pages/api/auth/Token"
-import { PATH } from '../../const';
+import token from "~/pages/api/auth/Token";
+
+import { PATH } from "../../const";
 
 export default class SecurityClient {
-    static authOrigins = [PATH]
-    static #token = '';
+	static authOrigins = [PATH];
+	static #token = "";
 
-    contructor() {
+	contructor() {}
 
-    }
+	static setToken(token) {
+		this.#token = token;
+	}
 
-    static setToken(token) {
-        this.#token = token;
-    }
+	static async fetchCall(resource, options) {
+		let req = new Request(resource, options);
+		const destOrigin = new URL(req.url).origin;
 
-    static async fetchCall(resource, options) {
-        let req = new Request(resource, options);
-        const destOrigin = new URL(req.url).origin;
+		if (this.#token == "") {
+			this.setToken(await token());
+		}
 
-        if (this.#token == "") {
-            this.setToken(await token())
-        }
-
-        if (this.#token && this.authOrigins.includes(destOrigin)) {
-            req.headers.set('Authorization', "Bearer " + this.#token);
-            return fetch(req);
-        } 
-    }
-}
+		if (this.#token && this.authOrigins.includes(destOrigin)) {
+			req.headers.set("Authorization", "Bearer " + this.#token);
+			return fetch(req);
+		}
+	}
+}

frontend/components/utilities/attemptLogin.js

@@ -1,10 +1,12 @@
-import login1 from "../../pages/api/auth/Login1";
-import login2 from "../../pages/api/auth/Login2";
-import Aes256Gcm from "../../components/aes-256-gcm";
-import pushKeys from "./pushKeys";
+import Aes256Gcm from "~/components/utilities/cryptography/aes-256-gcm";
+import login1 from "~/pages/api/auth/Login1";
+import login2 from "~/pages/api/auth/Login2";
+import getOrganizations from "~/pages/api/organization/getOrgs";
+import getOrganizationUserProjects from "~/pages/api/organization/GetOrgUserProjects";
+
 import { initPostHog } from "../analytics/posthog";
-import getOrganizations from "../../pages/api/organization/getOrgs";
-import getOrganizationUserProjects from "../../pages/api/organization/GetOrgUserProjects";
+import { ENV } from "./config";
+import pushKeys from "./secrets/pushKeys";
 import SecurityClient from "./SecurityClient";
 
 const nacl = require("tweetnacl");
@@ -76,7 +78,14 @@ const attemptLogin = async (
 							encryptedPrivateKey,
 							iv,
 							tag,
-							password.slice(0, 32).padStart(32 + (password.slice(0, 32).length - new Blob([password]).size), "0")
+							password
+								.slice(0, 32)
+								.padStart(
+									32 +
+										(password.slice(0, 32).length -
+											new Blob([password]).size),
+									"0"
+								)
 						);
 
 						try {
@@ -100,10 +109,14 @@ const attemptLogin = async (
 					}
 
 					const userOrgs = await getOrganizations();
-					const userOrgsData = userOrgs.map(org => org._id);
-					
+					const userOrgsData = userOrgs.map((org) => org._id);
+
 					let orgToLogin;
-					if (userOrgsData.includes(localStorage.getItem("orgData.id"))) {
+					if (
+						userOrgsData.includes(
+							localStorage.getItem("orgData.id")
+						)
+					) {
 						orgToLogin = localStorage.getItem("orgData.id");
 					} else {
 						orgToLogin = userOrgsData[0];
@@ -113,17 +126,29 @@ const attemptLogin = async (
 					let orgUserProjects = await getOrganizationUserProjects({
 						orgId: orgToLogin,
 					});
-					
-					orgUserProjects = orgUserProjects?.map(project => project._id);
+
+					orgUserProjects = orgUserProjects?.map(
+						(project) => project._id
+					);
 					let projectToLogin;
-					if (orgUserProjects.includes(localStorage.getItem("projectData.id"))) {
+					if (
+						orgUserProjects.includes(
+							localStorage.getItem("projectData.id")
+						)
+					) {
 						projectToLogin = localStorage.getItem("projectData.id");
 					} else {
 						try {
 							projectToLogin = orgUserProjects[0];
-							localStorage.setItem("projectData.id", projectToLogin);
+							localStorage.setItem(
+								"projectData.id",
+								projectToLogin
+							);
 						} catch (error) {
-							console.log("ERROR: User likely has no projects. ", error)
+							console.log(
+								"ERROR: User likely has no projects. ",
+								error
+							);
 						}
 					}
 
@@ -154,7 +179,7 @@ const attemptLogin = async (
 					}
 					try {
 						if (email) {
-							if (process.env.NEXT_PUBLIC_ENV == "production") {
+							if (ENV == "production") {
 								const posthog = initPostHog();
 								posthog.identify(email);
 								posthog.capture("User Logged In");

frontend/components/utilities/changePassword.js

@@ -1,109 +0,0 @@
-import Aes256Gcm from "../aes-256-gcm";
-import SRP1 from "../../pages/api/auth/SRP1";
-import changePassword2 from "../../pages/api/auth/ChangePassword2";
-
-const nacl = require("tweetnacl");
-nacl.util = require("tweetnacl-util");
-const jsrp = require("jsrp");
-const clientOldPassword = new jsrp.client();
-const clientNewPassword = new jsrp.client();
-
-/**
- * This function loggs in the user (whether it's right after signup, or a normal login)
- * @param {*} email
- * @param {*} password
- * @param {*} setErrorLogin
- * @param {*} router
- * @param {*} isSignUp
- * @returns
- */
-const changePassword = async (
-	email,
-	currentPassword,
-	newPassword,
-	setCurrentPasswordError,
-	setPasswordChanged,
-	setCurrentPassword,
-	setNewPassword
-) => {
-	try {
-		setPasswordChanged(false);
-		setCurrentPasswordError(false);
-
-		clientOldPassword.init(
-			{
-				username: email,
-				password: currentPassword,
-			},
-			async () => {
-				const clientPublicKey = clientOldPassword.getPublicKey();
-
-				let serverPublicKey, salt;
-				try {
-					const res = await SRP1({
-						clientPublicKey: clientPublicKey
-					});
-					serverPublicKey = res.serverPublicKey;
-					salt = res.salt;
-				} catch (err) {
-					setCurrentPasswordError(true);
-					console.log("Wrong current password", err, 1);
-				}
-
-				clientOldPassword.setSalt(salt);
-				clientOldPassword.setServerPublicKey(serverPublicKey);
-				const clientProof = clientOldPassword.getProof(); // called M1
-
-				clientNewPassword.init({
-					username: email,
-					password: newPassword
-				}, async () => {
-					clientNewPassword.createVerifier(async (err, result) => {
-			
-						let { ciphertext, iv, tag } = Aes256Gcm.encrypt(
-							localStorage.getItem("PRIVATE_KEY"), 
-							newPassword.slice(0, 32).padStart(32 + (newPassword.slice(0, 32).length - new Blob([newPassword]).size), "0")
-						);
-
-						if (ciphertext) {
-							localStorage.setItem(
-								"encryptedPrivateKey",
-								ciphertext
-							);
-							localStorage.setItem("iv", iv);
-							localStorage.setItem("tag", tag);
-					
-							let res;
-							try {
-								res = await changePassword2({
-									encryptedPrivateKey: ciphertext,
-									iv,
-									tag,
-									salt: result.salt,
-									verifier: result.verifier,
-									clientProof
-								});
-								if (res.status == 400) {
-									setCurrentPasswordError(true);
-								} else if (res.status == 200) {
-									setPasswordChanged(true);
-									setCurrentPassword("");
-									setNewPassword("");
-								}
-							} catch (err) {
-								setCurrentPasswordError(true)
-								console.log(err);
-							}
-						}
-					});
-				});
-				
-			}
-		);
-	} catch (error) {
-		console.log("Something went wrong during changing the password", slat, serverPublicKey);
-	}
-	return true;
-};
-
-export default changePassword;

frontend/components/utilities/config/index.ts

@@ -0,0 +1,15 @@
+const ENV = process.env.NEXT_PUBLIC_ENV! || 'development'; // investigate
+const POSTHOG_API_KEY = process.env.NEXT_PUBLIC_POSTHOG_API_KEY!;
+const POSTHOG_HOST = process.env.NEXT_PUBLIC_POSTHOG_HOST! || 'https://app.posthog.com';
+const STRIPE_PRODUCT_PRO = process.env.NEXT_PUBLIC_STRIPE_PRODUCT_PRO!;
+const STRIPE_PRODUCT_STARTER = process.env.NEXT_PUBLIC_STRIPE_PRODUCT_STARTER!;
+const TELEMETRY_ENABLED = (process.env.NEXT_PUBLIC_TELEMETRY_ENABLED! !== 'false');
+
+export {
+    ENV,
+    POSTHOG_API_KEY,
+    POSTHOG_HOST,
+    STRIPE_PRODUCT_PRO,
+    STRIPE_PRODUCT_STARTER,
+    TELEMETRY_ENABLED
+};

frontend/components/utilities/cryptography/changePassword.js

@@ -0,0 +1,127 @@
+import changePassword2 from "~/pages/api/auth/ChangePassword2";
+import SRP1 from "~/pages/api/auth/SRP1";
+
+import Aes256Gcm from "./aes-256-gcm";
+
+const nacl = require("tweetnacl");
+nacl.util = require("tweetnacl-util");
+const jsrp = require("jsrp");
+const clientOldPassword = new jsrp.client();
+const clientNewPassword = new jsrp.client();
+
+/**
+ * This function loggs in the user (whether it's right after signup, or a normal login)
+ * @param {*} email
+ * @param {*} password
+ * @param {*} setErrorLogin
+ * @param {*} router
+ * @param {*} isSignUp
+ * @returns
+ */
+const changePassword = async (
+	email,
+	currentPassword,
+	newPassword,
+	setCurrentPasswordError,
+	setPasswordChanged,
+	setCurrentPassword,
+	setNewPassword
+) => {
+	try {
+		setPasswordChanged(false);
+		setCurrentPasswordError(false);
+
+		clientOldPassword.init(
+			{
+				username: email,
+				password: currentPassword,
+			},
+			async () => {
+				const clientPublicKey = clientOldPassword.getPublicKey();
+
+				let serverPublicKey, salt;
+				try {
+					const res = await SRP1({
+						clientPublicKey: clientPublicKey,
+					});
+					serverPublicKey = res.serverPublicKey;
+					salt = res.salt;
+				} catch (err) {
+					setCurrentPasswordError(true);
+					console.log("Wrong current password", err, 1);
+				}
+
+				clientOldPassword.setSalt(salt);
+				clientOldPassword.setServerPublicKey(serverPublicKey);
+				const clientProof = clientOldPassword.getProof(); // called M1
+
+				clientNewPassword.init(
+					{
+						username: email,
+						password: newPassword,
+					},
+					async () => {
+						clientNewPassword.createVerifier(
+							async (err, result) => {
+								// The Blob part here is needed to account for symbols that count as 2+ bytes (e.g., é, å, ø)
+								let { ciphertext, iv, tag } = Aes256Gcm.encrypt(
+									localStorage.getItem("PRIVATE_KEY"),
+									newPassword
+										.slice(0, 32)
+										.padStart(
+											32 +
+												(newPassword.slice(0, 32)
+													.length -
+													new Blob([newPassword])
+														.size),
+											"0"
+										)
+								);
+
+								if (ciphertext) {
+									localStorage.setItem(
+										"encryptedPrivateKey",
+										ciphertext
+									);
+									localStorage.setItem("iv", iv);
+									localStorage.setItem("tag", tag);
+
+									let res;
+									try {
+										res = await changePassword2({
+											encryptedPrivateKey: ciphertext,
+											iv,
+											tag,
+											salt: result.salt,
+											verifier: result.verifier,
+											clientProof,
+										});
+										if (res.status == 400) {
+											setCurrentPasswordError(true);
+										} else if (res.status == 200) {
+											setPasswordChanged(true);
+											setCurrentPassword("");
+											setNewPassword("");
+										}
+									} catch (err) {
+										setCurrentPasswordError(true);
+										console.log(err);
+									}
+								}
+							}
+						);
+					}
+				);
+			}
+		);
+	} catch (error) {
+		console.log(
+			"Something went wrong during changing the password",
+			slat,
+			serverPublicKey
+		);
+	}
+	return true;
+};
+
+export default changePassword;

frontend/components/utilities/cryptography/crypto.js

@@ -1,6 +1,6 @@
 const nacl = require("tweetnacl");
 nacl.util = require("tweetnacl-util");
-const aes = require("../aes-256-gcm");
+const aes = require("./aes-256-gcm");
 
 /**
  * Return assymmetrically encrypted [plaintext] using [publicKey] where

frontend/components/utilities/cryptography/issueBackupKey.js

@@ -1,7 +1,8 @@
-import Aes256Gcm from "../aes-256-gcm";
-import SRP1 from "../../pages/api/auth/SRP1";
-import issueBackupPrivateKey from "../../pages/api/auth/IssueBackupPrivateKey";
-import generateBackupPDF from "./generateBackupPDF";
+import issueBackupPrivateKey from "~/pages/api/auth/IssueBackupPrivateKey";
+import SRP1 from "~/pages/api/auth/SRP1";
+
+import Aes256Gcm from "./aes-256-gcm";
+import generateBackupPDF from "../generateBackupPDF";
 
 const nacl = require("tweetnacl");
 nacl.util = require("tweetnacl-util");
@@ -24,7 +25,7 @@ const issueBackupKey = async ({
 	password,
 	personalName,
 	setBackupKeyError,
-	setBackupKeyIssued
+	setBackupKeyIssued,
 }) => {
 	try {
 		setBackupKeyError(false);
@@ -40,7 +41,7 @@ const issueBackupKey = async ({
 				let serverPublicKey, salt;
 				try {
 					const res = await SRP1({
-						clientPublicKey: clientPublicKey
+						clientPublicKey: clientPublicKey,
 					});
 					serverPublicKey = res.serverPublicKey;
 					salt = res.salt;
@@ -55,35 +56,40 @@ const issueBackupKey = async ({
 
 				const generatedKey = crypto.randomBytes(16).toString("hex");
 
-				clientKey.init({
-					username: email,
-					password: generatedKey
-				}, async () => {
-					clientKey.createVerifier(async (err, result) => {
+				clientKey.init(
+					{
+						username: email,
+						password: generatedKey,
+					},
+					async () => {
+						clientKey.createVerifier(async (err, result) => {
+							let { ciphertext, iv, tag } = Aes256Gcm.encrypt(
+								localStorage.getItem("PRIVATE_KEY"),
+								generatedKey
+							);
 
+							const res = await issueBackupPrivateKey({
+								encryptedPrivateKey: ciphertext,
+								iv,
+								tag,
+								salt: result.salt,
+								verifier: result.verifier,
+								clientProof,
+							});
 
-						let { ciphertext, iv, tag } = Aes256Gcm.encrypt(
-							localStorage.getItem("PRIVATE_KEY"), 
-							generatedKey
-						);
-
-						const res = await issueBackupPrivateKey({
-							encryptedPrivateKey: ciphertext,
-							iv,
-							tag,
-							salt: result.salt,
-							verifier: result.verifier,
-							clientProof
+							if (res.status == 400) {
+								setBackupKeyError(true);
+							} else if (res.status == 200) {
+								generateBackupPDF(
+									personalName,
+									email,
+									generatedKey
+								);
+								setBackupKeyIssued(true);
+							}
 						});
-
-						if (res.status == 400) {
-							setBackupKeyError(true);
-						} else if (res.status == 200) {
-							generateBackupPDF(personalName, email, generatedKey);
-							setBackupKeyIssued(true);
-						}
-					});
-				})
+					}
+				);
 			}
 		);
 	} catch (error) {

frontend/components/utilities/generateBackupPDF.js

@@ -111,7 +111,7 @@ function generateBackupPDF(personalName, personalEmail, generatedKey) {
 	doc.text(
 		180,
 		420,
-		"https://infisical.com/login"
+		"https://app.infisical.com/login"
 	);
 	doc.text(
 		180,

frontend/components/utilities/secrets/getSecretsForProject.js

@@ -1,11 +1,11 @@
-import getSecrets from "../../pages/api/files/GetSecrets";
-import guidGenerator from "./randomId";
+import getSecrets from "~/pages/api/files/GetSecrets";
 
+import guidGenerator from "../randomId";
 
 const {
 	decryptAssymmetric,
 	decryptSymmetric,
-} = require("../../components/utilities/crypto");
+} = require("../cryptography/crypto");
 const nacl = require("tweetnacl");
 nacl.util = require("tweetnacl-util");
 
@@ -21,15 +21,12 @@ const getSecretsForProject = async ({
 	setFileState,
 	setIsKeyAvailable,
 	setData,
-	workspaceId
+	workspaceId,
 }) => {
 	try {
 		let file;
 		try {
-			file = await getSecrets(
-				workspaceId,
-				envMapping[env]
-			);
+			file = await getSecrets(workspaceId, envMapping[env]);
 
 			setFileState(file);
 		} catch (error) {
@@ -98,7 +95,9 @@ const getSecretsForProject = async ({
 			line["type"],
 		]);
 	} catch (error) {
-		console.log("Something went wrong during accessing or decripting secrets.");
+		console.log(
+			"Something went wrong during accessing or decripting secrets."
+		);
 	}
 	return true;
 };

frontend/components/utilities/secrets/pushKeys.js

@@ -1,6 +1,6 @@
-import getLatestFileKey from "../../pages/api/workspace/getLatestFileKey";
-import getWorkspaceKeys from "../../pages/api/workspace/getWorkspaceKeys";
-import uploadSecrets from "../../pages/api/files/UploadSecrets";
+import uploadSecrets from "~/pages/api/files/UploadSecrets";
+import getLatestFileKey from "~/pages/api/workspace/getLatestFileKey";
+import getWorkspaceKeys from "~/pages/api/workspace/getWorkspaceKeys";
 
 const crypto = require("crypto");
 const {
@@ -8,7 +8,7 @@ const {
 	decryptSymmetric,
 	encryptSymmetric,
 	encryptAssymmetric,
-} = require("../../components/utilities/crypto");
+} = require("../cryptography/crypto");
 const nacl = require("tweetnacl");
 nacl.util = require("tweetnacl-util");
 

frontend/components/utilities/secrets/pushKeysIntegration.js

@@ -1,11 +1,8 @@
-import publicKeyInfical from "../../pages/api/auth/publicKeyInfisical"
-import changeHerokuConfigVars from "../../pages/api/integrations/ChangeHerokuConfigVars";
+import publicKeyInfical from "~/pages/api/auth/publicKeyInfisical";
+import changeHerokuConfigVars from "~/pages/api/integrations/ChangeHerokuConfigVars";
 
 const crypto = require("crypto");
-const {
-	encryptSymmetric,
-	encryptAssymmetric,
-} = require("./crypto");
+const { encryptSymmetric, encryptAssymmetric } = require("../cryptography/crypto");
 const nacl = require("tweetnacl");
 nacl.util = require("tweetnacl-util");
 
@@ -71,7 +68,7 @@ const pushKeysIntegration = async ({ obj, integrationId }) => {
 		nonce,
 	};
 
-	changeHerokuConfigVars({integrationId, key, secrets})
+	changeHerokuConfigVars({ integrationId, key, secrets });
 };
 
 export default pushKeysIntegration;