From 7aa5ef844cdb1207204c3df86fd1ecbcb567da0b Mon Sep 17 00:00:00 2001
From: Parth Patel <parthvnp@gmail.com>
Date: Mon, 8 May 2023 01:04:35 -0400
Subject: [PATCH 1/4] Update CLI usage docs to showcase the ability to inject
 environment variables in shell aliases

---
 docs/cli/usage.mdx | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/docs/cli/usage.mdx b/docs/cli/usage.mdx
index 0e8c5fce9..b566e2c0b 100644
--- a/docs/cli/usage.mdx
+++ b/docs/cli/usage.mdx
@@ -39,6 +39,22 @@ infisical init
 infisical run -- [your application start command]
 ```
 
+## Injecting environment variables in custom aliases
+Custom aliases can utilize secrets from Infisical. Suppose there is a custom alias `yd` in `custom.sh` that runs `yarn dev` and needs the secrets provided by Infisical.
+```bash
+#!/bin/sh
+
+yd() {
+  yarn dev
+}
+```
+
+To make the secrets available from Infisical to `yd`, you can run the following command:
+
+```bash
+infisical run --command="source custom.sh && yd"
+```
+
 View all available options for `run` command [here](./commands/run)
 
 ## Examples:

From 174e22a2bcda742c15f6aa26808077bb731de07e Mon Sep 17 00:00:00 2001
From: Maidul Islam <maidul98@gmail.com>
Date: Sat, 13 May 2023 11:17:17 -0400
Subject: [PATCH 2/4] put aliases docs in Accordion

---
 docs/cli/usage.mdx | 28 +++++++++++++++-------------
 1 file changed, 15 insertions(+), 13 deletions(-)

diff --git a/docs/cli/usage.mdx b/docs/cli/usage.mdx
index b566e2c0b..922c0f2d8 100644
--- a/docs/cli/usage.mdx
+++ b/docs/cli/usage.mdx
@@ -39,23 +39,25 @@ infisical init
 infisical run -- [your application start command]
 ```
 
-## Injecting environment variables in custom aliases
-Custom aliases can utilize secrets from Infisical. Suppose there is a custom alias `yd` in `custom.sh` that runs `yarn dev` and needs the secrets provided by Infisical.
-```bash
-#!/bin/sh
+<Accordion title="Injecting environment variables in custom aliases">
+  Custom aliases can utilize secrets from Infisical. Suppose there is a custom alias `yd` in `custom.sh` that runs `yarn dev` and needs the secrets provided by Infisical.
+  ```bash
+  #!/bin/sh
 
-yd() {
-  yarn dev
-}
-```
+  yd() {
+    yarn dev
+  }
+  ```
 
-To make the secrets available from Infisical to `yd`, you can run the following command:
+  To make the secrets available from Infisical to `yd`, you can run the following command:
 
-```bash
-infisical run --command="source custom.sh && yd"
-```
+  ```bash
+  infisical run --command="source custom.sh && yd"
+  ```
+
+  View all available options for `run` command [here](./commands/run)
+</Accordion>
 
-View all available options for `run` command [here](./commands/run)
 
 ## Examples:
 

From 6d70dc437ee2cf9be496359b07a7ef68079ab598 Mon Sep 17 00:00:00 2001
From: Maidul Islam <maidul98@gmail.com>
Date: Sat, 13 May 2023 11:22:38 -0400
Subject: [PATCH 3/4] update cli usage docs

---
 docs/cli/usage.mdx | 13 +++++++------
 1 file changed, 7 insertions(+), 6 deletions(-)

diff --git a/docs/cli/usage.mdx b/docs/cli/usage.mdx
index 922c0f2d8..f6e06c966 100644
--- a/docs/cli/usage.mdx
+++ b/docs/cli/usage.mdx
@@ -34,10 +34,12 @@ infisical init
 
 ## Inject environment variables
 
-```bash
-# inject environment variables into app
-infisical run -- [your application start command]
-```
+<Accordion title="Injecting environment variables directly" defaultOpen="true">
+  ```bash
+  # inject environment variables into app
+  infisical run -- [your application start command]
+  ```
+</Accordion>
 
 <Accordion title="Injecting environment variables in custom aliases">
   Custom aliases can utilize secrets from Infisical. Suppose there is a custom alias `yd` in `custom.sh` that runs `yarn dev` and needs the secrets provided by Infisical.
@@ -54,10 +56,9 @@ infisical run -- [your application start command]
   ```bash
   infisical run --command="source custom.sh && yd"
   ```
-
-  View all available options for `run` command [here](./commands/run)
 </Accordion>
 
+View all available options for `run` command [here](./commands/run)
 
 ## Examples:
 

From abbf1918dc791d6b5dd685b5c287a91435243324 Mon Sep 17 00:00:00 2001
From: Vladyslav Matsiiako <matsiiako@gmail.com>
Date: Sun, 14 May 2023 18:25:27 -0700
Subject: [PATCH 4/4] Added limits to the number of projects in an org

---
 frontend/public/locales/en/translations.json  |  4 +--
 frontend/src/components/billing/Plan.tsx      | 10 +++---
 frontend/src/components/v2/Button/Button.tsx  |  8 ++---
 .../v2/UpgradePlanModal/UpgradePlanModal.tsx  |  6 ++--
 frontend/src/layouts/AppLayout/AppLayout.tsx  | 34 ++++++++++++++++---
 frontend/src/pages/settings/billing/[id].tsx  |  4 +--
 .../ProjectIndexSecretsSection.tsx            |  2 +-
 7 files changed, 46 insertions(+), 22 deletions(-)

diff --git a/frontend/public/locales/en/translations.json b/frontend/public/locales/en/translations.json
index 63ccdb2fe..cb43bc1d4 100644
--- a/frontend/public/locales/en/translations.json
+++ b/frontend/public/locales/en/translations.json
@@ -17,8 +17,8 @@
     "starter": {
       "name": "Starter",
       "price-explanation": "up to 5 team members",
-      "text": "Manage any project with 5 members for free!",
-      "subtext": "$5 per member/month afterwards."
+      "text": "Manage up to 3 project with up to 5 team members for free!",
+      "subtext": ""
     },
     "professional": {
       "name": "Professional",
diff --git a/frontend/src/components/billing/Plan.tsx b/frontend/src/components/billing/Plan.tsx
index 692157923..2e8a47d2c 100644
--- a/frontend/src/components/billing/Plan.tsx
+++ b/frontend/src/components/billing/Plan.tsx
@@ -20,8 +20,8 @@ interface Props {
 export default function Plan({ plan }: Props) {
   return (
     <div
-      className={`relative flex flex-col justify-between border-2 min-w-fit w-96 rounded-lg h-68 mr-4 bg-mineshaft-800 ${
-        plan.name !== 'Starter' && plan.current === true ? 'border-primary' : 'border-chicago-700'
+      className={`relative flex flex-col justify-between border min-w-fit w-96 rounded-lg h-68 mr-4 bg-mineshaft-800 ${
+        plan.name !== 'Starter' && plan.current === true ? 'border-2 border-primary' : 'border-mineshaft-600'
       }
 			`}
     >
@@ -41,13 +41,13 @@ export default function Plan({ plan }: Props) {
           <>
             {plan.buttonTextMain === 'Schedule a Demo' ? (
               <a href="/scheduledemo" target='_blank rel="noopener"'>
-                <div className="relative z-10 mx-5 mt-3 mb-4 py-2 px-4 border border-1 border-gray-600 hover:text-black hover:border-primary text-gray-400 font-semibold hover:bg-primary bg-bunker duration-200 cursor-pointer rounded-md flex w-max">
+                <div className="relative z-10 mx-5 mt-3 mb-4 py-2 px-4 border border-1 border-mineshaft-600 hover:text-black hover:border-primary text-gray-400 font-semibold hover:bg-primary bg-bunker duration-200 cursor-pointer rounded-md flex w-max">
                   {plan.buttonTextMain}
                 </div>
               </a>
             ) : (
               <div
-                className={`relative z-10 mx-5 mt-3 mb-4 py-2 px-4 border border-1 border-gray-600 text-gray-400 font-semibold ${
+                className={`relative z-10 mx-5 mt-3 mb-4 py-2 px-4 border border-1 border-mineshaft-600 text-gray-400 font-semibold ${
                   plan.buttonTextMain === 'Downgrade'
                     ? 'hover:bg-red hover:text-white hover:border-red'
                     : 'hover:bg-primary hover:text-black hover:border-primary'
@@ -74,7 +74,7 @@ export default function Plan({ plan }: Props) {
         ) : (
           <div
             className={`h-8 w-full rounded-b-md flex justify-center items-center z-10 ${
-              plan.name !== 'Starter' && plan.current === true ? 'bg-primary' : 'bg-chicago-700'
+              plan.name !== 'Starter' && plan.current === true ? 'bg-primary' : 'bg-mineshaft-400'
             }`}
           >
             <p className="text-xs text-black font-semibold">CURRENT PLAN</p>
diff --git a/frontend/src/components/v2/Button/Button.tsx b/frontend/src/components/v2/Button/Button.tsx
index 5edbbef4c..9635227bd 100644
--- a/frontend/src/components/v2/Button/Button.tsx
+++ b/frontend/src/components/v2/Button/Button.tsx
@@ -16,7 +16,7 @@ const buttonVariants = cva(
     'button',
     'transition-all',
     'font-inter font-medium',
-    'cursor-pointer',
+    'cursor-default',
     'inline-flex items-center justify-center',
     'relative',
     'whitespace-nowrap'
@@ -24,7 +24,7 @@ const buttonVariants = cva(
   {
     variants: {
       colorSchema: {
-        primary: ['bg-primary', 'text-black', 'border-primary bg-opacity-80 hover:bg-opacity-100'],
+        primary: ['bg-primary', 'text-black', 'border-primary bg-opacity-90 hover:bg-opacity-100'],
         secondary: ['bg-mineshaft', 'text-gray-300', 'border-mineshaft hover:bg-opacity-80'],
         danger: ['bg-red', 'text-white', 'border-red hover:bg-opacity-90'],
         gray: ['bg-bunker-500', 'text-bunker-200']
@@ -40,7 +40,7 @@ const buttonVariants = cva(
       },
       isDisabled: {
         true: 'bg-mineshaft-700 border border-mineshaft-600 text-white opacity-50 cursor-not-allowed',
-        false: 'border border-primary-400'
+        false: 'border'
       },
       isFullWidth: {
         true: 'w-full',
@@ -111,7 +111,7 @@ const buttonVariants = cva(
       {
         colorSchema: 'secondary',
         variant: 'plain',
-        className: 'text-mineshaft-300'
+        className: 'text-mineshaft-300 hover:text-mineshaft-200 border-none'
       },
       {
         colorSchema: 'danger',
diff --git a/frontend/src/components/v2/UpgradePlanModal/UpgradePlanModal.tsx b/frontend/src/components/v2/UpgradePlanModal/UpgradePlanModal.tsx
index e991ca3a8..694d6d628 100644
--- a/frontend/src/components/v2/UpgradePlanModal/UpgradePlanModal.tsx
+++ b/frontend/src/components/v2/UpgradePlanModal/UpgradePlanModal.tsx
@@ -18,7 +18,7 @@ export const UpgradePlanModal = ({ text, isOpen, onOpenChange }: Props): JSX.Ele
           href={`/settings/billing/${localStorage.getItem('projectData.id') as string}`}
           key="upgrade-plan"
         >
-          <Button className="mr-4">Upgrade Plan</Button>
+          <Button className="mr-4 ml-2">Upgrade Plan</Button>
         </Link>,
         <ModalClose asChild key="upgrade-plan-cancel">
           <Button colorSchema="secondary" variant="plain">
@@ -27,8 +27,8 @@ export const UpgradePlanModal = ({ text, isOpen, onOpenChange }: Props): JSX.Ele
         </ModalClose>
       ]}
     >
-      <p className="mb-4 text-bunker-300">{text}</p>
-      <p className="font-medium text-bunker-300">
+      <p className="mb-2 text-bunker-300">{text}</p>
+      <p className="text-bunker-300">
         Upgrade and get access to this, as well as to other powerful enhancements.
       </p>
     </ModalContent>
diff --git a/frontend/src/layouts/AppLayout/AppLayout.tsx b/frontend/src/layouts/AppLayout/AppLayout.tsx
index 2ff25d5b1..d40276f5b 100644
--- a/frontend/src/layouts/AppLayout/AppLayout.tsx
+++ b/frontend/src/layouts/AppLayout/AppLayout.tsx
@@ -28,9 +28,11 @@ import {
   Modal,
   ModalContent,
   Select,
-  SelectItem
+  SelectItem,
+  UpgradePlanModal
 } from '@app/components/v2';
-import { useOrganization, useUser, useWorkspace } from '@app/context';
+import { plans } from '@app/const';
+import { useOrganization, useSubscription, useUser, useWorkspace } from '@app/context';
 import { usePopUp } from '@app/hooks';
 import { fetchOrgUsers, useAddUserToWs, useCreateWorkspace, useUploadWsKey } from '@app/hooks/api';
 import getOrganizations from '@app/pages/api/organization/getOrgs';
@@ -57,13 +59,18 @@ export const AppLayout = ({ children }: LayoutProps) => {
   const { workspaces, currentWorkspace } = useWorkspace();
   const { currentOrg } = useOrganization();
   const { user } = useUser();
+  const { subscriptionPlan } = useSubscription();
+  const host = window.location.origin;
+  const isAddingProjectsAllowed =
+    subscriptionPlan !== plans.starter || (subscriptionPlan === plans.starter && workspaces.length < 3) || host !== 'https://app.infisical.com';
 
   const createWs = useCreateWorkspace();
   const uploadWsKey = useUploadWsKey();
   const addWsUser = useAddUserToWs();
 
   const { popUp, handlePopUpOpen, handlePopUpClose, handlePopUpToggle } = usePopUp([
-    'addNewWs'
+    'addNewWs',
+    'upgradePlan'
   ] as const);
   const {
     control,
@@ -274,7 +281,13 @@ export const AppLayout = ({ children }: LayoutProps) => {
                           colorSchema="primary"
                           variant="outline_bg"
                           size="sm"
-                          onClick={() => handlePopUpOpen('addNewWs')}
+                          onClick={() => {
+                            if (isAddingProjectsAllowed) {
+                              handlePopUpOpen('addNewWs')
+                            } else {
+                              handlePopUpOpen('upgradePlan');
+                            }
+                          }}
                           leftIcon={<FontAwesomeIcon icon={faPlus} />}
                         >
                           Add Project
@@ -288,7 +301,13 @@ export const AppLayout = ({ children }: LayoutProps) => {
                       className="w-full bg-mineshaft-500 py-2 text-bunker-200 hover:bg-primary/90 hover:text-black"
                       color="mineshaft"
                       size="sm"
-                      onClick={() => handlePopUpOpen('addNewWs')}
+                      onClick={() => {
+                        if (isAddingProjectsAllowed) {
+                          handlePopUpOpen('addNewWs')
+                        } else {
+                          handlePopUpOpen('upgradePlan');
+                        }
+                      }}
                       leftIcon={<FontAwesomeIcon icon={faPlus} />}
                     >
                       Add Project
@@ -464,6 +483,11 @@ export const AppLayout = ({ children }: LayoutProps) => {
               </form>
             </ModalContent>
           </Modal>
+          <UpgradePlanModal
+            isOpen={popUp.upgradePlan.isOpen}
+            onOpenChange={(isOpen) => handlePopUpToggle('upgradePlan', isOpen)}
+            text="You have exceeded the number of projects allowed on the free plan."
+          />
           <main className="flex-1 overflow-y-auto overflow-x-hidden bg-bunker-800 dark:[color-scheme:dark]">
             {children}
           </main>
diff --git a/frontend/src/pages/settings/billing/[id].tsx b/frontend/src/pages/settings/billing/[id].tsx
index e1e909790..6490dc6a3 100644
--- a/frontend/src/pages/settings/billing/[id].tsx
+++ b/frontend/src/pages/settings/billing/[id].tsx
@@ -1,10 +1,10 @@
 import { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import Head from 'next/head';
-import { plans as plansConstant } from 'public/data/frequentConstants';
 
 import Plan from '@app/components/billing/Plan';
 import NavHeader from '@app/components/navigation/NavHeader';
+import { plans as plansConstant } from '@app/const';
 
 import getOrganizationSubscriptions from '../../api/organization/GetOrgSubscription';
 import getOrganizationUsers from '../../api/organization/GetOrgUsers';
@@ -32,7 +32,7 @@ export default function SettingsBilling() {
       name: 'Team',
       price: '$8',
       priceExplanation: t('billing.professional.price-explanation')!,
-      text: 'For teams that want to improve their efficiency and security.',
+      text: 'Unlimited members, up to 10 projects. Additional developer experience features.',
       buttonTextMain: t('billing.upgrade')!,
       buttonTextSecondary: t('billing.learn-more')!,
       current: currentPlan === plansConstant.team
diff --git a/frontend/src/views/Settings/ProjectSettingsPage/components/ProjectIndexSecretsSection/ProjectIndexSecretsSection.tsx b/frontend/src/views/Settings/ProjectSettingsPage/components/ProjectIndexSecretsSection/ProjectIndexSecretsSection.tsx
index d1ca4f265..088ee792f 100644
--- a/frontend/src/views/Settings/ProjectSettingsPage/components/ProjectIndexSecretsSection/ProjectIndexSecretsSection.tsx
+++ b/frontend/src/views/Settings/ProjectSettingsPage/components/ProjectIndexSecretsSection/ProjectIndexSecretsSection.tsx
@@ -11,7 +11,7 @@ export const ProjectIndexSecretsSection = ({
     onEnableBlindIndices
 }: Props) => {
     return (
-        <div className="rounded-md bg-white/5 p-6">
+        <div className="rounded-md bg-white/5 p-6 my-2">
             <p className="mb-4 text-xl font-semibold">Blind Indices</p>
             <p className="mb-4 text-sm text-gray-400">
                 Your project, created before the introduction of blind indexing, contains unindexed secrets. To access individual secrets by name through the SDK and public API, please enable blind indexing.