chore: minor ui improvements

fix: use base url instead of hardcoded url
chore: improve placeholder component styles (#3638 )
2023-12-12 15:03:04 +05:30 · 2023-12-12 15:03:04 +05:30 · 2023-12-12 15:02:42 +05:30 · 2023-12-12 14:25:56 +05:30 · 2023-12-12 14:21:19 +05:30 · 2023-12-12 13:55:18 +05:30
883 changed files with 67365 additions and 24462 deletions
--- a/.devcontainer/devcontainer.json
+++ b/.devcontainer/devcontainer.json
@@ -5,5 +5,5 @@
  "features": {
    "ghcr.io/NicoVIII/devcontainer-features/pnpm:1": {}
  },
-  "postCreateCommand": "mv .env.example .env && pnpm i"
+  "postCreateCommand": "cp .env.example .env && pnpm i"
 }
--- a/.dockerignore
+++ b/.dockerignore
@@ -0,0 +1,2 @@
+node_modules
+**/*/node_modules
--- a/.env.example
+++ b/.env.example
@@ -12,7 +12,8 @@ SESSION_SECRET='add some secret here'

 # Hoppscotch App Domain Config
 REDIRECT_URL="http://localhost:3000"
-WHITELISTED_ORIGINS = "http://localhost:3170,http://localhost:3000,http://localhost:3100"
+WHITELISTED_ORIGINS="http://localhost:3170,http://localhost:3000,http://localhost:3100"
+VITE_ALLOWED_AUTH_PROVIDERS=GOOGLE,GITHUB,MICROSOFT,EMAIL

 # Google Auth Config
 GOOGLE_CLIENT_ID="************************************************"
@@ -31,6 +32,7 @@ MICROSOFT_CLIENT_ID="************************************************"
 MICROSOFT_CLIENT_SECRET="************************************************"
 MICROSOFT_CALLBACK_URL="http://localhost:3170/v1/auth/microsoft/callback"
 MICROSOFT_SCOPE="user.read"
+MICROSOFT_TENANT="common"

 # Mailer config
 MAILER_SMTP_URL="smtps://user@domain.com:pass@smtp.domain.com"
@@ -57,3 +59,6 @@ VITE_BACKEND_API_URL=http://localhost:3170/v1
 # Terms Of Service And Privacy Policy Links (Optional)
 VITE_APP_TOS_LINK=https://docs.hoppscotch.io/support/terms
 VITE_APP_PRIVACY_POLICY_LINK=https://docs.hoppscotch.io/support/privacy
+
+# Set to `true` for subpath based access
+ENABLE_SUBPATH_BASED_ACCESS=false
--- a/.github/workflows/release-push-docker.yml
+++ b/.github/workflows/release-push-docker.yml
@@ -0,0 +1,84 @@
+name: "Push containers to Docker Hub on release"
+
+on:
+  push:
+    tags:
+      - '*.*.*'
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Setup environment
+        run: cp .env.example .env
+
+      - name: Setup QEMU
+        uses: docker/setup-qemu-action@v3
+
+      - name: Setup Docker Buildx
+        uses: docker/setup-buildx-action@v3
+
+      - name: Log in to Docker Hub
+        uses: docker/login-action@v2
+        with:
+          username: ${{ secrets.DOCKER_USERNAME }}
+          password: ${{ secrets.DOCKER_PASSWORD }}
+
+      - name: Build and push the backend container
+        uses: docker/build-push-action@v4
+        with:
+          context: .
+          file: ./prod.Dockerfile
+          target: backend
+          push: true
+          platforms: |
+            linux/amd64
+            linux/arm64
+          tags: |
+            ${{ secrets.DOCKER_ORG_NAME }}/${{ secrets.DOCKER_BACKEND_CONTAINER_NAME }}:latest
+            ${{ secrets.DOCKER_ORG_NAME }}/${{ secrets.DOCKER_BACKEND_CONTAINER_NAME }}:${{ github.ref_name }}
+
+      - name: Build and push the frontend container
+        uses: docker/build-push-action@v4
+        with:
+          context: .
+          file: ./prod.Dockerfile
+          target: app
+          push: true
+          platforms: |
+            linux/amd64
+            linux/arm64
+          tags: |
+            ${{ secrets.DOCKER_ORG_NAME }}/${{ secrets.DOCKER_FRONTEND_CONTAINER_NAME }}:latest
+            ${{ secrets.DOCKER_ORG_NAME }}/${{ secrets.DOCKER_FRONTEND_CONTAINER_NAME }}:${{ github.ref_name }}
+
+      - name: Build and push the admin dashboard container
+        uses: docker/build-push-action@v4
+        with:
+          context: .
+          file: ./prod.Dockerfile
+          target: sh_admin
+          push: true
+          platforms: |
+            linux/amd64
+            linux/arm64
+          tags: |
+            ${{ secrets.DOCKER_ORG_NAME }}/${{ secrets.DOCKER_SH_ADMIN_CONTAINER_NAME }}:latest
+            ${{ secrets.DOCKER_ORG_NAME }}/${{ secrets.DOCKER_SH_ADMIN_CONTAINER_NAME }}:${{ github.ref_name }}
+
+      - name: Build and push the AIO container
+        uses: docker/build-push-action@v4
+        with:
+          context: .
+          file: ./prod.Dockerfile
+          target: aio
+          push: true
+          platforms: |
+            linux/amd64
+            linux/arm64
+          tags: |
+            ${{ secrets.DOCKER_ORG_NAME }}/${{ secrets.DOCKER_AIO_CONTAINER_NAME }}:latest
+            ${{ secrets.DOCKER_ORG_NAME }}/${{ secrets.DOCKER_AIO_CONTAINER_NAME }}:${{ github.ref_name }}
--- a/.github/workflows/tests.yml
+++ b/.github/workflows/tests.yml
@@ -2,9 +2,9 @@ name: Node.js CI

 on:
  push:
-    branches: [main, staging]
+    branches: [main, staging, "release/**"]
  pull_request:
-    branches: [main, staging]
+    branches: [main, staging, "release/**"]

 jobs:
  test:
--- a/.github/workflows/ui.yml
+++ b/.github/workflows/ui.yml
@@ -0,0 +1,42 @@
+name: Deploy to Netlify (ui)
+
+on:
+  push:
+    branches: [main]
+    # run this workflow only if an update is made to the ui package
+    paths:
+      - "packages/hoppscotch-ui/**"
+  workflow_dispatch:
+
+jobs:
+  deploy:
+    name: Deploy
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v3
+
+      - name: Setup environment
+        run: mv .env.example .env
+
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v2.2.4
+        with:
+          version: 8
+          run_install: true
+
+      - name: Setup node
+        uses: actions/setup-node@v3
+        with:
+          node-version: ${{ matrix.node }}
+          cache: pnpm
+
+      - name: Build site
+        run: pnpm run generate-ui
+
+      # Deploy the ui site with netlify-cli
+      - name: Deploy to Netlify (ui)
+        run: npx netlify-cli@15.11.0 deploy --dir=packages/hoppscotch-ui/.histoire/dist --prod
+        env:
+          NETLIFY_SITE_ID: ${{ secrets.NETLIFY_UI_SITE_ID }}
+          NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }}
--- a/.prettierrc.js
+++ b/.prettierrc.js
@@ -1,3 +1,8 @@
 module.exports = {
-  semi: false
+  semi: false,
+  trailingComma: "es5",
+  singleQuote: false,
+  printWidth: 80,
+  useTabs: false,
+  tabWidth: 2
 }
--- a/.vscode/extensions.json
+++ b/.vscode/extensions.json
@@ -1,14 +0,0 @@
-{
-  "recommendations": [
-    "antfu.iconify",
-    "vue.volar",
-    "esbenp.prettier-vscode",
-    "dbaeumer.vscode-eslint",
-    "editorconfig.editorconfig",
-    "csstools.postcss",
-    "folke.vscode-monorepo-workspace"
-  ],
-  "unwantedRecommendations": [
-    "octref.vetur"
-  ]
-}
--- a/CODE_OF_CONDUCT.md
+++ b/CODE_OF_CONDUCT.md
@@ -6,8 +6,8 @@ We as members, contributors, and leaders pledge to make participation in our
 community a harassment-free experience for everyone, regardless of age, body
 size, visible or invisible disability, ethnicity, sex characteristics, gender
 identity and expression, level of experience, education, socio-economic status,
-nationality, personal appearance, race, religion, or sexual identity
-and orientation.
+nationality, personal appearance, race, caste, color, religion, or sexual
+identity and orientation.

 We pledge to act and interact in ways that contribute to an open, welcoming,
 diverse, inclusive, and healthy community.
@@ -22,17 +22,17 @@ community include:
 * Giving and gracefully accepting constructive feedback
 * Accepting responsibility and apologizing to those affected by our mistakes,
  and learning from the experience
-* Focusing on what is best not just for us as individuals, but for the
-  overall community
+* Focusing on what is best not just for us as individuals, but for the overall
+  community

 Examples of unacceptable behavior include:

-* The use of sexualized language or imagery, and sexual attention or
-  advances of any kind
+* The use of sexualized language or imagery, and sexual attention or advances of
+  any kind
 * Trolling, insulting or derogatory comments, and personal or political attacks
 * Public or private harassment
-* Publishing others' private information, such as a physical or email
-  address, without their explicit permission
+* Publishing others' private information, such as a physical or email address,
+  without their explicit permission
 * Other conduct which could reasonably be considered inappropriate in a
  professional setting

@@ -82,15 +82,15 @@ behavior was inappropriate. A public apology may be requested.

 ### 2. Warning

-**Community Impact**: A violation through a single incident or series
-of actions.
+**Community Impact**: A violation through a single incident or series of
+actions.

 **Consequence**: A warning with consequences for continued behavior. No
 interaction with the people involved, including unsolicited interaction with
 those enforcing the Code of Conduct, for a specified period of time. This
 includes avoiding interactions in community spaces as well as external channels
-like social media. Violating these terms may lead to a temporary or
-permanent ban.
+like social media. Violating these terms may lead to a temporary or permanent
+ban.

 ### 3. Temporary Ban

@@ -106,23 +106,27 @@ Violating these terms may lead to a permanent ban.
 ### 4. Permanent Ban

 **Community Impact**: Demonstrating a pattern of violation of community
-standards, including sustained inappropriate behavior,  harassment of an
+standards, including sustained inappropriate behavior, harassment of an
 individual, or aggression toward or disparagement of classes of individuals.

-**Consequence**: A permanent ban from any sort of public interaction within
-the community.
+**Consequence**: A permanent ban from any sort of public interaction within the
+community.

 ## Attribution

 This Code of Conduct is adapted from the [Contributor Covenant][homepage],
-version 2.0, available at
-https://www.contributor-covenant.org/version/2/0/code_of_conduct.html.
+version 2.1, available at
+[https://www.contributor-covenant.org/version/2/1/code_of_conduct.html][v2.1].

-Community Impact Guidelines were inspired by [Mozilla's code of conduct
-enforcement ladder](https://github.com/mozilla/diversity).
-
-[homepage]: https://www.contributor-covenant.org
+Community Impact Guidelines were inspired by
+[Mozilla's code of conduct enforcement ladder][Mozilla CoC].

 For answers to common questions about this code of conduct, see the FAQ at
-https://www.contributor-covenant.org/faq. Translations are available at
-https://www.contributor-covenant.org/translations.
+[https://www.contributor-covenant.org/faq][FAQ]. Translations are available at
+[https://www.contributor-covenant.org/translations][translations].
+
+[homepage]: https://www.contributor-covenant.org
+[v2.1]: https://www.contributor-covenant.org/version/2/1/code_of_conduct.html
+[Mozilla CoC]: https://github.com/mozilla/diversity
+[FAQ]: https://www.contributor-covenant.org/faq
+[translations]: https://www.contributor-covenant.org/translations
--- a/README.md
+++ b/README.md
@@ -2,23 +2,18 @@
  <a href="https://hoppscotch.io">
    <img
      src="https://avatars.githubusercontent.com/u/56705483"
-      alt="Hoppscotch Logo"
+      alt="Hoppscotch"
      height="64"
    />
  </a>
-  <br />
-  <p>
-    <h3>
-      <b>
-        Hoppscotch
-      </b>
-    </h3>
-  </p>
-  <p>
+  <h3>
    <b>
-      Open source API development ecosystem
+      Hoppscotch
    </b>
-  </p>
+  </h3>
+  <b>
+    Open Source API Development Ecosystem
+  </b>
  <p>

 [![contributions welcome](https://img.shields.io/badge/contributions-welcome-brightgreen?logo=github)](CODE_OF_CONDUCT.md) [![Website](https://img.shields.io/website?url=https%3A%2F%2Fhoppscotch.io&logo=hoppscotch)](https://hoppscotch.io) [![Tests](https://github.com/hoppscotch/hoppscotch/actions/workflows/tests.yml/badge.svg)](https://github.com/hoppscotch/hoppscotch/actions) [![Tweet](https://img.shields.io/twitter/url?url=https%3A%2F%2Fhoppscotch.io%2F)](https://twitter.com/share?text=%F0%9F%91%BD%20Hoppscotch%20%E2%80%A2%20Open%20source%20API%20development%20ecosystem%20-%20Helps%20you%20create%20requests%20faster,%20saving%20precious%20time%20on%20development.&url=https://hoppscotch.io&hashtags=hoppscotch&via=hoppscotch_io)
@@ -34,23 +29,18 @@
  </p>
  <br />
  <p>
-    <a href="https://hoppscotch.io/#gh-light-mode-only" target="_blank">
-      <img
-        src="./packages/hoppscotch-common/public/images/banner-light.png"
-        alt="Hoppscotch"
-        width="100%"
-      />
-    </a>
-    <a href="https://hoppscotch.io/#gh-dark-mode-only" target="_blank">
-      <img
-        src="./packages/hoppscotch-common/public/images/banner-dark.png"
-        alt="Hoppscotch"
-        width="100%"
-      />
+    <a href="https://hoppscotch.io">
+      <picture>
+        <source media="(prefers-color-scheme: dark)" srcset="./packages/hoppscotch-common/public/images/banner-dark.png">
+        <source media="(prefers-color-scheme: light)" srcset="./packages/hoppscotch-common/public/images/banner-light.png">
+        <img alt="Hoppscotch" src="./packages/hoppscotch-common/public/images/banner-dark.png">
+      </picture>
    </a>
  </p>
 </div>

+_We highly recommend you take a look at the [**Hoppscotch Documentation**](https://docs.hoppscotch.io) to learn more about the app._
+
 #### **Support**

 [![Chat on Discord](https://img.shields.io/badge/chat-Discord-7289DA?logo=discord)](https://hoppscotch.io/discord) [![Chat on Telegram](https://img.shields.io/badge/chat-Telegram-2CA5E0?logo=telegram)](https://hoppscotch.io/telegram) [![Discuss on GitHub](https://img.shields.io/badge/discussions-GitHub-333333?logo=github)](https://github.com/hoppscotch/hoppscotch/discussions)
@@ -59,9 +49,9 @@

 ❤️ **Lightweight:** Crafted with minimalistic UI design.

-⚡️ **Fast:** Send requests and get/copy responses in real-time.
+⚡️ **Fast:** Send requests and get responses in real time.

-**HTTP Methods**
+🗄️ **HTTP Methods:** Request methods define the type of action you are requesting to be performed.

 - `GET` - Requests retrieve resource information
 - `POST` - The server creates a new entry in a database
@@ -74,17 +64,15 @@
 - `TRACE` - Performs a message loop-back test along the path to the target resource
 - `<custom>` - Some APIs use custom request methods such as `LIST`. Type in your custom methods.

-🌈 **Make it yours:** Customizable combinations for background, foreground, and accent colors — [customize now](https://hoppscotch.io/settings).
+🌈 **Theming:** Customizable combinations for background, foreground, and accent colors — [customize now](https://hoppscotch.io/settings).

-**Theming**
-
- Choose a theme: System (default), Light, Dark, and Black
- Choose accent color: Green (default), Teal, Blue, Indigo, Purple, Yellow, Orange, Red, and Pink
+- Choose a theme: System preference, Light, Dark, and Black
+- Choose accent colors: Green, Teal, Blue, Indigo, Purple, Yellow, Orange, Red, and Pink
 - Distraction-free Zen mode

-_Customized themes are synced with cloud / local session_
+_Customized themes are synced with your cloud/local session._

-🔥 **PWA:** Install as a [PWA](https://web.dev/what-are-pwas/) on your device.
+🔥 **PWA:** Install as a [Progressive Web App](https://web.dev/progressive-web-apps) on your device.

 - Instant loading with Service Workers
 - Offline support
@@ -107,7 +95,7 @@ _Customized themes are synced with cloud / local session_

 📡 **Server-Sent Events:** Receive a stream of updates from a server over an HTTP connection without resorting to polling.

-🌩 **Socket.IO:** Send and Receive data with SocketIO server.
+🌩 **Socket.IO:** Send and Receive data with the SocketIO server.

 🦟 **MQTT:** Subscribe and Publish to topics of an MQTT Broker.

@@ -127,7 +115,7 @@ _Customized themes are synced with cloud / local session_
 - OAuth 2.0
 - OIDC Access Token/PKCE

-📢 **Headers:** Describes the format the body of your request is being sent as.
+📢 **Headers:** Describes the format the body of your request is being sent in.

 📫 **Parameters:** Use request parameters to set varying parts in simulated requests.

@@ -137,14 +125,14 @@ _Customized themes are synced with cloud / local session_
 - FormData, JSON, and many more
 - Toggle between key-value and RAW input parameter list

-👋 **Response:** Contains the status line, headers, and the message/response body.
+📮 **Response:** Contains the status line, headers, and the message/response body.

- Copy response to clipboard
- Download response as a file
+- Copy the response to the clipboard
+- Download the response as a file
 - View response headers
- View raw and preview of HTML, image, JSON, XML responses
+- View raw and preview HTML, image, JSON, and XML responses

-⏰ **History:** Request entries are synced with cloud / local session storage to restore with a single click.
+⏰ **History:** Request entries are synced with your cloud/local session storage.

 📁 **Collections:** Keep your API requests organized with collections and folders. Reuse them with a single click.

@@ -152,7 +140,32 @@ _Customized themes are synced with cloud / local session_
 - Nested folders
 - Export and import as a file or GitHub gist

-_Collections are synced with cloud / local session storage_
+_Collections are synced with your cloud/local session storage._
+
+📜 **Pre-Request Scripts:** Snippets of code associated with a request that is executed before the request is sent.
+
+- Set environment variables
+- Include timestamp in the request headers
+- Send a random alphanumeric string in the URL parameters
+- Any JavaScript functions
+
+👨‍👩‍👧‍👦 **Teams:** Helps you collaborate across your teams to design, develop, and test APIs faster.
+
+- Create unlimited teams
+- Create unlimited shared collections
+- Create unlimited team members
+- Role-based access control
+- Cloud sync
+- Multiple devices
+
+👥 **Workspaces:** Organize your personal and team collections environments into workspaces. Easily switch between workspaces to manage multiple projects.
+
+- Create unlimited workspaces
+- Switch between personal and team workspaces
+
+⌨️ **Keyboard Shortcuts:** Optimized for efficiency.
+
+> **[Read our documentation on Keyboard Shortcuts](https://docs.hoppscotch.io/documentation/features/shortcuts)**

 🌐 **Proxy:** Enable Proxy Mode from Settings to access blocked APIs.

@@ -161,60 +174,31 @@ _Collections are synced with cloud / local session storage_
 - Access APIs served in non-HTTPS (`http://`) endpoints
 - Use your Proxy URL

-_Official proxy server is hosted by Hoppscotch - **[GitHub](https://github.com/hoppscotch/proxyscotch)** - **[Privacy Policy](https://docs.hoppscotch.io/support/privacy)**_
-
-📜 **Pre-Request Scripts β:** Snippets of code associated with a request that is executed before the request is sent.
-
- Set environment variables
- Include timestamp in the request headers
- Send a random alphanumeric string in the URL parameters
- Any JavaScript functions
-
-📄 **API Documentation:** Create and share dynamic API documentation easily, quickly.
-
-1. Add your requests to Collections and Folders
-2. Export Collections and easily share your APIs with the rest of your team
-3. Import Collections and Generate Documentation on-the-go
-
-⌨️ **Keyboard Shortcuts:** Optimized for efficiency.
-
-> **[Read our documentation on Keyboard Shortcuts](https://docs.hoppscotch.io/documentation/features/shortcuts)**
+_Official proxy server is hosted by Hoppscotch - **[GitHub](https://github.com/hoppscotch/proxyscotch)** - **[Privacy Policy](https://docs.hoppscotch.io/support/privacy)**._

 🌎 **i18n:** Experience the app in your language.

-Help us to translate Hoppscotch. Please read [`TRANSLATIONS`](TRANSLATIONS.md) for details on our [`CODE OF CONDUCT`](CODE_OF_CONDUCT.md), and the process for submitting pull requests to us.
+Help us to translate Hoppscotch. Please read [`TRANSLATIONS`](TRANSLATIONS.md) for details on our [`CODE OF CONDUCT`](CODE_OF_CONDUCT.md) and the process for submitting pull requests to us.

-📦 **Add-ons:** Official add-ons for hoppscotch.
+☁️ **Auth + Sync:** Sign in and sync your data in real-time across all your devices.

- **[Proxy](https://github.com/hoppscotch/proxyscotch)** - A simple proxy server created for Hoppscotch
- **[CLI β](https://github.com/hoppscotch/hopp-cli)** - A CLI solution for Hoppscotch
- **[Browser Extensions](https://github.com/hoppscotch/hoppscotch-extension)** - Browser extensions that simplifies access to Hoppscotch
-
-  [![Firefox](https://raw.github.com/alrra/browser-logos/master/src/firefox/firefox_16x16.png) **Firefox**](https://addons.mozilla.org/en-US/firefox/addon/hoppscotch) &nbsp;|&nbsp; [![Chrome](https://raw.github.com/alrra/browser-logos/master/src/chrome/chrome_16x16.png) **Chrome**](https://chrome.google.com/webstore/detail/hoppscotch-extension-for-c/amknoiejhlmhancpahfcfcfhllgkpbld)
-
-  > **Extensions fixes `CORS` issues.**
-
- **[Hopp-Doc-Gen](https://github.com/hoppscotch/hopp-doc-gen)** - An API doc generator CLI for Hoppscotch
-
-_Add-ons are developed and maintained under **[Hoppscotch Organization](https://github.com/hoppscotch)**._
-
-☁️ **Auth + Sync:** Sign in and sync your data in real-time.
-
-**Sign in with**
+**Sign in with:**

 - GitHub
 - Google
 - Microsoft
 - Email
+- SSO (Single Sign-On)[^EE]

-**Synchronize your data**
+**🔄 Synchronize your data:** Handoff to continue tasks on your other devices.

+- Workspaces
 - History
 - Collections
 - Environments
 - Settings

-✅ **Post-Request Tests β:** Write tests associated with a request that is executed after the request's response.
+✅ **Post-Request Tests:** Write tests associated with a request that is executed after the request's response.

 - Check the status code as an integer
 - Filter response headers
@@ -222,7 +206,7 @@ _Add-ons are developed and maintained under **[Hoppscotch Organization](https://
 - Set environment variables
 - Write JavaScript code

-🌱 **Environments** : Environment variables allow you to store and reuse values in your requests and scripts.
+🌱 **Environments:** Environment variables allow you to store and reuse values in your requests and scripts.

 - Unlimited environments and variables
 - Initialize through the pre-request script
@@ -241,22 +225,31 @@ _Add-ons are developed and maintained under **[Hoppscotch Organization](https://

 </details>

-👨‍👩‍👧‍👦 **Teams β:** Helps you collaborate across your team to design, develop, and test APIs faster.
-
- Unlimited teams
- Unlimited shared collections
- Unlimited team members
- Role-based access control
- Cloud sync
- Multiple devices
-
 🚚 **Bulk Edit:** Edit key-value pairs in bulk.

 - Entries are separated by newline
 - Keys and values are separated by `:`
 - Prepend `#` to any row you want to add but keep disabled

-**For more features, please read our [documentation](https://docs.hoppscotch.io).**
+🎛️ **Admin dashboard:** Manage your team and invite members.
+
+- Insights
+- Manage users
+- Manage teams
+
+📦 **Add-ons:** Official add-ons for hoppscotch.
+
+- **[Hoppscotch CLI](https://github.com/hoppscotch/hopp-cli)** - Command-line interface for Hoppscotch.
+- **[Proxy](https://github.com/hoppscotch/proxyscotch)** - A simple proxy server created for Hoppscotch.
+- **[Browser Extensions](https://github.com/hoppscotch/hoppscotch-extension)** - Browser extensions that enhance your Hoppscotch experience.
+
+  [![Firefox](https://raw.github.com/alrra/browser-logos/master/src/firefox/firefox_16x16.png) **Firefox**](https://addons.mozilla.org/en-US/firefox/addon/hoppscotch) &nbsp;|&nbsp; [![Chrome](https://raw.github.com/alrra/browser-logos/master/src/chrome/chrome_16x16.png) **Chrome**](https://chrome.google.com/webstore/detail/hoppscotch-extension-for-c/amknoiejhlmhancpahfcfcfhllgkpbld)
+
+  > **Extensions fix `CORS` issues.**
+
+_Add-ons are developed and maintained under **[Hoppscotch Organization](https://github.com/hoppscotch)**._
+
+**For a complete list of features, please read our [documentation](https://docs.hoppscotch.io).**

 ## **Demo**

@@ -268,18 +261,9 @@ _Add-ons are developed and maintained under **[Hoppscotch Organization](https://
 2. Click "Send" to simulate the request
 3. View the response

-## **Built with**
-
- [HTML](https://developer.mozilla.org/en-US/docs/Web/HTML)
- [CSS](https://developer.mozilla.org/en-US/docs/Web/CSS), [SCSS](https://sass-lang.com), [Windi CSS](https://windicss.org)
- [JavaScript](https://developer.mozilla.org/en-US/docs/Web/JavaScript)
- [TypeScript](https://www.typescriptlang.org)
- [Vue](https://vuejs.org)
- [Vite](https://vitejs.dev)
-
 ## **Developing**

-Follow our [self-hosting guide](https://docs.hoppscotch.io/documentation/self-host/getting-started) to get started with the development environment.
+Follow our [self-hosting documentation](https://docs.hoppscotch.io/documentation/self-host/getting-started) to get started with the development environment.

 ## **Contributing**

@@ -297,7 +281,7 @@ See the [`CHANGELOG`](CHANGELOG.md) file for details.

 ## **Authors**

-This project exists thanks to all the people who contribute — [contribute](CONTRIBUTING.md).
+This project owes its existence to the collective efforts of all those who contribute — [contribute now](CONTRIBUTING.md).

 <div align="center">
  <a href="https://github.com/hoppscotch/hoppscotch/graphs/contributors">
@@ -309,4 +293,6 @@ This project exists thanks to all the people who contribute — [contribute](CON

 ## **License**

-This project is licensed under the [MIT License](https://opensource.org/licenses/MIT) - see the [`LICENSE`](LICENSE) file for details.
+This project is licensed under the [MIT License](https://opensource.org/licenses/MIT) — see the [`LICENSE`](LICENSE) file for details.
+
+[^EE]: Enterprise edition feature. [Learn more](https://docs.hoppscotch.io/documentation/self-host/getting-started).
--- a/SECURITY.md
+++ b/SECURITY.md
@@ -2,8 +2,9 @@

 This document outlines security procedures and general policies for the Hoppscotch project.

-1. [Reporting a security vulnerability](#reporting-a-security-vulnerability)
-3. [Incident response process](#incident-response-process)
+- [Security Policy](#security-policy)
+  - [Reporting a security vulnerability](#reporting-a-security-vulnerability)
+  - [Incident response process](#incident-response-process)

 ## Reporting a security vulnerability

--- a/TRANSLATIONS.md
+++ b/TRANSLATIONS.md
@@ -9,26 +9,24 @@ Before you start working on a new language, please look through the [open pull r
 if there is no existing translation, you can create a new one by following these steps:

 1. **[Fork the repository](https://github.com/hoppscotch/hoppscotch/fork).**
-2. **Checkout the `i18n` branch for latest translations.**
-3. **Create a new branch for your translation with base branch `i18n`.**
+2. **Checkout the `main` branch for latest translations.**
+3. **Create a new branch for your translation with base branch `main`.**
 4. **Create target language file in the [`/packages/hoppscotch-common/locales`](https://github.com/hoppscotch/hoppscotch/tree/main/packages/hoppscotch-common/locales) directory.**
 5. **Copy the contents of the source file [`/packages/hoppscotch-common/locales/en.json`](https://github.com/hoppscotch/hoppscotch/blob/main/packages/hoppscotch-common/locales/en.json) to the target language file.**
 6. **Translate the strings in the target language file.**
 7. **Add your language entry to [`/packages/hoppscotch-common/languages.json`](https://github.com/hoppscotch/hoppscotch/blob/main/packages/hoppscotch-common/languages.json).**
-8. **Save & commit changes.**
+8. **Save and commit changes.**
 9. **Send a pull request.**

 _You may send a pull request before all steps above are complete: e.g., you may want to ask for help with translations, or getting tests to pass. However, your pull request will not be merged until all steps above are complete._

-`i18n` branch will be merged into `main` branch once every week.
-
 Completing an initial translation of the whole site is a fairly large task. One way to break that task up is to work with other translators through pull requests on your fork. You can also [add collaborators to your fork](https://help.github.com/en/github/setting-up-and-managing-your-github-user-account/inviting-collaborators-to-a-personal-repository) if you'd like to invite other translators to commit directly to your fork and share responsibility for merging pull requests.

 ## Updating a translation

 ### Corrections

-If you notice spelling or grammar errors, typos, or opportunities for better phrasing, open a pull request with your suggested fix. If you see a problem that you aren't sure of or don't have time to fix, open an issue.
+If you notice spelling or grammar errors, typos, or opportunities for better phrasing, open a pull request with your suggested fix. If you see a problem that you aren't sure of or don't have time to fix, [open an issue](https://github.com/hoppscotch/hoppscotch/issues/new/choose).

 ### Broken links

--- a/aio-multiport-setup.Caddyfile
+++ b/aio-multiport-setup.Caddyfile
@@ -0,0 +1,19 @@
+:3000 {
+	try_files {path} /
+	root * /site/selfhost-web
+	file_server
+}
+
+:3100 {
+	try_files {path} /
+	root * /site/sh-admin-multiport-setup
+	file_server
+}
+
+:3170 {
+	reverse_proxy localhost:8080
+}
+
+:80 {
+	respond 404
+}
--- a/aio-subpath-access.Caddyfile
+++ b/aio-subpath-access.Caddyfile
@@ -0,0 +1,37 @@
+:3000 {
+	respond 404
+}
+
+:3100 {
+	respond 404
+}
+
+:3170 {
+	reverse_proxy localhost:8080
+}
+
+:80 {
+	# Serve the `selfhost-web` SPA by default
+	root * /site/selfhost-web
+	file_server
+
+	handle_path /admin* {
+		root * /site/sh-admin-subpath-access
+		file_server
+
+		# Ensures any non-existent file in the server is routed to the SPA
+		try_files {path} /
+	}
+
+	# Handle requests under `/backend*` path
+	handle_path /backend* {
+		reverse_proxy localhost:8080
+	}
+
+	# Catch-all route for unknown paths, serves `selfhost-web` SPA
+	handle {
+		root * /site/selfhost-web
+		file_server
+		try_files {path} /
+	}
+}
--- a/aio_run.mjs
+++ b/aio_run.mjs
@@ -0,0 +1,73 @@
+#!/usr/local/bin/node
+// @ts-check
+
+import { execSync, spawn } from "child_process"
+import fs from "fs"
+import process from "process"
+
+function runChildProcessWithPrefix(command, args, prefix) {
+  const childProcess = spawn(command, args);
+
+  childProcess.stdout.on('data', (data) => {
+    const output = data.toString().trim().split('\n');
+    output.forEach((line) => {
+      console.log(`${prefix} | ${line}`);
+    });
+  });
+
+  childProcess.stderr.on('data', (data) => {
+    const error = data.toString().trim().split('\n');
+    error.forEach((line) => {
+      console.error(`${prefix} | ${line}`);
+    });
+  });
+
+  childProcess.on('close', (code) => {
+    console.log(`${prefix} Child process exited with code ${code}`);
+  });
+
+  childProcess.on('error', (stuff) => {
+    console.log("error")
+    console.log(stuff)
+  })
+
+  return childProcess
+}
+
+const envFileContent = Object.entries(process.env)
+  .filter(([env]) => env.startsWith("VITE_"))
+  .map(([env, val]) => `${env}=${
+    (val.startsWith("\"") && val.endsWith("\""))
+      ? val
+      : `"${val}"`
+  }`)
+  .join("\n")
+
+fs.writeFileSync("build.env", envFileContent)
+
+execSync(`npx import-meta-env -x build.env -e build.env -p "/site/**/*"`)
+
+fs.rmSync("build.env")
+
+const caddyFileName = process.env.ENABLE_SUBPATH_BASED_ACCESS === 'true' ? 'aio-subpath-access.Caddyfile' : 'aio-multiport-setup.Caddyfile'
+const caddyProcess = runChildProcessWithPrefix("caddy", ["run", "--config", `/etc/caddy/${caddyFileName}`, "--adapter", "caddyfile"], "App/Admin Dashboard Caddy")
+const backendProcess = runChildProcessWithPrefix("pnpm", ["run", "start:prod"], "Backend Server")
+
+caddyProcess.on("exit", (code) => {
+  console.log(`Exiting process because Caddy Server exited with code ${code}`)
+  process.exit(code)
+})
+
+backendProcess.on("exit", (code) => {
+  console.log(`Exiting process because Backend Server exited with code ${code}`)
+  process.exit(code)
+})
+
+process.on('SIGINT', () => {
+  console.log("SIGINT received, exiting...")
+
+  caddyProcess.kill("SIGINT")
+  backendProcess.kill("SIGINT")
+
+  process.exit(0)
+})
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -7,6 +7,107 @@ services:
  # This service runs the backend app in the port 3170
  hoppscotch-backend:
    container_name: hoppscotch-backend
+    build:
+      dockerfile: prod.Dockerfile
+      context: .
+      target: backend
+    env_file:
+      - ./.env
+    restart: always
+    environment:
+      # Edit the below line to match your PostgresDB URL if you have an outside DB (make sure to update the .env file as well)
+      - DATABASE_URL=postgresql://postgres:testpass@hoppscotch-db:5432/hoppscotch?connect_timeout=300
+      - PORT=8080
+    volumes:
+      # Uncomment the line below when modifying code. Only applicable when using the "dev" target.
+      # - ./packages/hoppscotch-backend/:/usr/src/app
+      - /usr/src/app/node_modules/
+    depends_on:
+      hoppscotch-db:
+        condition: service_healthy
+    ports:
+      - "3180:80"
+      - "3170:3170"
+
+  # The main hoppscotch app. This will be hosted at port 3000
+  # NOTE: To do TLS or play around with how the app is hosted, you can look into the Caddyfile for
+  #       the SH admin dashboard server at packages/hoppscotch-selfhost-web/Caddyfile
+  hoppscotch-app:
+    container_name: hoppscotch-app
+    build:
+      dockerfile: prod.Dockerfile
+      context: .
+      target: app
+    env_file:
+      - ./.env
+    depends_on:
+      - hoppscotch-backend
+    ports:
+      - "3080:80"
+      - "3000:3000"
+
+  # The Self Host dashboard for managing the app. This will be hosted at port 3100
+  # NOTE: To do TLS or play around with how the app is hosted, you can look into the Caddyfile for
+  #       the SH admin dashboard server at packages/hoppscotch-sh-admin/Caddyfile
+  hoppscotch-sh-admin:
+    container_name: hoppscotch-sh-admin
+    build:
+      dockerfile: prod.Dockerfile
+      context: .
+      target: sh_admin
+    env_file:
+      - ./.env
+    depends_on:
+      - hoppscotch-backend
+    ports:
+      - "3280:80"
+      - "3100:3100"
+
+  # The service that spins up all 3 services at once in one container
+  hoppscotch-aio:
+    container_name: hoppscotch-aio
+    build:
+      dockerfile: prod.Dockerfile
+      context: .
+      target: aio
+    env_file:
+      - ./.env
+    depends_on:
+      hoppscotch-db:
+        condition: service_healthy
+    ports:
+      - "3000:3000"
+      - "3100:3100"
+      - "3170:3170"
+      - "3080:80"
+
+  # The preset DB service, you can delete/comment the below lines if
+  # you are using an external postgres instance
+  # This will be exposed at port 5432
+  hoppscotch-db:
+    image: postgres:15
+    ports:
+      - "5432:5432"
+    user: postgres
+    environment:
+      # The default user defined by the docker image
+      POSTGRES_USER: postgres
+      # NOTE: Please UPDATE THIS PASSWORD!
+      POSTGRES_PASSWORD: testpass
+      POSTGRES_DB: hoppscotch
+    healthcheck:
+      test:
+        [
+          "CMD-SHELL",
+          "sh -c 'pg_isready -U $${POSTGRES_USER} -d $${POSTGRES_DB}'"
+        ]
+      interval: 5s
+      timeout: 5s
+      retries: 10
+
+  # All the services listed below are deprececated
+  hoppscotch-old-backend:
+    container_name: hoppscotch-old-backend
    build:
      dockerfile: packages/hoppscotch-backend/Dockerfile
      context: .
@@ -19,53 +120,35 @@ services:
      - DATABASE_URL=postgresql://postgres:testpass@hoppscotch-db:5432/hoppscotch?connect_timeout=300
      - PORT=3000
    volumes:
-      - ./packages/hoppscotch-backend/:/usr/src/app
+      # Uncomment the line below when modifying code. Only applicable when using the "dev" target.
+      # - ./packages/hoppscotch-backend/:/usr/src/app
      - /usr/src/app/node_modules/
    depends_on:
-      - hoppscotch-db
+      hoppscotch-db:
+        condition: service_healthy
    ports:
      - "3170:3000"

-  # The main hoppscotch app. This will be hosted at port 3000
-  # NOTE: To do TLS or play around with how the app is hosted, you can look into the Caddyfile for
-  #       the SH admin dashboard server at packages/hoppscotch-selfhost-web/Caddyfile
-  hoppscotch-app:
-    container_name: hoppscotch-app
+  hoppscotch-old-app:
+    container_name: hoppscotch-old-app
    build:
      dockerfile: packages/hoppscotch-selfhost-web/Dockerfile
      context: .
    env_file:
      - ./.env
    depends_on:
-      - hoppscotch-backend
+      - hoppscotch-old-backend
    ports:
      - "3000:8080"

-  # The Self Host dashboard for managing the app. This will be hosted at port 3100
-  # NOTE: To do TLS or play around with how the app is hosted, you can look into the Caddyfile for
-  #       the SH admin dashboard server at packages/hoppscotch-sh-admin/Caddyfile
-  hoppscotch-sh-admin:
-    container_name: hoppscotch-sh-admin
+  hoppscotch-old-sh-admin:
+    container_name: hoppscotch-old-sh-admin
    build:
      dockerfile: packages/hoppscotch-sh-admin/Dockerfile
      context: .
    env_file:
      - ./.env
    depends_on:
-      - hoppscotch-backend
+      - hoppscotch-old-backend
    ports:
      - "3100:8080"
-
-  # The preset DB service, you can delete/comment the below lines if
-  # you are using an external postgres instance
-  # This will be exposed at port 5432
-  hoppscotch-db:
-    image: postgres
-    ports:
-      - "5432:5432"
-    environment:
-      # NOTE: Please UPDATE THIS PASSWORD!
-      POSTGRES_PASSWORD: testpass
-      POSTGRES_DB: hoppscotch
-
-
--- a/healthcheck.sh
+++ b/healthcheck.sh
@@ -0,0 +1,14 @@
+#!/bin/bash
+
+curlCheck() {
+  if ! curl -s --head "$1" | head -n 1 | grep -q "HTTP/1.[01] [23].."; then
+    echo "URL request failed!"
+    exit 1
+  else
+    echo "URL request succeeded!"
+  fi
+}
+
+curlCheck "http://localhost:3000"
+curlCheck "http://localhost:3100"
+curlCheck "http://localhost:3170/ping"
--- a/package.json
+++ b/package.json
@@ -22,15 +22,25 @@
  "workspaces": [
    "./packages/*"
  ],
-  "dependencies": {
-    "husky": "^7.0.4",
-    "lint-staged": "^12.3.8"
-  },
  "devDependencies": {
    "@commitlint/cli": "^16.2.3",
    "@commitlint/config-conventional": "^16.2.1",
-    "@types/node": "^17.0.24",
+    "@types/node": "17.0.27",
    "cross-env": "^7.0.3",
-    "http-server": "^14.1.1"
+    "http-server": "^14.1.1",
+    "husky": "^7.0.4",
+    "lint-staged": "12.4.0"
+  },
+  "pnpm": {
+    "overrides": {
+      "vue": "3.3.9"
+    },
+    "packageExtensions": {
+      "httpsnippet@^3.0.1": {
+        "peerDependencies": {
+          "ajv": "6.12.3"
+        }
+      }
+    }
  }
 }
--- a/packages/codemirror-lang-graphql/package.json
+++ b/packages/codemirror-lang-graphql/package.json
@@ -17,16 +17,16 @@
  "types": "dist/index.d.ts",
  "sideEffects": false,
  "dependencies": {
-    "@codemirror/language": "^6.2.0",
-    "@lezer/highlight": "^1.0.0",
-    "@lezer/lr": "^1.2.0"
+    "@codemirror/language": "6.9.0",
+    "@lezer/highlight": "1.1.4",
+    "@lezer/lr": "^1.3.13"
  },
  "devDependencies": {
-    "@lezer/generator": "^1.1.0",
+    "@lezer/generator": "^1.5.1",
    "mocha": "^9.2.2",
-    "rollup": "^2.70.2",
-    "rollup-plugin-dts": "^4.2.1",
-    "rollup-plugin-ts": "^2.0.7",
-    "typescript": "^4.6.3"
+    "rollup": "^3.29.3",
+    "rollup-plugin-dts": "^6.0.2",
+    "rollup-plugin-ts": "^3.4.5",
+    "typescript": "^5.2.2"
  }
 }
--- a/packages/dioc/.gitignore
+++ b/packages/dioc/.gitignore
@@ -0,0 +1,24 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?
--- a/packages/dioc/README.md
+++ b/packages/dioc/README.md
@@ -0,0 +1,141 @@
+# dioc
+
+A small and lightweight dependency injection / inversion of control system.
+
+### About
+
+`dioc` is a really simple **DI/IOC** system where you write services (which are singletons per container) that can depend on each other and emit events that can be listened upon.
+
+### Demo
+
+```ts
+import { Service, Container } from "dioc"
+
+// Here is a simple service, which you can define by extending the Service class
+// and providing an ID static field (of type string)
+export class PersistenceService extends Service {
+  // This should be unique for each container
+  public static ID = "PERSISTENCE_SERVICE"
+
+  public read(key: string): string | undefined {
+    // ...
+  }
+
+  public write(key: string, value: string) {
+    // ...
+  }
+}
+
+type TodoServiceEvent =
+  | { type: "TODO_CREATED"; index: number }
+  | { type: "TODO_DELETED"; index: number }
+
+// Services have a built in event system
+// Define the generic argument to say what are the possible emitted values
+export class TodoService extends Service<TodoServiceEvent> {
+  public static ID = "TODO_SERVICE"
+
+  // Inject persistence service into this service
+  private readonly persistence = this.bind(PersistenceService)
+
+  public todos = []
+
+  // Service constructors cannot have arguments
+  constructor() {
+    super()
+
+    this.todos = JSON.parse(this.persistence.read("todos") ?? "[]")
+  }
+
+  public addTodo(text: string) {
+    // ...
+
+    // You can access services via the bound fields
+    this.persistence.write("todos", JSON.stringify(this.todos))
+
+    // This is how you emit an event
+    this.emit({
+      type: "TODO_CREATED",
+      index,
+    })
+  }
+
+  public removeTodo(index: number) {
+    // ...
+
+    this.emit({
+      type: "TODO_DELETED",
+      index,
+    })
+  }
+}
+
+// Services need a container to run in
+const container = new Container()
+
+// You can initialize and get services using Container#bind
+// It will automatically initialize the service (and its dependencies)
+const todoService = container.bind(TodoService) // Returns an instance of TodoService
+```
+
+### Demo (Unit Test)
+
+`dioc/testing` contains `TestContainer` which lets you bind mocked services to the container.
+
+```ts
+import { TestContainer } from "dioc/testing"
+import { TodoService, PersistenceService } from "./demo.ts" // The above demo code snippet
+import { describe, it, expect, vi } from "vitest"
+
+describe("TodoService", () => {
+  it("addTodo writes to persistence", () => {
+    const container = new TestContainer()
+
+    const writeFn = vi.fn()
+
+    // The first parameter is the service to mock and the second parameter
+    // is the mocked service fields and functions
+    container.bindMock(PersistenceService, {
+      read: () => undefined, // Not really important for this test
+      write: writeFn,
+    })
+
+    // the peristence service bind in TodoService will now use the
+    // above defined mocked implementation
+    const todoService = container.bind(TodoService)
+
+    todoService.addTodo("sup")
+
+    expect(writeFn).toHaveBeenCalledOnce()
+    expect(writeFn).toHaveBeenCalledWith("todos", JSON.stringify(["sup"]))
+  })
+})
+```
+
+### Demo (Vue)
+
+`dioc/vue` contains a Vue Plugin and a `useService` composable that allows Vue components to use the defined services.
+
+In the app entry point:
+
+```ts
+import { createApp } from "vue"
+import { diocPlugin } from "dioc/vue"
+
+const app = createApp()
+
+app.use(diocPlugin, {
+  container: new Container(), // You can pass in the container you want to provide to the components here
+})
+```
+
+In your Vue components:
+
+```vue
+<script setup>
+import { TodoService } from "./demo.ts" // The above demo
+import { useService } from "dioc/vue"
+
+const todoService = useService(TodoService) // Returns an instance of the TodoService class
+</script>
+```
--- a/packages/dioc/index.d.ts
+++ b/packages/dioc/index.d.ts
@@ -0,0 +1,2 @@
+export { default } from "./dist/main.d.ts"
+export * from "./dist/main.d.ts"
--- a/packages/dioc/lib/container.ts
+++ b/packages/dioc/lib/container.ts
@@ -0,0 +1,147 @@
+import { Service } from "./service"
+import { Observable, Subject } from 'rxjs'
+
+/**
+ * Stores the current container instance in the current operating context.
+ *
+ * NOTE: This should not be used outside of dioc library code
+ */
+export let currentContainer: Container | null = null
+
+/**
+ * The events emitted by the container
+ *
+ * `SERVICE_BIND` - emitted when a service is bound to the container directly or as a dependency to another service
+ * `SERVICE_INIT` - emitted when a service is initialized
+ */
+export type ContainerEvent =
+  | {
+    type: 'SERVICE_BIND';
+
+    /** The Service ID of the service being bounded (the dependency) */
+    boundeeID: string;
+
+    /**
+     * The Service ID of the bounder that is binding the boundee (the dependent)
+     *
+     * NOTE: This will be undefined if the service is bound directly to the container
+     */
+    bounderID: string | undefined
+  }
+  | {
+    type: 'SERVICE_INIT';
+
+    /** The Service ID of the service being initialized */
+    serviceID: string
+  }
+
+/**
+ * The dependency injection container, allows for services to be initialized and maintains the dependency trees.
+ */
+export class Container {
+  /** Used during the `bind` operation to detect circular dependencies */
+  private bindStack: string[] = []
+
+  /** The map of bound services to their IDs */
+  protected boundMap = new Map<string, Service<unknown>>()
+
+  /** The RxJS observable representing the event stream */
+  protected event$ = new Subject<ContainerEvent>()
+
+  /**
+   * Returns whether a container has the given service bound
+   * @param service The service to check for
+   */
+  public hasBound<
+    T extends typeof Service<any> & { ID: string }
+  >(service: T): boolean {
+    return this.boundMap.has(service.ID)
+  }
+
+  /**
+   * Returns the service bound to the container with the given ID or if not found, undefined.
+   *
+   * NOTE: This is an advanced method and should not be used as much as possible.
+   *
+   * @param serviceID The ID of the service to get
+   */
+  public getBoundServiceWithID(serviceID: string): Service<unknown> | undefined {
+    return this.boundMap.get(serviceID)
+  }
+
+  /**
+   * Binds a service to the container. This is equivalent to marking a service as a dependency.
+   * @param service The class reference of a service to bind
+   * @param bounder The class reference of the service that is binding the service (if bound directly to the container, this should be undefined)
+   */
+  public bind<T extends typeof Service<any> & { ID: string }>(
+    service: T,
+    bounder: ((typeof Service<T>) & { ID: string }) | undefined = undefined
+  ): InstanceType<T> {
+    // We need to store the current container in a variable so that we can restore it after the bind operation
+    const oldCurrentContainer = currentContainer;
+    currentContainer = this;
+
+    // If the service is already bound, return the existing instance
+    if (this.hasBound(service)) {
+      this.event$.next({
+        type: 'SERVICE_BIND',
+        boundeeID: service.ID,
+        bounderID: bounder?.ID // Return the bounder ID if it is defined, else assume its the container
+      })
+
+      return this.boundMap.get(service.ID) as InstanceType<T> // Casted as InstanceType<T> because service IDs and types are expected to match
+    }
+
+    // Detect circular dependency and throw error
+    if (this.bindStack.findIndex((serviceID) => serviceID === service.ID) !== -1) {
+      const circularServices = `${this.bindStack.join(' -> ')} -> ${service.ID}`
+
+      throw new Error(`Circular dependency detected.\nChain: ${circularServices}`)
+    }
+
+    // Push the service ID onto the bind stack to detect circular dependencies
+    this.bindStack.push(service.ID)
+
+    // Initialize the service and emit events
+
+    // NOTE: We need to cast the service to any as TypeScript thinks that the service is abstract
+    const instance: Service<any> = new (service as any)()
+
+    this.boundMap.set(service.ID, instance)
+
+    this.bindStack.pop()
+
+    this.event$.next({
+      type: 'SERVICE_INIT',
+      serviceID: service.ID,
+    })
+
+    this.event$.next({
+      type: 'SERVICE_BIND',
+      boundeeID: service.ID,
+      bounderID: bounder?.ID
+    })
+
+
+    // Restore the current container
+    currentContainer = oldCurrentContainer;
+
+    // We expect the return type to match the service definition
+    return instance as InstanceType<T>
+  }
+
+  /**
+   * Returns an iterator of the currently bound service IDs and their instances
+   */
+  public getBoundServices(): IterableIterator<[string, Service<any>]> {
+    return this.boundMap.entries()
+  }
+
+  /**
+   * Returns the public container event stream
+   */
+  public getEventStream(): Observable<ContainerEvent> {
+    return this.event$.asObservable()
+  }
+}
--- a/packages/dioc/lib/main.ts
+++ b/packages/dioc/lib/main.ts
@@ -0,0 +1,2 @@
+export * from "./container"
+export * from "./service"
--- a/packages/dioc/lib/service.ts
+++ b/packages/dioc/lib/service.ts
@@ -0,0 +1,65 @@
+import { Observable, Subject } from 'rxjs'
+import { Container, currentContainer } from './container'
+
+/**
+ * A Dioc service that can bound to a container and can bind dependency services.
+ *
+ * NOTE: Services cannot have a constructor that takes arguments.
+ *
+ * @template EventDef The type of events that can be emitted by the service. These will be accessible by event streams
+ */
+export abstract class Service<EventDef = {}> {
+
+  /**
+   * The internal event stream of the service
+   */
+  private event$ = new Subject<EventDef>()
+
+  /** The container the service is bound to */
+  #container: Container
+
+  constructor() {
+    if (!currentContainer) {
+      throw new Error(
+        `Tried to initialize service with no container (ID: ${ (this.constructor as any).ID })`
+      )
+    }
+
+    this.#container = currentContainer
+  }
+
+  /**
+   * Binds a dependency service into this service.
+   * @param service The class reference of the service to bind
+   */
+  protected bind<T extends typeof Service<any> & { ID: string }>(service: T): InstanceType<T> {
+    if (!currentContainer) {
+      throw new Error('No currentContainer defined.')
+    }
+
+    return currentContainer.bind(service, this.constructor as typeof Service<any> & { ID: string })
+  }
+
+  /**
+   * Returns the container the service is bound to
+   */
+  protected getContainer(): Container {
+    return this.#container
+  }
+
+  /**
+   * Emits an event on the service's event stream
+   * @param event The event to emit
+   */
+  protected emit(event: EventDef) {
+    this.event$.next(event)
+  }
+
+  /**
+   * Returns the event stream of the service
+   */
+  public getEventStream(): Observable<EventDef> {
+
+    return this.event$.asObservable()
+  }
+}
--- a/packages/dioc/lib/testing.ts
+++ b/packages/dioc/lib/testing.ts
@@ -0,0 +1,33 @@
+import { Container, Service } from "./main";
+
+/**
+ * A container that can be used for writing tests, contains additional methods
+ * for binding suitable for writing tests. (see `bindMock`).
+ */
+export class TestContainer extends Container {
+
+  /**
+   * Binds a mock service to the container.
+   *
+   * @param service
+   * @param mock
+   */
+  public bindMock<
+    T extends typeof Service<any> & { ID: string },
+    U extends Partial<InstanceType<T>>
+  >(service: T, mock: U): U {
+    if (this.boundMap.has(service.ID)) {
+      throw new Error(`Service '${service.ID}' already bound to container. Did you already call bindMock on this ?`)
+    }
+
+    this.boundMap.set(service.ID, mock as any)
+
+    this.event$.next({
+      type: "SERVICE_BIND",
+      boundeeID: service.ID,
+      bounderID: undefined,
+    })
+
+    return mock
+  }
+}
--- a/packages/dioc/lib/vue.ts
+++ b/packages/dioc/lib/vue.ts
@@ -0,0 +1,34 @@
+import { Plugin, inject } from "vue"
+import { Container } from "./container"
+import { Service } from "./service"
+
+const VUE_CONTAINER_KEY = Symbol()
+
+// TODO: Some Vue version issue with plugin generics is breaking type checking
+/**
+ * The Vue Dioc Plugin, this allows the composables to work and access the container
+ *
+ * NOTE: Make sure you add `vue` as dependency to be able to use this plugin (duh)
+ */
+export const diocPlugin: Plugin = {
+  install(app, { container }) {
+    app.provide(VUE_CONTAINER_KEY, container)
+  }
+}
+
+/**
+ * A composable that binds a service to a Vue Component
+ *
+ * @param service The class reference of the service to bind
+ */
+export function useService<
+  T extends typeof Service<any> & { ID: string }
+>(service: T): InstanceType<T> {
+  const container = inject(VUE_CONTAINER_KEY) as Container | undefined | null
+
+  if (!container) {
+    throw new Error("Container not found, did you forget to install the dioc plugin?")
+  }
+
+  return container.bind(service)
+}
--- a/packages/dioc/package.json
+++ b/packages/dioc/package.json
@@ -0,0 +1,54 @@
+{
+  "name": "dioc",
+  "private": true,
+  "version": "0.1.0",
+  "type": "module",
+  "files": [
+    "dist",
+    "index.d.ts"
+  ],
+  "main": "./dist/counter.umd.cjs",
+  "module": "./dist/counter.js",
+  "types": "./index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/main.d.ts",
+      "require": "./dist/index.cjs",
+      "import": "./dist/index.js"
+    },
+    "./vue": {
+      "types": "./dist/vue.d.ts",
+      "require": "./dist/vue.cjs",
+      "import": "./dist/vue.js"
+    },
+    "./testing": {
+      "types": "./dist/testing.d.ts",
+      "require": "./dist/testing.cjs",
+      "import": "./dist/testing.js"
+    }
+  },
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build && tsc --emitDeclarationOnly",
+    "prepare": "pnpm run build",
+    "test": "vitest run",
+    "do-test": "pnpm run test",
+    "test:watch": "vitest"
+  },
+  "devDependencies": {
+    "typescript": "^4.9.4",
+    "vite": "^4.0.4",
+    "vitest": "^0.29.3"
+  },
+  "dependencies": {
+    "rxjs": "^7.8.1"
+  },
+  "peerDependencies": {
+    "vue": "^3.2.25"
+  },
+  "peerDependenciesMeta": {
+    "vue": {
+      "optional": true
+    }
+  }
+}
--- a/packages/dioc/test/container.spec.ts
+++ b/packages/dioc/test/container.spec.ts
@@ -0,0 +1,262 @@
+import { it, expect, describe, vi } from "vitest"
+import { Service } from "../lib/service"
+import { Container, currentContainer, ContainerEvent } from "../lib/container"
+
+class TestServiceA extends Service {
+  public static ID = "TestServiceA"
+}
+
+class TestServiceB extends Service {
+  public static ID = "TestServiceB"
+
+  // Marked public to allow for testing
+  public readonly serviceA = this.bind(TestServiceA)
+}
+
+describe("Container", () => {
+  describe("getBoundServiceWithID", () => {
+    it("returns the service instance if it is bound to the container", () => {
+      const container = new Container()
+
+      const service = container.bind(TestServiceA)
+
+      expect(container.getBoundServiceWithID(TestServiceA.ID)).toBe(service)
+    })
+
+    it("returns undefined if the service is not bound to the container", () => {
+      const container = new Container()
+
+      expect(container.getBoundServiceWithID(TestServiceA.ID)).toBeUndefined()
+    })
+  })
+
+  describe("bind", () => {
+    it("correctly binds the service to it", () => {
+      const container = new Container()
+
+      const service = container.bind(TestServiceA)
+
+      // @ts-expect-error getContainer is defined as a protected property, but we are leveraging it here to check
+      expect(service.getContainer()).toBe(container)
+    })
+
+    it("after bind, the current container is set back to its previous value", () => {
+      const originalValue = currentContainer
+
+      const container = new Container()
+      container.bind(TestServiceA)
+
+      expect(currentContainer).toBe(originalValue)
+    })
+
+    it("dependent services are registered in the same container", () => {
+      const container = new Container()
+
+      const serviceB = container.bind(TestServiceB)
+
+      // @ts-expect-error getContainer is defined as a protected property, but we are leveraging it here to check
+      expect(serviceB.serviceA.getContainer()).toBe(container)
+    })
+
+    it("binding an already initialized service returns the initialized instance (services are singletons)", () => {
+      const container = new Container()
+
+      const serviceA = container.bind(TestServiceA)
+      const serviceA2 = container.bind(TestServiceA)
+
+      expect(serviceA).toBe(serviceA2)
+    })
+
+    it("binding a service which is a dependency of another service returns the same instance created from the dependency resolution (services are singletons)", () => {
+      const container = new Container()
+
+      const serviceB = container.bind(TestServiceB)
+      const serviceA = container.bind(TestServiceA)
+
+      expect(serviceB.serviceA).toBe(serviceA)
+    })
+
+    it("binding an initialized service as a dependency returns the same instance", () => {
+      const container = new Container()
+
+      const serviceA = container.bind(TestServiceA)
+      const serviceB = container.bind(TestServiceB)
+
+      expect(serviceB.serviceA).toBe(serviceA)
+    })
+
+    it("container emits an init event when an uninitialized service is initialized via bind and event only called once", () => {
+      const container = new Container()
+
+      const serviceFunc = vi.fn<
+        [ContainerEvent & { type: "SERVICE_INIT" }],
+        void
+      >()
+
+      container.getEventStream().subscribe((ev) => {
+        if (ev.type === "SERVICE_INIT") {
+          serviceFunc(ev)
+        }
+      })
+
+      const instance = container.bind(TestServiceA)
+
+      expect(serviceFunc).toHaveBeenCalledOnce()
+      expect(serviceFunc).toHaveBeenCalledWith(<ContainerEvent>{
+        type: "SERVICE_INIT",
+        serviceID: TestServiceA.ID,
+      })
+    })
+
+    it("the bind event emitted has an undefined bounderID when the service is bound directly to the container", () => {
+      const container = new Container()
+
+      const serviceFunc = vi.fn<
+        [ContainerEvent & { type: "SERVICE_BIND" }],
+        void
+      >()
+
+      container.getEventStream().subscribe((ev) => {
+        if (ev.type === "SERVICE_BIND") {
+          serviceFunc(ev)
+        }
+      })
+
+      container.bind(TestServiceA)
+
+      expect(serviceFunc).toHaveBeenCalledOnce()
+      expect(serviceFunc).toHaveBeenCalledWith(<ContainerEvent>{
+        type: "SERVICE_BIND",
+        boundeeID: TestServiceA.ID,
+        bounderID: undefined,
+      })
+    })
+
+    it("the bind event emitted has the correct bounderID when the service is bound to another service", () => {
+      const container = new Container()
+
+      const serviceFunc = vi.fn<
+        [ContainerEvent & { type: "SERVICE_BIND" }],
+        void
+      >()
+
+      container.getEventStream().subscribe((ev) => {
+        // We only care about the bind event of TestServiceA
+        if (ev.type === "SERVICE_BIND" && ev.boundeeID === TestServiceA.ID) {
+          serviceFunc(ev)
+        }
+      })
+
+      container.bind(TestServiceB)
+
+      expect(serviceFunc).toHaveBeenCalledOnce()
+      expect(serviceFunc).toHaveBeenCalledWith(<ContainerEvent>{
+        type: "SERVICE_BIND",
+        boundeeID: TestServiceA.ID,
+        bounderID: TestServiceB.ID,
+      })
+    })
+  })
+
+  describe("hasBound", () => {
+    it("returns true if the given service is bound to the container", () => {
+      const container = new Container()
+
+      container.bind(TestServiceA)
+
+      expect(container.hasBound(TestServiceA)).toEqual(true)
+    })
+
+    it("returns false if the given service is not bound to the container", () => {
+      const container = new Container()
+
+      expect(container.hasBound(TestServiceA)).toEqual(false)
+    })
+
+    it("returns true when the service is bound because it is a dependency of another service", () => {
+      const container = new Container()
+
+      container.bind(TestServiceB)
+
+      expect(container.hasBound(TestServiceA)).toEqual(true)
+    })
+  })
+
+  describe("getEventStream", () => {
+    it("returns an observable which emits events correctly when services are initialized", () => {
+      const container = new Container()
+
+      const serviceFunc = vi.fn<
+        [ContainerEvent & { type: "SERVICE_INIT" }],
+        void
+      >()
+
+      container.getEventStream().subscribe((ev) => {
+        if (ev.type === "SERVICE_INIT") {
+          serviceFunc(ev)
+        }
+      })
+
+      container.bind(TestServiceB)
+
+      expect(serviceFunc).toHaveBeenCalledTimes(2)
+      expect(serviceFunc).toHaveBeenNthCalledWith(1, <ContainerEvent>{
+        type: "SERVICE_INIT",
+        serviceID: TestServiceA.ID,
+      })
+      expect(serviceFunc).toHaveBeenNthCalledWith(2, <ContainerEvent>{
+        type: "SERVICE_INIT",
+        serviceID: TestServiceB.ID,
+      })
+    })
+
+    it("returns an observable which emits events correctly when services are bound", () => {
+      const container = new Container()
+
+      const serviceFunc = vi.fn<
+        [ContainerEvent & { type: "SERVICE_BIND" }],
+        void
+      >()
+
+      container.getEventStream().subscribe((ev) => {
+        if (ev.type === "SERVICE_BIND") {
+          serviceFunc(ev)
+        }
+      })
+
+      container.bind(TestServiceB)
+
+      expect(serviceFunc).toHaveBeenCalledTimes(2)
+      expect(serviceFunc).toHaveBeenNthCalledWith(1, <ContainerEvent>{
+        type: "SERVICE_BIND",
+        boundeeID: TestServiceA.ID,
+        bounderID: TestServiceB.ID,
+      })
+      expect(serviceFunc).toHaveBeenNthCalledWith(2, <ContainerEvent>{
+        type: "SERVICE_BIND",
+        boundeeID: TestServiceB.ID,
+        bounderID: undefined,
+      })
+    })
+  })
+
+  describe("getBoundServices", () => {
+    it("returns an iterator over all services bound to the container in the format [service id, service instance]", () => {
+      const container = new Container()
+
+      const instanceB = container.bind(TestServiceB)
+      const instanceA = instanceB.serviceA
+
+      expect(Array.from(container.getBoundServices())).toEqual([
+        [TestServiceA.ID, instanceA],
+        [TestServiceB.ID, instanceB],
+      ])
+    })
+
+    it("returns an empty iterator if no services are bound", () => {
+      const container = new Container()
+
+      expect(Array.from(container.getBoundServices())).toEqual([])
+    })
+  })
+})
--- a/packages/dioc/test/service.spec.ts
+++ b/packages/dioc/test/service.spec.ts
@@ -0,0 +1,66 @@
+import { describe, expect, it, vi } from "vitest"
+import { Service, Container } from "../lib/main"
+
+class TestServiceA extends Service {
+  public static ID = "TestServiceA"
+}
+
+class TestServiceB extends Service<"test"> {
+  public static ID = "TestServiceB"
+
+  // Marked public to allow for testing
+  public readonly serviceA = this.bind(TestServiceA)
+
+  public emitTestEvent() {
+    this.emit("test")
+  }
+}
+
+describe("Service", () => {
+  describe("constructor", () => {
+    it("throws an error if the service is initialized without a container", () => {
+      expect(() => new TestServiceA()).toThrowError(
+        "Tried to initialize service with no container (ID: TestServiceA)"
+      )
+    })
+  })
+
+  describe("bind", () => {
+    it("correctly binds the dependency service using the container", () => {
+      const container = new Container()
+
+      const serviceA = container.bind(TestServiceA)
+
+      const serviceB = container.bind(TestServiceB)
+      expect(serviceB.serviceA).toBe(serviceA)
+    })
+  })
+
+  describe("getContainer", () => {
+    it("returns the container the service is bound to", () => {
+      const container = new Container()
+
+      const serviceA = container.bind(TestServiceA)
+
+      // @ts-expect-error getContainer is a protected member, we are just using it to help with testing
+      expect(serviceA.getContainer()).toBe(container)
+    })
+  })
+
+  describe("getEventStream", () => {
+    it("returns the valid event stream of the service", () => {
+      const container = new Container()
+
+      const serviceB = container.bind(TestServiceB)
+
+      const serviceFunc = vi.fn()
+
+      serviceB.getEventStream().subscribe(serviceFunc)
+
+      serviceB.emitTestEvent()
+
+      expect(serviceFunc).toHaveBeenCalledOnce()
+      expect(serviceFunc).toHaveBeenCalledWith("test")
+    })
+  })
+})
--- a/packages/dioc/test/test-container.spec.ts
+++ b/packages/dioc/test/test-container.spec.ts
@@ -0,0 +1,92 @@
+import { describe, expect, it, vi } from "vitest"
+import { TestContainer } from "../lib/testing"
+import { Service } from "../lib/service"
+import { ContainerEvent } from "../lib/container"
+
+class TestServiceA extends Service {
+  public static ID = "TestServiceA"
+
+  public test() {
+    return "real"
+  }
+}
+
+class TestServiceB extends Service {
+  public static ID = "TestServiceB"
+
+  // declared public to help with testing
+  public readonly serviceA = this.bind(TestServiceA)
+
+  public test() {
+    return this.serviceA.test()
+  }
+}
+
+describe("TestContainer", () => {
+  describe("bindMock", () => {
+    it("returns the fake service defined", () => {
+      const container = new TestContainer()
+
+      const fakeService = {
+        test: () => "fake",
+      }
+
+      const result = container.bindMock(TestServiceA, fakeService)
+
+      expect(result).toBe(fakeService)
+    })
+
+    it("new services bound to the container get the mock service", () => {
+      const container = new TestContainer()
+
+      const fakeServiceA = {
+        test: () => "fake",
+      }
+
+      container.bindMock(TestServiceA, fakeServiceA)
+
+      const serviceB = container.bind(TestServiceB)
+
+      expect(serviceB.serviceA).toBe(fakeServiceA)
+    })
+
+    it("container emits SERVICE_BIND event", () => {
+      const container = new TestContainer()
+
+      const fakeServiceA = {
+        test: () => "fake",
+      }
+
+      const serviceFunc = vi.fn<[ContainerEvent, void]>()
+
+      container.getEventStream().subscribe((ev) => {
+        serviceFunc(ev)
+      })
+
+      container.bindMock(TestServiceA, fakeServiceA)
+
+      expect(serviceFunc).toHaveBeenCalledOnce()
+      expect(serviceFunc).toHaveBeenCalledWith(<ContainerEvent>{
+        type: "SERVICE_BIND",
+        boundeeID: TestServiceA.ID,
+        bounderID: undefined,
+      })
+    })
+
+    it("throws if service already bound", () => {
+      const container = new TestContainer()
+
+      const fakeServiceA = {
+        test: () => "fake",
+      }
+
+      container.bindMock(TestServiceA, fakeServiceA)
+
+      expect(() => {
+        container.bindMock(TestServiceA, fakeServiceA)
+      }).toThrowError(
+        "Service 'TestServiceA' already bound to container. Did you already call bindMock on this ?"
+      )
+    })
+  })
+})
--- a/packages/dioc/testing.d.ts
+++ b/packages/dioc/testing.d.ts
@@ -0,0 +1,2 @@
+export { default } from "./dist/testing.d.ts"
+export * from "./dist/testing.d.ts"
--- a/packages/dioc/tsconfig.json
+++ b/packages/dioc/tsconfig.json
@@ -0,0 +1,21 @@
+{
+  "compilerOptions": {
+    "target": "ESNext",
+    "useDefineForClassFields": true,
+    "module": "ESNext",
+    "lib": ["ESNext", "DOM"],
+    "moduleResolution": "Node",
+    "strict": true,
+    "declaration": true,
+    "sourceMap": true,
+    "outDir": "dist",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "esModuleInterop": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noImplicitReturns": true,
+    "skipLibCheck": true
+  },
+  "include": ["lib"]
+}
--- a/packages/dioc/vite.config.ts
+++ b/packages/dioc/vite.config.ts
@@ -0,0 +1,16 @@
+import { defineConfig } from 'vite'
+
+export default defineConfig({
+  build: {
+    lib: {
+      entry: {
+        index: './lib/main.ts',
+        vue: './lib/vue.ts',
+        testing: './lib/testing.ts',
+      },
+    },
+    rollupOptions: {
+      external: ['vue'],
+    }
+  },
+})
--- a/packages/dioc/vitest.config.ts
+++ b/packages/dioc/vitest.config.ts
@@ -0,0 +1,7 @@
+import { defineConfig } from "vitest/config"
+
+export default defineConfig({
+  test: {
+
+  }
+})
--- a/packages/dioc/vue.d.ts
+++ b/packages/dioc/vue.d.ts
@@ -0,0 +1,2 @@
+export { default } from "./dist/vue.d.ts"
+export * from "./dist/vue.d.ts"
--- a/packages/hoppscotch-backend/backend.Caddyfile
+++ b/packages/hoppscotch-backend/backend.Caddyfile
@@ -0,0 +1,3 @@
+:80 :3170 {
+	reverse_proxy localhost:8080
+}
--- a/packages/hoppscotch-backend/package.json
+++ b/packages/hoppscotch-backend/package.json
@@ -1,6 +1,6 @@
 {
  "name": "hoppscotch-backend",
-  "version": "2023.4.5",
+  "version": "2023.8.4-1",
  "description": "",
  "author": "",
  "private": true,
@@ -24,18 +24,17 @@
    "do-test": "pnpm run test"
  },
  "dependencies": {
-    "@nestjs-modules/mailer": "^1.8.1",
-    "@nestjs/apollo": "^10.1.6",
-    "@nestjs/common": "^9.2.1",
-    "@nestjs/core": "^9.2.1",
-    "@nestjs/graphql": "^10.1.6",
-    "@nestjs/jwt": "^10.0.1",
-    "@nestjs/passport": "^9.0.0",
-    "@nestjs/platform-express": "^9.2.1",
-    "@nestjs/throttler": "^4.0.0",
-    "@prisma/client": "^4.7.1",
-    "apollo-server-express": "^3.11.1",
-    "apollo-server-plugin-base": "^3.7.1",
+    "@apollo/server": "^4.9.4",
+    "@nestjs-modules/mailer": "^1.9.1",
+    "@nestjs/apollo": "^12.0.9",
+    "@nestjs/common": "^10.2.6",
+    "@nestjs/core": "^10.2.6",
+    "@nestjs/graphql": "^12.0.9",
+    "@nestjs/jwt": "^10.1.1",
+    "@nestjs/passport": "^10.0.2",
+    "@nestjs/platform-express": "^10.2.6",
+    "@nestjs/throttler": "^5.0.0",
+    "@prisma/client": "^4.16.2",
    "argon2": "^0.30.3",
    "bcrypt": "^5.1.0",
    "cookie": "^0.5.0",
@@ -43,9 +42,9 @@
    "express": "^4.17.1",
    "express-session": "^1.17.3",
    "fp-ts": "^2.13.1",
-    "graphql": "^15.5.0",
+    "graphql": "^16.8.1",
    "graphql-query-complexity": "^0.12.0",
-    "graphql-redis-subscriptions": "^2.5.0",
+    "graphql-redis-subscriptions": "^2.6.0",
    "graphql-subscriptions": "^2.0.0",
    "handlebars": "^4.7.7",
    "io-ts": "^2.2.16",
@@ -57,15 +56,15 @@
    "passport-jwt": "^4.0.1",
    "passport-local": "^1.0.0",
    "passport-microsoft": "^1.0.0",
-    "prisma": "^4.7.1",
+    "prisma": "^4.16.2",
    "reflect-metadata": "^0.1.13",
    "rimraf": "^3.0.2",
    "rxjs": "^7.6.0"
  },
  "devDependencies": {
-    "@nestjs/cli": "^9.1.5",
-    "@nestjs/schematics": "^9.0.3",
-    "@nestjs/testing": "^9.2.1",
+    "@nestjs/cli": "^10.1.18",
+    "@nestjs/schematics": "^10.0.2",
+    "@nestjs/testing": "^10.2.6",
    "@relmify/jest-fp-ts": "^2.0.2",
    "@types/argon2": "^0.15.0",
    "@types/bcrypt": "^5.0.0",
--- a/packages/hoppscotch-backend/prisma/migrations/20231106120154_embeds_addition/migration.sql
+++ b/packages/hoppscotch-backend/prisma/migrations/20231106120154_embeds_addition/migration.sql
@@ -0,0 +1,15 @@
+/*
+  Warnings:
+
+  - A unique constraint covering the columns `[id]` on the table `Shortcode` will be added. If there are existing duplicate values, this will fail.
+
+*/
+-- AlterTable
+ALTER TABLE "Shortcode" ADD COLUMN     "embedProperties" JSONB,
+ADD COLUMN     "updatedOn" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP;
+
+-- CreateIndex
+CREATE UNIQUE INDEX "Shortcode_id_key" ON "Shortcode"("id");
+
+-- AddForeignKey
+ALTER TABLE "Shortcode" ADD CONSTRAINT "Shortcode_creatorUid_fkey" FOREIGN KEY ("creatorUid") REFERENCES "User"("uid") ON DELETE SET NULL ON UPDATE CASCADE;
--- a/packages/hoppscotch-backend/prisma/migrations/20231130082054_collection_headers/migration.sql
+++ b/packages/hoppscotch-backend/prisma/migrations/20231130082054_collection_headers/migration.sql
@@ -0,0 +1,5 @@
+-- AlterTable
+ALTER TABLE "TeamCollection" ADD COLUMN     "data" JSONB;
+
+-- AlterTable
+ALTER TABLE "UserCollection" ADD COLUMN     "data" JSONB;
--- a/packages/hoppscotch-backend/prisma/schema.prisma
+++ b/packages/hoppscotch-backend/prisma/schema.prisma
@@ -5,7 +5,7 @@ datasource db {

 generator client {
  provider      = "prisma-client-js"
-  binaryTargets = ["native", "debian-openssl-1.1.x"]
+  binaryTargets = ["native", "debian-openssl-1.1.x", "debian-openssl-3.0.x"]
 }

 model Team {
@@ -43,6 +43,7 @@ model TeamInvitation {
 model TeamCollection {
  id         String           @id @default(cuid())
  parentID   String?
+  data       Json?
  parent     TeamCollection?  @relation("TeamCollectionChildParent", fields: [parentID], references: [id])
  children   TeamCollection[] @relation("TeamCollectionChildParent")
  requests   TeamRequest[]
@@ -68,10 +69,13 @@ model TeamRequest {
 }

 model Shortcode {
-  id         String   @id
-  request    Json
-  creatorUid String?
-  createdOn  DateTime @default(now())
+  id              String   @id @unique
+  request         Json
+  embedProperties Json?
+  creatorUid      String?
+  User            User?    @relation(fields: [creatorUid], references: [uid])
+  createdOn       DateTime @default(now())
+  updatedOn       DateTime @default(now()) @updatedAt

  @@unique(fields: [id, creatorUid], name: "creator_uid_shortcode_unique")
 }
@@ -102,6 +106,7 @@ model User {
  currentGQLSession  Json?
  createdOn          DateTime            @default(now()) @db.Timestamp(3)
  invitedUsers       InvitedUsers[]
+  shortcodes         Shortcode[]
 }

 model Account {
@@ -192,6 +197,7 @@ model UserCollection {
  userUid    String
  user       User             @relation(fields: [userUid], references: [uid], onDelete: Cascade)
  title      String
+  data       Json?
  orderIndex Int
  type       ReqType
  createdOn  DateTime         @default(now()) @db.Timestamp(3)
--- a/packages/hoppscotch-backend/prod_run.mjs
+++ b/packages/hoppscotch-backend/prod_run.mjs
@@ -0,0 +1,66 @@
+#!/usr/local/bin/node
+// @ts-check
+
+import { spawn } from 'child_process';
+import process from 'process';
+
+function runChildProcessWithPrefix(command, args, prefix) {
+  const childProcess = spawn(command, args);
+
+  childProcess.stdout.on('data', (data) => {
+    const output = data.toString().trim().split('\n');
+    output.forEach((line) => {
+      console.log(`${prefix} | ${line}`);
+    });
+  });
+
+  childProcess.stderr.on('data', (data) => {
+    const error = data.toString().trim().split('\n');
+    error.forEach((line) => {
+      console.error(`${prefix} | ${line}`);
+    });
+  });
+
+  childProcess.on('close', (code) => {
+    console.log(`${prefix} Child process exited with code ${code}`);
+  });
+
+  childProcess.on('error', (stuff) => {
+    console.error('error');
+    console.error(stuff);
+  });
+
+  return childProcess;
+}
+
+const caddyProcess = runChildProcessWithPrefix(
+  'caddy',
+  ['run', '--config', '/etc/caddy/backend.Caddyfile', '--adapter', 'caddyfile'],
+  'App/Admin Dashboard Caddy',
+);
+const backendProcess = runChildProcessWithPrefix(
+  'pnpm',
+  ['run', 'start:prod'],
+  'Backend Server',
+);
+
+caddyProcess.on('exit', (code) => {
+  console.log(`Exiting process because Caddy Server exited with code ${code}`);
+  process.exit(code);
+});
+
+backendProcess.on('exit', (code) => {
+  console.log(
+    `Exiting process because Backend Server exited with code ${code}`,
+  );
+  process.exit(code);
+});
+
+process.on('SIGINT', () => {
+  console.log('SIGINT received, exiting...');
+
+  caddyProcess.kill('SIGINT');
+  backendProcess.kill('SIGINT');
+
+  process.exit(0);
+});
--- a/packages/hoppscotch-backend/src/admin/admin.model.ts
+++ b/packages/hoppscotch-backend/src/admin/admin.model.ts
@@ -1,4 +1,9 @@
-import { ObjectType } from '@nestjs/graphql';
+import { ObjectType, OmitType } from '@nestjs/graphql';
+import { User } from 'src/user/user.model';

@ObjectType()
-export class Admin {}
+export class Admin extends OmitType(User, [
+  'isAdmin',
+  'currentRESTSession',
+  'currentGQLSession',
+]) {}
--- a/packages/hoppscotch-backend/src/admin/admin.module.ts
+++ b/packages/hoppscotch-backend/src/admin/admin.module.ts
@@ -10,6 +10,8 @@ import { TeamInvitationModule } from '../team-invitation/team-invitation.module'
 import { TeamEnvironmentsModule } from '../team-environments/team-environments.module';
 import { TeamCollectionModule } from '../team-collection/team-collection.module';
 import { TeamRequestModule } from '../team-request/team-request.module';
+import { InfraResolver } from './infra.resolver';
+import { ShortcodeModule } from 'src/shortcode/shortcode.module';

@Module({
  imports: [
@@ -22,8 +24,9 @@ import { TeamRequestModule } from '../team-request/team-request.module';
    TeamEnvironmentsModule,
    TeamCollectionModule,
    TeamRequestModule,
+    ShortcodeModule,
  ],
-  providers: [AdminResolver, AdminService],
+  providers: [InfraResolver, AdminResolver, AdminService],
  exports: [AdminService],
 })
 export class AdminModule {}
--- a/packages/hoppscotch-backend/src/admin/admin.resolver.ts
+++ b/packages/hoppscotch-backend/src/admin/admin.resolver.ts
@@ -21,15 +21,15 @@ import { InvitedUser } from './invited-user.model';
 import { GqlUser } from '../decorators/gql-user.decorator';
 import { PubSubService } from '../pubsub/pubsub.service';
 import { Team, TeamMember } from '../team/team.model';
-import { User } from '../user/user.model';
-import { TeamInvitation } from '../team-invitation/team-invitation.model';
-import { PaginationArgs } from '../types/input-types.args';
 import {
  AddUserToTeamArgs,
  ChangeUserRoleInTeamArgs,
 } from './input-types.args';
 import { GqlThrottlerGuard } from 'src/guards/gql-throttler.guard';
 import { SkipThrottle } from '@nestjs/throttler';
+import { User } from 'src/user/user.model';
+import { PaginationArgs } from 'src/types/input-types.args';
+import { TeamInvitation } from 'src/team-invitation/team-invitation.model';

@UseGuards(GqlThrottlerGuard)
@Resolver(() => Admin)
@@ -51,6 +51,7 @@ export class AdminResolver {

  @ResolveField(() => [User], {
    description: 'Returns a list of all admin users in infra',
+    deprecationReason: 'Use `infra` query instead',
  })
  @UseGuards(GqlAuthGuard, GqlAdminGuard)
  async admins() {
@@ -59,6 +60,7 @@ export class AdminResolver {
  }
  @ResolveField(() => User, {
    description: 'Returns a user info by UID',
+    deprecationReason: 'Use `infra` query instead',
  })
  @UseGuards(GqlAuthGuard, GqlAdminGuard)
  async userInfo(
@@ -76,6 +78,7 @@ export class AdminResolver {

  @ResolveField(() => [User], {
    description: 'Returns a list of all the users in infra',
+    deprecationReason: 'Use `infra` query instead',
  })
  @UseGuards(GqlAuthGuard, GqlAdminGuard)
  async allUsers(
@@ -88,6 +91,7 @@ export class AdminResolver {

  @ResolveField(() => [InvitedUser], {
    description: 'Returns a list of all the invited users',
+    deprecationReason: 'Use `infra` query instead',
  })
  async invitedUsers(@Parent() admin: Admin): Promise<InvitedUser[]> {
    const users = await this.adminService.fetchInvitedUsers();
@@ -96,6 +100,7 @@ export class AdminResolver {

  @ResolveField(() => [Team], {
    description: 'Returns a list of all the teams in the infra',
+    deprecationReason: 'Use `infra` query instead',
  })
  async allTeams(
    @Parent() admin: Admin,
@@ -106,6 +111,7 @@ export class AdminResolver {
  }
  @ResolveField(() => Team, {
    description: 'Returns a team info by ID when requested by Admin',
+    deprecationReason: 'Use `infra` query instead',
  })
  async teamInfo(
    @Parent() admin: Admin,
@@ -123,6 +129,7 @@ export class AdminResolver {

  @ResolveField(() => Number, {
    description: 'Return count of all the members in a team',
+    deprecationReason: 'Use `infra` query instead',
  })
  async membersCountInTeam(
    @Parent() admin: Admin,
@@ -140,6 +147,7 @@ export class AdminResolver {

  @ResolveField(() => Number, {
    description: 'Return count of all the stored collections in a team',
+    deprecationReason: 'Use `infra` query instead',
  })
  async collectionCountInTeam(
    @Parent() admin: Admin,
@@ -155,6 +163,7 @@ export class AdminResolver {
  }
  @ResolveField(() => Number, {
    description: 'Return count of all the stored requests in a team',
+    deprecationReason: 'Use `infra` query instead',
  })
  async requestCountInTeam(
    @Parent() admin: Admin,
@@ -171,6 +180,7 @@ export class AdminResolver {

  @ResolveField(() => Number, {
    description: 'Return count of all the stored environments in a team',
+    deprecationReason: 'Use `infra` query instead',
  })
  async environmentCountInTeam(
    @Parent() admin: Admin,
@@ -187,6 +197,7 @@ export class AdminResolver {

  @ResolveField(() => [TeamInvitation], {
    description: 'Return all the pending invitations in a team',
+    deprecationReason: 'Use `infra` query instead',
  })
  async pendingInvitationCountInTeam(
    @Parent() admin: Admin,
@@ -205,6 +216,7 @@ export class AdminResolver {

  @ResolveField(() => Number, {
    description: 'Return total number of Users in organization',
+    deprecationReason: 'Use `infra` query instead',
  })
  async usersCount() {
    return this.adminService.getUsersCount();
@@ -212,6 +224,7 @@ export class AdminResolver {

  @ResolveField(() => Number, {
    description: 'Return total number of Teams in organization',
+    deprecationReason: 'Use `infra` query instead',
  })
  async teamsCount() {
    return this.adminService.getTeamsCount();
@@ -219,6 +232,7 @@ export class AdminResolver {

  @ResolveField(() => Number, {
    description: 'Return total number of Team Collections in organization',
+    deprecationReason: 'Use `infra` query instead',
  })
  async teamCollectionsCount() {
    return this.adminService.getTeamCollectionsCount();
@@ -226,6 +240,7 @@ export class AdminResolver {

  @ResolveField(() => Number, {
    description: 'Return total number of Team Requests in organization',
+    deprecationReason: 'Use `infra` query instead',
  })
  async teamRequestsCount() {
    return this.adminService.getTeamRequestsCount();
@@ -411,6 +426,40 @@ export class AdminResolver {
    return deletedTeam.right;
  }

+  @Mutation(() => Boolean, {
+    description: 'Revoke a team Invite by Invite ID',
+  })
+  @UseGuards(GqlAuthGuard, GqlAdminGuard)
+  async revokeTeamInviteByAdmin(
+    @Args({
+      name: 'inviteID',
+      description: 'Team Invite ID',
+      type: () => ID,
+    })
+    inviteID: string,
+  ): Promise<boolean> {
+    const invite = await this.adminService.revokeTeamInviteByID(inviteID);
+    if (E.isLeft(invite)) throwErr(invite.left);
+    return true;
+  }
+
+  @Mutation(() => Boolean, {
+    description: 'Revoke Shortcode by ID',
+  })
+  @UseGuards(GqlAuthGuard, GqlAdminGuard)
+  async revokeShortcodeByAdmin(
+    @Args({
+      name: 'code',
+      description: 'The shortcode to delete',
+      type: () => ID,
+    })
+    code: string,
+  ): Promise<boolean> {
+    const res = await this.adminService.deleteShortcode(code);
+    if (E.isLeft(res)) throwErr(res.left);
+    return true;
+  }
+
  /* Subscriptions */

  @Subscription(() => InvitedUser, {
--- a/packages/hoppscotch-backend/src/admin/admin.service.spec.ts
+++ b/packages/hoppscotch-backend/src/admin/admin.service.spec.ts
@@ -15,6 +15,7 @@ import {
  INVALID_EMAIL,
  USER_ALREADY_INVITED,
 } from '../errors';
+import { ShortcodeService } from 'src/shortcode/shortcode.service';

 const mockPrisma = mockDeep<PrismaService>();
 const mockPubSub = mockDeep<PubSubService>();
@@ -25,6 +26,7 @@ const mockTeamRequestService = mockDeep<TeamRequestService>();
 const mockTeamInvitationService = mockDeep<TeamInvitationService>();
 const mockTeamCollectionService = mockDeep<TeamCollectionService>();
 const mockMailerService = mockDeep<MailerService>();
+const mockShortcodeService = mockDeep<ShortcodeService>();

 const adminService = new AdminService(
  mockUserService,
@@ -36,6 +38,7 @@ const adminService = new AdminService(
  mockPubSub as any,
  mockPrisma as any,
  mockMailerService,
+  mockShortcodeService,
 );

 const invitedUsers: InvitedUsers[] = [
--- a/packages/hoppscotch-backend/src/admin/admin.service.ts
+++ b/packages/hoppscotch-backend/src/admin/admin.service.ts
@@ -11,6 +11,7 @@ import {
  INVALID_EMAIL,
  ONLY_ONE_ADMIN_ACCOUNT,
  TEAM_INVITE_ALREADY_MEMBER,
+  TEAM_INVITE_NO_INVITE_FOUND,
  USER_ALREADY_INVITED,
  USER_IS_ADMIN,
  USER_NOT_FOUND,
@@ -23,6 +24,7 @@ import { TeamRequestService } from '../team-request/team-request.service';
 import { TeamEnvironmentsService } from '../team-environments/team-environments.service';
 import { TeamInvitationService } from '../team-invitation/team-invitation.service';
 import { TeamMemberRole } from '../team/team.model';
+import { ShortcodeService } from 'src/shortcode/shortcode.service';

@Injectable()
 export class AdminService {
@@ -36,6 +38,7 @@ export class AdminService {
    private readonly pubsub: PubSubService,
    private readonly prisma: PrismaService,
    private readonly mailerService: MailerService,
+    private readonly shortcodeService: ShortcodeService,
  ) {}

  /**
@@ -73,7 +76,7 @@ export class AdminService {

    try {
      await this.mailerService.sendUserInvitationEmail(inviteeEmail, {
-        template: 'code-your-own',
+        template: 'user-invitation',
        variables: {
          inviteeEmail: inviteeEmail,
          magicLink: `${process.env.VITE_BASE_URL}`,
@@ -181,7 +184,7 @@ export class AdminService {
   * @returns an array team invitations
   */
  async pendingInvitationCountInTeam(teamID: string) {
-    const invitations = await this.teamInvitationService.getAllTeamInvitations(
+    const invitations = await this.teamInvitationService.getTeamInvitations(
      teamID,
    );

@@ -236,11 +239,11 @@ export class AdminService {
    const user = await this.userService.findUserByEmail(userEmail);
    if (O.isNone(user)) return E.left(USER_NOT_FOUND);

-    const isUserAlreadyMember = await this.teamService.getTeamMemberTE(
+    const teamMember = await this.teamService.getTeamMemberTE(
      teamID,
      user.value.uid,
    )();
-    if (E.left(isUserAlreadyMember)) {
+    if (E.isLeft(teamMember)) {
      const addedUser = await this.teamService.addMemberToTeamWithEmail(
        teamID,
        userEmail,
@@ -248,6 +251,18 @@ export class AdminService {
      );
      if (E.isLeft(addedUser)) return E.left(addedUser.left);

+      const userInvitation =
+        await this.teamInvitationService.getTeamInviteByEmailAndTeamID(
+          userEmail,
+          teamID,
+        );
+
+      if (E.isRight(userInvitation)) {
+        await this.teamInvitationService.revokeInvitation(
+          userInvitation.right.id,
+        );
+      }
+
      return E.right(addedUser.right);
    }

@@ -404,4 +419,50 @@ export class AdminService {
    if (E.isLeft(team)) return E.left(team.left);
    return E.right(team.right);
  }
+
+  /**
+   * Revoke a team invite by ID
+   * @param inviteID Team Invite ID
+   * @returns an Either of boolean or error
+   */
+  async revokeTeamInviteByID(inviteID: string) {
+    const teamInvite = await this.teamInvitationService.revokeInvitation(
+      inviteID,
+    );
+
+    if (E.isLeft(teamInvite)) return E.left(teamInvite.left);
+
+    return E.right(teamInvite.right);
+  }
+
+  /**
+   * Fetch all created ShortCodes
+   *
+   * @param args Pagination arguments
+   * @param userEmail User email
+   * @returns ShortcodeWithUserEmail
+   */
+  async fetchAllShortcodes(
+    cursorID: string,
+    take: number,
+    userEmail: string = null,
+  ) {
+    return this.shortcodeService.fetchAllShortcodes(
+      { cursor: cursorID, take },
+      userEmail,
+    );
+  }
+
+  /**
+   * Delete a Shortcode
+   *
+   * @param shortcodeID ID of Shortcode being deleted
+   * @returns Boolean on successful deletion
+   */
+  async deleteShortcode(shortcodeID: string) {
+    const result = await this.shortcodeService.deleteShortcode(shortcodeID);
+
+    if (E.isLeft(result)) return E.left(result.left);
+    return E.right(result.right);
+  }
 }
--- a/packages/hoppscotch-backend/src/admin/infra.model.ts
+++ b/packages/hoppscotch-backend/src/admin/infra.model.ts
@@ -0,0 +1,10 @@
+import { Field, ObjectType } from '@nestjs/graphql';
+import { Admin } from './admin.model';
+
+@ObjectType()
+export class Infra {
+  @Field(() => Admin, {
+    description: 'Admin who executed the action',
+  })
+  executedBy: Admin;
+}
--- a/packages/hoppscotch-backend/src/admin/infra.resolver.ts
+++ b/packages/hoppscotch-backend/src/admin/infra.resolver.ts
@@ -0,0 +1,225 @@
+import { UseGuards } from '@nestjs/common';
+import { Args, ID, Query, ResolveField, Resolver } from '@nestjs/graphql';
+import { GqlThrottlerGuard } from 'src/guards/gql-throttler.guard';
+import { Infra } from './infra.model';
+import { AdminService } from './admin.service';
+import { GqlAuthGuard } from 'src/guards/gql-auth.guard';
+import { GqlAdminGuard } from './guards/gql-admin.guard';
+import { User } from 'src/user/user.model';
+import { AuthUser } from 'src/types/AuthUser';
+import { throwErr } from 'src/utils';
+import * as E from 'fp-ts/Either';
+import { Admin } from './admin.model';
+import { PaginationArgs } from 'src/types/input-types.args';
+import { InvitedUser } from './invited-user.model';
+import { Team } from 'src/team/team.model';
+import { TeamInvitation } from 'src/team-invitation/team-invitation.model';
+import { GqlAdmin } from './decorators/gql-admin.decorator';
+import { ShortcodeWithUserEmail } from 'src/shortcode/shortcode.model';
+
+@UseGuards(GqlThrottlerGuard)
+@Resolver(() => Infra)
+export class InfraResolver {
+  constructor(private adminService: AdminService) {}
+
+  @Query(() => Infra, {
+    description: 'Fetch details of the Infrastructure',
+  })
+  @UseGuards(GqlAuthGuard, GqlAdminGuard)
+  infra(@GqlAdmin() admin: Admin) {
+    const infra: Infra = { executedBy: admin };
+    return infra;
+  }
+
+  @ResolveField(() => [User], {
+    description: 'Returns a list of all admin users in infra',
+  })
+  @UseGuards(GqlAuthGuard, GqlAdminGuard)
+  async admins() {
+    const admins = await this.adminService.fetchAdmins();
+    return admins;
+  }
+
+  @ResolveField(() => User, {
+    description: 'Returns a user info by UID',
+  })
+  @UseGuards(GqlAuthGuard, GqlAdminGuard)
+  async userInfo(
+    @Args({
+      name: 'userUid',
+      type: () => ID,
+      description: 'The user UID',
+    })
+    userUid: string,
+  ): Promise<AuthUser> {
+    const user = await this.adminService.fetchUserInfo(userUid);
+    if (E.isLeft(user)) throwErr(user.left);
+    return user.right;
+  }
+
+  @ResolveField(() => [User], {
+    description: 'Returns a list of all the users in infra',
+  })
+  @UseGuards(GqlAuthGuard, GqlAdminGuard)
+  async allUsers(@Args() args: PaginationArgs): Promise<AuthUser[]> {
+    const users = await this.adminService.fetchUsers(args.cursor, args.take);
+    return users;
+  }
+
+  @ResolveField(() => [InvitedUser], {
+    description: 'Returns a list of all the invited users',
+  })
+  async invitedUsers(): Promise<InvitedUser[]> {
+    const users = await this.adminService.fetchInvitedUsers();
+    return users;
+  }
+
+  @ResolveField(() => [Team], {
+    description: 'Returns a list of all the teams in the infra',
+  })
+  async allTeams(@Args() args: PaginationArgs): Promise<Team[]> {
+    const teams = await this.adminService.fetchAllTeams(args.cursor, args.take);
+    return teams;
+  }
+
+  @ResolveField(() => Team, {
+    description: 'Returns a team info by ID when requested by Admin',
+  })
+  async teamInfo(
+    @Args({
+      name: 'teamID',
+      type: () => ID,
+      description: 'Team ID for which info to fetch',
+    })
+    teamID: string,
+  ): Promise<Team> {
+    const team = await this.adminService.getTeamInfo(teamID);
+    if (E.isLeft(team)) throwErr(team.left);
+    return team.right;
+  }
+
+  @ResolveField(() => Number, {
+    description: 'Return count of all the members in a team',
+  })
+  async membersCountInTeam(
+    @Args({
+      name: 'teamID',
+      type: () => ID,
+      description: 'Team ID for which team members to fetch',
+      nullable: false,
+    })
+    teamID: string,
+  ): Promise<number> {
+    const teamMembersCount = await this.adminService.membersCountInTeam(teamID);
+    return teamMembersCount;
+  }
+
+  @ResolveField(() => Number, {
+    description: 'Return count of all the stored collections in a team',
+  })
+  async collectionCountInTeam(
+    @Args({
+      name: 'teamID',
+      type: () => ID,
+      description: 'Team ID for which team members to fetch',
+    })
+    teamID: string,
+  ): Promise<number> {
+    const teamCollCount = await this.adminService.collectionCountInTeam(teamID);
+    return teamCollCount;
+  }
+
+  @ResolveField(() => Number, {
+    description: 'Return count of all the stored requests in a team',
+  })
+  async requestCountInTeam(
+    @Args({
+      name: 'teamID',
+      type: () => ID,
+      description: 'Team ID for which team members to fetch',
+    })
+    teamID: string,
+  ): Promise<number> {
+    const teamReqCount = await this.adminService.requestCountInTeam(teamID);
+    return teamReqCount;
+  }
+
+  @ResolveField(() => Number, {
+    description: 'Return count of all the stored environments in a team',
+  })
+  async environmentCountInTeam(
+    @Args({
+      name: 'teamID',
+      type: () => ID,
+      description: 'Team ID for which team members to fetch',
+    })
+    teamID: string,
+  ): Promise<number> {
+    const envsCount = await this.adminService.environmentCountInTeam(teamID);
+    return envsCount;
+  }
+
+  @ResolveField(() => [TeamInvitation], {
+    description: 'Return all the pending invitations in a team',
+  })
+  async pendingInvitationCountInTeam(
+    @Args({
+      name: 'teamID',
+      type: () => ID,
+      description: 'Team ID for which team members to fetch',
+    })
+    teamID: string,
+  ) {
+    const invitations = await this.adminService.pendingInvitationCountInTeam(
+      teamID,
+    );
+    return invitations;
+  }
+
+  @ResolveField(() => Number, {
+    description: 'Return total number of Users in organization',
+  })
+  async usersCount() {
+    return this.adminService.getUsersCount();
+  }
+
+  @ResolveField(() => Number, {
+    description: 'Return total number of Teams in organization',
+  })
+  async teamsCount() {
+    return this.adminService.getTeamsCount();
+  }
+
+  @ResolveField(() => Number, {
+    description: 'Return total number of Team Collections in organization',
+  })
+  async teamCollectionsCount() {
+    return this.adminService.getTeamCollectionsCount();
+  }
+
+  @ResolveField(() => Number, {
+    description: 'Return total number of Team Requests in organization',
+  })
+  async teamRequestsCount() {
+    return this.adminService.getTeamRequestsCount();
+  }
+
+  @ResolveField(() => [ShortcodeWithUserEmail], {
+    description: 'Returns a list of all the shortcodes in the infra',
+  })
+  async allShortcodes(
+    @Args() args: PaginationArgs,
+    @Args({
+      name: 'userEmail',
+      nullable: true,
+      description: 'Users email to filter shortcodes by',
+    })
+    userEmail: string,
+  ) {
+    return await this.adminService.fetchAllShortcodes(
+      args.cursor,
+      args.take,
+      userEmail,
+    );
+  }
+}
--- a/packages/hoppscotch-backend/src/app.controller.ts
+++ b/packages/hoppscotch-backend/src/app.controller.ts
@@ -0,0 +1,9 @@
+import { Controller, Get } from '@nestjs/common';
+
+@Controller('ping')
+export class AppController {
+  @Get()
+  ping(): string {
+    return 'Success';
+  }
+}
--- a/packages/hoppscotch-backend/src/app.module.ts
+++ b/packages/hoppscotch-backend/src/app.module.ts
@@ -19,6 +19,7 @@ import { UserCollectionModule } from './user-collection/user-collection.module';
 import { ShortcodeModule } from './shortcode/shortcode.module';
 import { COOKIES_NOT_FOUND } from './errors';
 import { ThrottlerModule } from '@nestjs/throttler';
+import { AppController } from './app.controller';

@Module({
  imports: [
@@ -26,12 +27,7 @@ import { ThrottlerModule } from '@nestjs/throttler';
      buildSchemaOptions: {
        numberScalarMode: 'integer',
      },
-      cors: {
-        origin: process.env.WHITELISTED_ORIGINS.split(','),
-        credentials: true,
-      },
      playground: process.env.PRODUCTION !== 'true',
-      debug: process.env.PRODUCTION !== 'true',
      autoSchemaFile: true,
      installSubscriptionHandlers: true,
      subscriptions: {
@@ -61,10 +57,12 @@ import { ThrottlerModule } from '@nestjs/throttler';
      }),
      driver: ApolloDriver,
    }),
-    ThrottlerModule.forRoot({
-      ttl: +process.env.RATE_LIMIT_TTL,
-      limit: +process.env.RATE_LIMIT_MAX,
-    }),
+    ThrottlerModule.forRoot([
+      {
+        ttl: +process.env.RATE_LIMIT_TTL,
+        limit: +process.env.RATE_LIMIT_MAX,
+      },
+    ]),
    UserModule,
    AuthModule,
    AdminModule,
@@ -81,5 +79,6 @@ import { ThrottlerModule } from '@nestjs/throttler';
    ShortcodeModule,
  ],
  providers: [GQLComplexityPlugin],
+  controllers: [AppController],
 })
 export class AppModule {}
--- a/packages/hoppscotch-backend/src/auth/auth.controller.ts
+++ b/packages/hoppscotch-backend/src/auth/auth.controller.ts
@@ -2,9 +2,9 @@ import {
  Body,
  Controller,
  Get,
+  InternalServerErrorException,
  Post,
  Query,
-  Req,
  Request,
  Res,
  UseGuards,
@@ -19,12 +19,18 @@ import { JwtAuthGuard } from './guards/jwt-auth.guard';
 import { GqlUser } from 'src/decorators/gql-user.decorator';
 import { AuthUser } from 'src/types/AuthUser';
 import { RTCookie } from 'src/decorators/rt-cookie.decorator';
-import { authCookieHandler, throwHTTPErr } from './helper';
+import {
+  AuthProvider,
+  authCookieHandler,
+  authProviderCheck,
+  throwHTTPErr,
+} from './helper';
 import { GoogleSSOGuard } from './guards/google-sso.guard';
 import { GithubSSOGuard } from './guards/github-sso.guard';
 import { MicrosoftSSOGuard } from './guards/microsoft-sso-.guard';
 import { ThrottlerBehindProxyGuard } from 'src/guards/throttler-behind-proxy.guard';
 import { SkipThrottle } from '@nestjs/throttler';
+import { AUTH_PROVIDER_NOT_SPECIFIED } from 'src/errors';

@UseGuards(ThrottlerBehindProxyGuard)
@Controller({ path: 'auth', version: '1' })
@@ -39,6 +45,9 @@ export class AuthController {
    @Body() authData: SignInMagicDto,
    @Query('origin') origin: string,
  ) {
+    if (!authProviderCheck(AuthProvider.EMAIL))
+      throwHTTPErr({ message: AUTH_PROVIDER_NOT_SPECIFIED, statusCode: 404 });
+
    const deviceIdToken = await this.authService.signInMagicLink(
      authData.email,
      origin,
--- a/packages/hoppscotch-backend/src/auth/auth.module.ts
+++ b/packages/hoppscotch-backend/src/auth/auth.module.ts
@@ -11,6 +11,7 @@ import { RTJwtStrategy } from './strategies/rt-jwt.strategy';
 import { GoogleStrategy } from './strategies/google.strategy';
 import { GithubStrategy } from './strategies/github.strategy';
 import { MicrosoftStrategy } from './strategies/microsoft.strategy';
+import { AuthProvider, authProviderCheck } from './helper';

@Module({
  imports: [
@@ -26,9 +27,9 @@ import { MicrosoftStrategy } from './strategies/microsoft.strategy';
    AuthService,
    JwtStrategy,
    RTJwtStrategy,
-    GoogleStrategy,
-    GithubStrategy,
-    MicrosoftStrategy,
+    ...(authProviderCheck(AuthProvider.GOOGLE) ? [GoogleStrategy] : []),
+    ...(authProviderCheck(AuthProvider.GITHUB) ? [GithubStrategy] : []),
+    ...(authProviderCheck(AuthProvider.MICROSOFT) ? [MicrosoftStrategy] : []),
  ],
  controllers: [AuthController],
 })
--- a/packages/hoppscotch-backend/src/auth/auth.service.ts
+++ b/packages/hoppscotch-backend/src/auth/auth.service.ts
@@ -228,8 +228,8 @@ export class AuthService {
        url = process.env.VITE_BASE_URL;
    }

-    await this.mailerService.sendAuthEmail(email, {
-      template: 'code-your-own',
+    await this.mailerService.sendEmail(email, {
+      template: 'user-invitation',
      variables: {
        inviteeEmail: email,
        magicLink: `${url}/enter?token=${generatedTokens.token}`,
--- a/packages/hoppscotch-backend/src/auth/guards/github-sso.guard.ts
+++ b/packages/hoppscotch-backend/src/auth/guards/github-sso.guard.ts
@@ -1,8 +1,20 @@
-import { ExecutionContext, Injectable } from '@nestjs/common';
+import { CanActivate, ExecutionContext, Injectable } from '@nestjs/common';
 import { AuthGuard } from '@nestjs/passport';
+import { AuthProvider, authProviderCheck, throwHTTPErr } from '../helper';
+import { Observable } from 'rxjs';
+import { AUTH_PROVIDER_NOT_SPECIFIED } from 'src/errors';

@Injectable()
-export class GithubSSOGuard extends AuthGuard('github') {
+export class GithubSSOGuard extends AuthGuard('github') implements CanActivate {
+  canActivate(
+    context: ExecutionContext,
+  ): boolean | Promise<boolean> | Observable<boolean> {
+    if (!authProviderCheck(AuthProvider.GITHUB))
+      throwHTTPErr({ message: AUTH_PROVIDER_NOT_SPECIFIED, statusCode: 404 });
+
+    return super.canActivate(context);
+  }
+
  getAuthenticateOptions(context: ExecutionContext) {
    const req = context.switchToHttp().getRequest();

--- a/packages/hoppscotch-backend/src/auth/guards/google-sso.guard.ts
+++ b/packages/hoppscotch-backend/src/auth/guards/google-sso.guard.ts
@@ -1,8 +1,20 @@
-import { ExecutionContext, Injectable } from '@nestjs/common';
+import { CanActivate, ExecutionContext, Injectable } from '@nestjs/common';
 import { AuthGuard } from '@nestjs/passport';
+import { AuthProvider, authProviderCheck, throwHTTPErr } from '../helper';
+import { Observable } from 'rxjs';
+import { AUTH_PROVIDER_NOT_SPECIFIED } from 'src/errors';

@Injectable()
-export class GoogleSSOGuard extends AuthGuard('google') {
+export class GoogleSSOGuard extends AuthGuard('google') implements CanActivate {
+  canActivate(
+    context: ExecutionContext,
+  ): boolean | Promise<boolean> | Observable<boolean> {
+    if (!authProviderCheck(AuthProvider.GOOGLE))
+      throwHTTPErr({ message: AUTH_PROVIDER_NOT_SPECIFIED, statusCode: 404 });
+
+    return super.canActivate(context);
+  }
+
  getAuthenticateOptions(context: ExecutionContext) {
    const req = context.switchToHttp().getRequest();

--- a/packages/hoppscotch-backend/src/auth/guards/microsoft-sso-.guard.ts
+++ b/packages/hoppscotch-backend/src/auth/guards/microsoft-sso-.guard.ts
@@ -1,8 +1,26 @@
-import { ExecutionContext, Injectable } from '@nestjs/common';
+import { CanActivate, ExecutionContext, Injectable } from '@nestjs/common';
 import { AuthGuard } from '@nestjs/passport';
+import { AuthProvider, authProviderCheck, throwHTTPErr } from '../helper';
+import { Observable } from 'rxjs';
+import { AUTH_PROVIDER_NOT_SPECIFIED } from 'src/errors';

@Injectable()
-export class MicrosoftSSOGuard extends AuthGuard('microsoft') {
+export class MicrosoftSSOGuard
+  extends AuthGuard('microsoft')
+  implements CanActivate
+{
+  canActivate(
+    context: ExecutionContext,
+  ): boolean | Promise<boolean> | Observable<boolean> {
+    if (!authProviderCheck(AuthProvider.MICROSOFT))
+      throwHTTPErr({
+        message: AUTH_PROVIDER_NOT_SPECIFIED,
+        statusCode: 404,
+      });
+
+    return super.canActivate(context);
+  }
+
  getAuthenticateOptions(context: ExecutionContext) {
    const req = context.switchToHttp().getRequest();

--- a/packages/hoppscotch-backend/src/auth/helper.ts
+++ b/packages/hoppscotch-backend/src/auth/helper.ts
@@ -1,10 +1,11 @@
-import { ForbiddenException, HttpException, HttpStatus } from '@nestjs/common';
+import { HttpException, HttpStatus } from '@nestjs/common';
 import { DateTime } from 'luxon';
 import { AuthError } from 'src/types/AuthError';
 import { AuthTokens } from 'src/types/AuthTokens';
 import { Response } from 'express';
 import * as cookie from 'cookie';
-import { COOKIES_NOT_FOUND } from 'src/errors';
+import { AUTH_PROVIDER_NOT_SPECIFIED, COOKIES_NOT_FOUND } from 'src/errors';
+import { throwErr } from 'src/utils';

 enum AuthTokenType {
  ACCESS_TOKEN = 'access_token',
@@ -16,6 +17,13 @@ export enum Origin {
  APP = 'app',
 }

+export enum AuthProvider {
+  GOOGLE = 'GOOGLE',
+  GITHUB = 'GITHUB',
+  MICROSOFT = 'MICROSOFT',
+  EMAIL = 'EMAIL',
+}
+
 /**
 * This function allows throw to be used as an expression
 * @param errMessage Message present in the error message
@@ -97,3 +105,25 @@ export const subscriptionContextCookieParser = (rawCookies: string) => {
    refresh_token: cookies[AuthTokenType.REFRESH_TOKEN],
  };
 };
+
+/**
+ * Check to see if given auth provider is present in the VITE_ALLOWED_AUTH_PROVIDERS env variable
+ *
+ * @param provider Provider we want to check the presence of
+ * @returns Boolean if provider specified is present or not
+ */
+export function authProviderCheck(provider: string) {
+  if (!provider) {
+    throwErr(AUTH_PROVIDER_NOT_SPECIFIED);
+  }
+
+  const envVariables = process.env.VITE_ALLOWED_AUTH_PROVIDERS
+    ? process.env.VITE_ALLOWED_AUTH_PROVIDERS.split(',').map((provider) =>
+        provider.trim().toUpperCase(),
+      )
+    : [];
+
+  if (!envVariables.includes(provider.toUpperCase())) return false;
+
+  return true;
+}
--- a/packages/hoppscotch-backend/src/auth/strategies/microsoft.strategy.ts
+++ b/packages/hoppscotch-backend/src/auth/strategies/microsoft.strategy.ts
@@ -17,7 +17,7 @@ export class MicrosoftStrategy extends PassportStrategy(Strategy) {
      clientSecret: process.env.MICROSOFT_CLIENT_SECRET,
      callbackURL: process.env.MICROSOFT_CALLBACK_URL,
      scope: [process.env.MICROSOFT_SCOPE],
-      passReqToCallback: true,
+      tenant: process.env.MICROSOFT_TENANT,
      store: true,
    });
  }
--- a/packages/hoppscotch-backend/src/errors.ts
+++ b/packages/hoppscotch-backend/src/errors.ts
@@ -23,7 +23,31 @@ export const AUTH_FAIL = 'auth/fail';
 export const JSON_INVALID = 'json_invalid';

 /**
- * Tried to delete an user data document from fb firestore but failed.
+ * Auth Provider not specified
+ * (Auth)
+ */
+export const AUTH_PROVIDER_NOT_SPECIFIED = 'auth/provider_not_specified';
+
+/**
+ * Environment variable "VITE_ALLOWED_AUTH_PROVIDERS" is not present in .env file
+ */
+export const ENV_NOT_FOUND_KEY_AUTH_PROVIDERS =
+  '"VITE_ALLOWED_AUTH_PROVIDERS" is not present in .env file';
+
+/**
+ * Environment variable "VITE_ALLOWED_AUTH_PROVIDERS" is empty in .env file
+ */
+export const ENV_EMPTY_AUTH_PROVIDERS =
+  '"VITE_ALLOWED_AUTH_PROVIDERS" is empty in .env file';
+
+/**
+ * Environment variable "VITE_ALLOWED_AUTH_PROVIDERS" contains unsupported provider in .env file
+ */
+export const ENV_NOT_SUPPORT_AUTH_PROVIDERS =
+  '"VITE_ALLOWED_AUTH_PROVIDERS" contains an unsupported auth provider in .env file';
+
+/**
+ * Tried to delete a user data document from fb firestore but failed.
 * (FirebaseService)
 */
 export const USER_FB_DOCUMENT_DELETION_FAILED =
@@ -231,7 +255,14 @@ export const TEAM_COLL_INVALID_JSON = 'team_coll/invalid_json';
 export const TEAM_NOT_OWNER = 'team_coll/team_not_owner' as const;

 /**
- * Tried to perform action on a request that doesn't accept their member role level
+ * The Team Collection data is not valid
+ * (TeamCollectionService)
+ */
+export const TEAM_COLL_DATA_INVALID =
+  'team_coll/team_coll_data_invalid' as const;
+
+/**
+ * Tried to perform an action on a request that doesn't accept their member role level
 * (GqlRequestTeamMemberGuard)
 */
 export const TEAM_REQ_NOT_REQUIRED_ROLE = 'team_req/not_required_role';
@@ -262,7 +293,7 @@ export const TEAM_REQ_REORDERING_FAILED = 'team_req/reordering_failed' as const;
 export const SENDER_EMAIL_INVALID = 'mailer/sender_email_invalid' as const;

 /**
- * Tried to perform action on a request when the user is not even member of the team
+ * Tried to perform an action on a request when the user is not even a member of the team
 * (GqlRequestTeamMemberGuard, GqlCollectionTeamMemberGuard)
 */
 export const TEAM_REQ_NOT_MEMBER = 'team_req/not_member';
@@ -295,23 +326,18 @@ export const TEAM_INVITATION_NOT_FOUND =
 export const SHORTCODE_NOT_FOUND = 'shortcode/not_found' as const;

 /**
- * Invalid ShortCode format
- * (ShortcodeService)
- */
-export const SHORTCODE_INVALID_JSON = 'shortcode/invalid_json' as const;
-
-/**
- * ShortCode already exists in DB
- * (ShortcodeService)
- */
-export const SHORTCODE_ALREADY_EXISTS = 'shortcode/already_exists' as const;
-
-/**
- * Invalid or non-existent TEAM ENVIRONMMENT ID
+ * Invalid or non-existent TEAM ENVIRONMENT ID
 * (TeamEnvironmentsService)
 */
 export const TEAM_ENVIRONMENT_NOT_FOUND = 'team_environment/not_found' as const;

+/**
+ * Invalid TEAM ENVIRONMENT name
+ * (TeamEnvironmentsService)
+ */
+export const TEAM_ENVIRONMENT_SHORT_NAME =
+  'team_environment/short_name' as const;
+
 /**
 * The user is not a member of the team of the given environment
 * (GqlTeamEnvTeamGuard)
@@ -340,7 +366,7 @@ export const USER_SETTINGS_NULL_SETTINGS =
  'user_settings/null_settings' as const;

 /*
- * Global environment doesnt exists for the user
+ * Global environment doesn't exist for the user
 * (UserEnvironmentsService)
 */
 export const USER_ENVIRONMENT_GLOBAL_ENV_DOES_NOT_EXISTS =
@@ -566,6 +592,13 @@ export const USER_COLL_REORDERING_FAILED =
 export const USER_COLL_SAME_NEXT_COLL =
  'user_coll/user_collection_and_next_user_collection_are_same' as const;

+/**
+ * The User Collection data is not valid
+ * (UserCollectionService)
+ */
+export const USER_COLL_DATA_INVALID =
+  'user_coll/user_coll_data_invalid' as const;
+
 /**
 * The User Collection does not belong to the logged-in user
 * (UserCollectionService)
@@ -590,3 +623,24 @@ export const MAILER_SMTP_URL_UNDEFINED = 'mailer/smtp_url_undefined' as const;
 */
 export const MAILER_FROM_ADDRESS_UNDEFINED =
  'mailer/from_address_undefined' as const;
+
+/**
+ * SharedRequest invalid request JSON format
+ * (ShortcodeService)
+ */
+export const SHORTCODE_INVALID_REQUEST_JSON =
+  'shortcode/request_invalid_format' as const;
+
+/**
+ * SharedRequest invalid properties JSON format
+ * (ShortcodeService)
+ */
+export const SHORTCODE_INVALID_PROPERTIES_JSON =
+  'shortcode/properties_invalid_format' as const;
+
+/**
+ * SharedRequest invalid properties not found
+ * (ShortcodeService)
+ */
+export const SHORTCODE_PROPERTIES_NOT_FOUND =
+  'shortcode/properties_not_found' as const;
--- a/packages/hoppscotch-backend/src/gql-schema.ts
+++ b/packages/hoppscotch-backend/src/gql-schema.ts
@@ -27,6 +27,7 @@ import { UserRequestUserCollectionResolver } from './user-request/resolvers/user
 import { UserEnvsUserResolver } from './user-environment/user.resolver';
 import { UserHistoryUserResolver } from './user-history/user.resolver';
 import { UserSettingsUserResolver } from './user-settings/user.resolver';
+import { InfraResolver } from './admin/infra.resolver';

 /**
 * All the resolvers present in the application.
@@ -34,6 +35,7 @@ import { UserSettingsUserResolver } from './user-settings/user.resolver';
 * NOTE: This needs to be KEPT UP-TO-DATE to keep the schema accurate
 */
 const RESOLVERS = [
+  InfraResolver,
  AdminResolver,
  ShortcodeResolver,
  TeamResolver,
@@ -93,9 +95,7 @@ export async function emitGQLSchemaFile() {
      numberScalarMode: 'integer',
    });

-    const schemaString = printSchema(schema, {
-      commentDescriptions: true,
-    });
+    const schemaString = printSchema(schema);

    logger.log(`Writing schema to GQL_SCHEMA_EMIT_LOCATION (${destination})`);

--- a/packages/hoppscotch-backend/src/guards/throttler-behind-proxy.guard.ts
+++ b/packages/hoppscotch-backend/src/guards/throttler-behind-proxy.guard.ts
@@ -3,8 +3,7 @@ import { Injectable } from '@nestjs/common';

@Injectable()
 export class ThrottlerBehindProxyGuard extends ThrottlerGuard {
-  protected getTracker(req: Record<string, any>): string {
+  protected async getTracker(req: Record<string, any>): Promise<string> {
    return req.ips.length ? req.ips[0] : req.ip; // individualize IP extraction to meet your own needs
-    // learn more: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Forwarded-For#directives
  }
 }
--- a/packages/hoppscotch-backend/src/mailer/MailDescriptions.ts
+++ b/packages/hoppscotch-backend/src/mailer/MailDescriptions.ts
@@ -8,7 +8,7 @@ export type MailDescription = {
 };

 export type UserMagicLinkMailDescription = {
-  template: 'code-your-own';
+  template: 'user-invitation';
  variables: {
    inviteeEmail: string;
    magicLink: string;
@@ -16,7 +16,7 @@ export type UserMagicLinkMailDescription = {
 };

 export type AdminUserInvitationMailDescription = {
-  template: 'code-your-own';
+  template: 'user-invitation';
  variables: {
    inviteeEmail: string;
    magicLink: string;
--- a/packages/hoppscotch-backend/src/mailer/mailer.service.ts
+++ b/packages/hoppscotch-backend/src/mailer/mailer.service.ts
@@ -5,7 +5,6 @@ import {
  UserMagicLinkMailDescription,
 } from './MailDescriptions';
 import { throwErr } from 'src/utils';
-import * as TE from 'fp-ts/TaskEither';
 import { EMAIL_FAILED } from 'src/errors';
 import { MailerService as NestMailerService } from '@nestjs-modules/mailer';

@@ -28,40 +27,21 @@ export class MailerService {
      case 'team-invitation':
        return `${mailDesc.variables.invitee} invited you to join ${mailDesc.variables.invite_team_name} in Hoppscotch`;

-      case 'code-your-own':
+      case 'user-invitation':
        return 'Sign in to Hoppscotch';
    }
  }

  /**
   * Sends an email to the given email address given a mail description
-   * @param to The email address to be sent to (NOTE: this is not validated)
+   * @param to Receiver's email id
   * @param mailDesc Definition of what email to be sent
+   * @returns Response if email was send successfully or not
   */
-  sendMail(
+  async sendEmail(
    to: string,
    mailDesc: MailDescription | UserMagicLinkMailDescription,
  ) {
-    return TE.tryCatch(
-      async () => {
-        await this.nestMailerService.sendMail({
-          to,
-          template: mailDesc.template,
-          subject: this.resolveSubjectForMailDesc(mailDesc),
-          context: mailDesc.variables,
-        });
-      },
-      () => EMAIL_FAILED,
-    );
-  }
-
-  /**
-   *
-   * @param to Receiver's email id
-   * @param mailDesc Details of email to be sent for Magic-Link auth
-   * @returns Response if email was send successfully or not
-   */
-  async sendAuthEmail(to: string, mailDesc: UserMagicLinkMailDescription) {
    try {
      await this.nestMailerService.sendMail({
        to,
--- a/packages/hoppscotch-backend/src/mailer/templates/team-invitation.hbs
+++ b/packages/hoppscotch-backend/src/mailer/templates/team-invitation.hbs
@@ -14,7 +14,7 @@
  -->
    <style type="text/css" rel="stylesheet" media="all">
    /* Base ------------------------------ */
-    
+
    @import url("https://fonts.googleapis.com/css?family=Nunito+Sans:400,700&display=swap");
    body {
      width: 100% !important;
@@ -22,19 +22,19 @@
      margin: 0;
      -webkit-text-size-adjust: none;
    }
-    
+
    a {
      color: #3869D4;
    }
-    
+
    a img {
      border: none;
    }
-    
+
    td {
      word-break: break-word;
    }
-    
+
    .preheader {
      display: none !important;
      visibility: hidden;
@@ -47,13 +47,13 @@
      overflow: hidden;
    }
    /* Type ------------------------------ */
-    
+
    body,
    td,
    th {
      font-family: "Nunito Sans", Helvetica, Arial, sans-serif;
    }
-    
+
    h1 {
      margin-top: 0;
      color: #333333;
@@ -61,7 +61,7 @@
      font-weight: bold;
      text-align: left;
    }
-    
+
    h2 {
      margin-top: 0;
      color: #333333;
@@ -69,7 +69,7 @@
      font-weight: bold;
      text-align: left;
    }
-    
+
    h3 {
      margin-top: 0;
      color: #333333;
@@ -77,12 +77,12 @@
      font-weight: bold;
      text-align: left;
    }
-    
+
    td,
    th {
      font-size: 16px;
    }
-    
+
    p,
    ul,
    ol,
@@ -91,25 +91,25 @@
      font-size: 16px;
      line-height: 1.625;
    }
-    
+
    p.sub {
      font-size: 13px;
    }
    /* Utilities ------------------------------ */
-    
+
    .align-right {
      text-align: right;
    }
-    
+
    .align-left {
      text-align: left;
    }
-    
+
    .align-center {
      text-align: center;
    }
    /* Buttons ------------------------------ */
-    
+
    .button {
      background-color: #3869D4;
      border-top: 10px solid #3869D4;
@@ -124,7 +124,7 @@
      -webkit-text-size-adjust: none;
      box-sizing: border-box;
    }
-    
+
    .button--green {
      background-color: #22BC66;
      border-top: 10px solid #22BC66;
@@ -132,7 +132,7 @@
      border-bottom: 10px solid #22BC66;
      border-left: 18px solid #22BC66;
    }
-    
+
    .button--red {
      background-color: #FF6136;
      border-top: 10px solid #FF6136;
@@ -140,7 +140,7 @@
      border-bottom: 10px solid #FF6136;
      border-left: 18px solid #FF6136;
    }
-    
+
    @media only screen and (max-width: 500px) {
      .button {
        width: 100% !important;
@@ -148,21 +148,21 @@
      }
    }
    /* Attribute list ------------------------------ */
-    
+
    .attributes {
      margin: 0 0 21px;
    }
-    
+
    .attributes_content {
      background-color: #F4F4F7;
      padding: 16px;
    }
-    
+
    .attributes_item {
      padding: 0;
    }
    /* Related Items ------------------------------ */
-    
+
    .related {
      width: 100%;
      margin: 0;
@@ -171,31 +171,31 @@
      -premailer-cellpadding: 0;
      -premailer-cellspacing: 0;
    }
-    
+
    .related_item {
      padding: 10px 0;
      color: #CBCCCF;
      font-size: 15px;
      line-height: 18px;
    }
-    
+
    .related_item-title {
      display: block;
      margin: .5em 0 0;
    }
-    
+
    .related_item-thumb {
      display: block;
      padding-bottom: 10px;
    }
-    
+
    .related_heading {
      border-top: 1px solid #CBCCCF;
      text-align: center;
      padding: 25px 0 10px;
    }
    /* Discount Code ------------------------------ */
-    
+
    .discount {
      width: 100%;
      margin: 0;
@@ -206,33 +206,33 @@
      background-color: #F4F4F7;
      border: 2px dashed #CBCCCF;
    }
-    
+
    .discount_heading {
      text-align: center;
    }
-    
+
    .discount_body {
      text-align: center;
      font-size: 15px;
    }
    /* Social Icons ------------------------------ */
-    
+
    .social {
      width: auto;
    }
-    
+
    .social td {
      padding: 0;
      width: auto;
    }
-    
+
    .social_icon {
      height: 20px;
      margin: 0 8px 10px 8px;
      padding: 0;
    }
    /* Data table ------------------------------ */
-    
+
    .purchase {
      width: 100%;
      margin: 0;
@@ -241,7 +241,7 @@
      -premailer-cellpadding: 0;
      -premailer-cellspacing: 0;
    }
-    
+
    .purchase_content {
      width: 100%;
      margin: 0;
@@ -250,50 +250,50 @@
      -premailer-cellpadding: 0;
      -premailer-cellspacing: 0;
    }
-    
+
    .purchase_item {
      padding: 10px 0;
      color: #51545E;
      font-size: 15px;
      line-height: 18px;
    }
-    
+
    .purchase_heading {
      padding-bottom: 8px;
      border-bottom: 1px solid #EAEAEC;
    }
-    
+
    .purchase_heading p {
      margin: 0;
      color: #85878E;
      font-size: 12px;
    }
-    
+
    .purchase_footer {
      padding-top: 15px;
      border-top: 1px solid #EAEAEC;
    }
-    
+
    .purchase_total {
      margin: 0;
      text-align: right;
      font-weight: bold;
      color: #333333;
    }
-    
+
    .purchase_total--label {
      padding: 0 15px 0 0;
    }
-    
+
    body {
      background-color: #F2F4F6;
      color: #51545E;
    }
-    
+
    p {
      color: #51545E;
    }
-    
+
    .email-wrapper {
      width: 100%;
      margin: 0;
@@ -303,7 +303,7 @@
      -premailer-cellspacing: 0;
      background-color: #F2F4F6;
    }
-    
+
    .email-content {
      width: 100%;
      margin: 0;
@@ -313,16 +313,16 @@
      -premailer-cellspacing: 0;
    }
    /* Masthead ----------------------- */
-    
+
    .email-masthead {
      padding: 25px 0;
      text-align: center;
    }
-    
+
    .email-masthead_logo {
      width: 94px;
    }
-    
+
    .email-masthead_name {
      font-size: 16px;
      font-weight: bold;
@@ -331,7 +331,7 @@
      text-shadow: 0 1px 0 white;
    }
    /* Body ------------------------------ */
-    
+
    .email-body {
      width: 100%;
      margin: 0;
@@ -340,7 +340,7 @@
      -premailer-cellpadding: 0;
      -premailer-cellspacing: 0;
    }
-    
+
    .email-body_inner {
      width: 570px;
      margin: 0 auto;
@@ -350,7 +350,7 @@
      -premailer-cellspacing: 0;
      background-color: #FFFFFF;
    }
-    
+
    .email-footer {
      width: 570px;
      margin: 0 auto;
@@ -360,11 +360,11 @@
      -premailer-cellspacing: 0;
      text-align: center;
    }
-    
+
    .email-footer p {
      color: #A8AAAF;
    }
-    
+
    .body-action {
      width: 100%;
      margin: 30px auto;
@@ -374,25 +374,25 @@
      -premailer-cellspacing: 0;
      text-align: center;
    }
-    
+
    .body-sub {
      margin-top: 25px;
      padding-top: 25px;
      border-top: 1px solid #EAEAEC;
    }
-    
+
    .content-cell {
      padding: 45px;
    }
    /*Media Queries ------------------------------ */
-    
+
    @media only screen and (max-width: 600px) {
      .email-body_inner,
      .email-footer {
        width: 100% !important;
      }
    }
-    
+
    @media (prefers-color-scheme: dark) {
      body,
      .email-body,
--- a/packages/hoppscotch-backend/src/mailer/templates/user-invitation.hbs
+++ b/packages/hoppscotch-backend/src/mailer/templates/user-invitation.hbs
--- a/packages/hoppscotch-backend/src/main.ts
+++ b/packages/hoppscotch-backend/src/main.ts
@@ -5,11 +5,14 @@ import * as cookieParser from 'cookie-parser';
 import { VersioningType } from '@nestjs/common';
 import * as session from 'express-session';
 import { emitGQLSchemaFile } from './gql-schema';
+import { checkEnvironmentAuthProvider } from './utils';

 async function bootstrap() {
  console.log(`Running in production: ${process.env.PRODUCTION}`);
  console.log(`Port: ${process.env.PORT}`);

+  checkEnvironmentAuthProvider();
+
  const app = await NestFactory.create(AppModule);

  app.use(
--- a/packages/hoppscotch-backend/src/plugins/GQLComplexityPlugin.ts
+++ b/packages/hoppscotch-backend/src/plugins/GQLComplexityPlugin.ts
@@ -1,8 +1,9 @@
 import { GraphQLSchemaHost } from '@nestjs/graphql';
 import {
  ApolloServerPlugin,
+  BaseContext,
  GraphQLRequestListener,
-} from 'apollo-server-plugin-base';
+} from '@apollo/server';
 import { Plugin } from '@nestjs/apollo';
 import { GraphQLError } from 'graphql';
 import {
@@ -17,7 +18,7 @@ const COMPLEXITY_LIMIT = 50;
 export class GQLComplexityPlugin implements ApolloServerPlugin {
  constructor(private gqlSchemaHost: GraphQLSchemaHost) {}

-  async requestDidStart(): Promise<GraphQLRequestListener> {
+  async requestDidStart(): Promise<GraphQLRequestListener<BaseContext>> {
    const { schema } = this.gqlSchemaHost;

    return {
--- a/packages/hoppscotch-backend/src/pubsub/topicsDefs.ts
+++ b/packages/hoppscotch-backend/src/pubsub/topicsDefs.ts
@@ -21,8 +21,8 @@ import {
 } from 'src/team-request/team-request.model';
 import { TeamInvitation } from 'src/team-invitation/team-invitation.model';
 import { InvitedUser } from '../admin/invited-user.model';
-import { UserCollection } from '@prisma/client';
 import {
+  UserCollection,
  UserCollectionRemovedData,
  UserCollectionReorderData,
 } from 'src/user-collection/user-collections.model';
@@ -69,5 +69,7 @@ export type TopicDef = {
  [topic: `team_req/${string}/req_deleted`]: string;
  [topic: `team/${string}/invite_added`]: TeamInvitation;
  [topic: `team/${string}/invite_removed`]: string;
-  [topic: `shortcode/${string}/${'created' | 'revoked'}`]: Shortcode;
+  [
+    topic: `shortcode/${string}/${'created' | 'revoked' | 'updated'}`
+  ]: Shortcode;
 };
--- a/packages/hoppscotch-backend/src/shortcode/shortcode.model.ts
+++ b/packages/hoppscotch-backend/src/shortcode/shortcode.model.ts
@@ -1,9 +1,10 @@
 import { Field, ID, ObjectType } from '@nestjs/graphql';
+import { User } from 'src/user/user.model';

@ObjectType()
 export class Shortcode {
  @Field(() => ID, {
-    description: 'The shortcode. 12 digit alphanumeric.',
+    description: 'The 12 digit alphanumeric code',
  })
  id: string;

@@ -12,8 +13,57 @@ export class Shortcode {
  })
  request: string;

+  @Field({
+    description: 'JSON string representing the properties for an embed',
+    nullable: true,
+  })
+  properties: string;
+
  @Field({
    description: 'Timestamp of when the Shortcode was created',
  })
  createdOn: Date;
 }
+
+@ObjectType()
+export class ShortcodeCreator {
+  @Field({
+    description: 'Uid of user who created the shortcode',
+  })
+  uid: string;
+
+  @Field({
+    description: 'Email of user who created the shortcode',
+  })
+  email: string;
+}
+
+@ObjectType()
+export class ShortcodeWithUserEmail {
+  @Field(() => ID, {
+    description: 'The 12 digit alphanumeric code',
+  })
+  id: string;
+
+  @Field({
+    description: 'JSON string representing the request data',
+  })
+  request: string;
+
+  @Field({
+    description: 'JSON string representing the properties for an embed',
+    nullable: true,
+  })
+  properties: string;
+
+  @Field({
+    description: 'Timestamp of when the Shortcode was created',
+  })
+  createdOn: Date;
+
+  @Field({
+    description: 'Details of user who created the shortcode',
+    nullable: true,
+  })
+  creator: ShortcodeCreator;
+}
--- a/packages/hoppscotch-backend/src/shortcode/shortcode.module.ts
+++ b/packages/hoppscotch-backend/src/shortcode/shortcode.module.ts
@@ -1,5 +1,4 @@
 import { Module } from '@nestjs/common';
-import { JwtModule } from '@nestjs/jwt';
 import { PrismaModule } from 'src/prisma/prisma.module';
 import { PubSubModule } from 'src/pubsub/pubsub.module';
 import { UserModule } from 'src/user/user.module';
@@ -7,14 +6,7 @@ import { ShortcodeResolver } from './shortcode.resolver';
 import { ShortcodeService } from './shortcode.service';

@Module({
-  imports: [
-    PrismaModule,
-    UserModule,
-    PubSubModule,
-    JwtModule.register({
-      secret: process.env.JWT_SECRET,
-    }),
-  ],
+  imports: [PrismaModule, UserModule, PubSubModule],
  providers: [ShortcodeService, ShortcodeResolver],
  exports: [ShortcodeService],
 })
--- a/packages/hoppscotch-backend/src/shortcode/shortcode.resolver.ts
+++ b/packages/hoppscotch-backend/src/shortcode/shortcode.resolver.ts
@@ -1,6 +1,5 @@
 import {
  Args,
-  Context,
  ID,
  Mutation,
  Query,
@@ -9,28 +8,25 @@ import {
 } from '@nestjs/graphql';
 import * as E from 'fp-ts/Either';
 import { UseGuards } from '@nestjs/common';
-import { Shortcode } from './shortcode.model';
+import { Shortcode, ShortcodeWithUserEmail } from './shortcode.model';
 import { ShortcodeService } from './shortcode.service';
-import { UserService } from 'src/user/user.service';
 import { throwErr } from 'src/utils';
 import { GqlUser } from 'src/decorators/gql-user.decorator';
 import { GqlAuthGuard } from 'src/guards/gql-auth.guard';
 import { User } from 'src/user/user.model';
 import { PubSubService } from 'src/pubsub/pubsub.service';
 import { AuthUser } from '../types/AuthUser';
-import { JwtService } from '@nestjs/jwt';
 import { PaginationArgs } from 'src/types/input-types.args';
 import { GqlThrottlerGuard } from 'src/guards/gql-throttler.guard';
 import { SkipThrottle } from '@nestjs/throttler';
+import { GqlAdminGuard } from 'src/admin/guards/gql-admin.guard';

@UseGuards(GqlThrottlerGuard)
@Resolver(() => Shortcode)
 export class ShortcodeResolver {
  constructor(
    private readonly shortcodeService: ShortcodeService,
-    private readonly userService: UserService,
    private readonly pubsub: PubSubService,
-    private jwtService: JwtService,
  ) {}

  /* Queries */
@@ -64,20 +60,53 @@ export class ShortcodeResolver {
  @Mutation(() => Shortcode, {
    description: 'Create a shortcode for the given request.',
  })
+  @UseGuards(GqlAuthGuard)
  async createShortcode(
+    @GqlUser() user: AuthUser,
    @Args({
      name: 'request',
      description: 'JSON string of the request object',
    })
    request: string,
-    @Context() ctx: any,
+    @Args({
+      name: 'properties',
+      description: 'JSON string of the properties of the embed',
+      nullable: true,
+    })
+    properties: string,
  ) {
-    const decodedAccessToken = this.jwtService.verify(
-      ctx.req.cookies['access_token'],
-    );
    const result = await this.shortcodeService.createShortcode(
      request,
-      decodedAccessToken?.sub,
+      properties,
+      user,
+    );
+
+    if (E.isLeft(result)) throwErr(result.left);
+    return result.right;
+  }
+
+  @Mutation(() => Shortcode, {
+    description: 'Update a user generated Shortcode',
+  })
+  @UseGuards(GqlAuthGuard)
+  async updateEmbedProperties(
+    @GqlUser() user: AuthUser,
+    @Args({
+      name: 'code',
+      type: () => ID,
+      description: 'The Shortcode to update',
+    })
+    code: string,
+    @Args({
+      name: 'properties',
+      description: 'JSON string of the properties of the embed',
+    })
+    properties: string,
+  ) {
+    const result = await this.shortcodeService.updateEmbedProperties(
+      code,
+      user.uid,
+      properties,
    );

    if (E.isLeft(result)) throwErr(result.left);
@@ -93,7 +122,7 @@ export class ShortcodeResolver {
    @Args({
      name: 'code',
      type: () => ID,
-      description: 'The shortcode to resolve',
+      description: 'The shortcode to remove',
    })
    code: string,
  ) {
@@ -114,6 +143,16 @@ export class ShortcodeResolver {
    return this.pubsub.asyncIterator(`shortcode/${user.uid}/created`);
  }

+  @Subscription(() => Shortcode, {
+    description: 'Listen for Shortcode updates',
+    resolve: (value) => value,
+  })
+  @SkipThrottle()
+  @UseGuards(GqlAuthGuard)
+  myShortcodesUpdated(@GqlUser() user: AuthUser) {
+    return this.pubsub.asyncIterator(`shortcode/${user.uid}/updated`);
+  }
+
  @Subscription(() => Shortcode, {
    description: 'Listen for shortcode deletion',
    resolve: (value) => value,
--- a/packages/hoppscotch-backend/src/shortcode/shortcode.service.spec.ts
+++ b/packages/hoppscotch-backend/src/shortcode/shortcode.service.spec.ts
@@ -1,13 +1,16 @@
 import { mockDeep, mockReset } from 'jest-mock-extended';
 import { PrismaService } from '../prisma/prisma.service';
 import {
-  SHORTCODE_ALREADY_EXISTS,
-  SHORTCODE_INVALID_JSON,
+  INVALID_EMAIL,
+  SHORTCODE_INVALID_PROPERTIES_JSON,
+  SHORTCODE_INVALID_REQUEST_JSON,
  SHORTCODE_NOT_FOUND,
+  SHORTCODE_PROPERTIES_NOT_FOUND,
 } from 'src/errors';
-import { Shortcode } from './shortcode.model';
+import { Shortcode, ShortcodeWithUserEmail } from './shortcode.model';
 import { ShortcodeService } from './shortcode.service';
 import { UserService } from 'src/user/user.service';
+import { AuthUser } from 'src/types/AuthUser';

 const mockPrisma = mockDeep<PrismaService>();

@@ -22,7 +25,7 @@ const mockFB = {
    doc: mockDocFunc,
  },
 };
-const mockUserService = new UserService(mockFB as any, mockPubSub as any);
+const mockUserService = new UserService(mockPrisma as any, mockPubSub as any);

 // eslint-disable-next-line @typescript-eslint/ban-ts-comment
 // @ts-ignore
@@ -38,18 +41,34 @@ beforeEach(() => {
 });
 const createdOn = new Date();

-const shortCodeWithOutUser = {
-  id: '123',
-  request: '{}',
+const user: AuthUser = {
+  uid: '123344',
+  email: 'dwight@dundermifflin.com',
+  displayName: 'Dwight Schrute',
+  photoURL: 'https://en.wikipedia.org/wiki/Dwight_Schrute',
+  isAdmin: false,
+  refreshToken: 'hbfvdkhjbvkdvdfjvbnkhjb',
  createdOn: createdOn,
-  creatorUid: null,
+  currentGQLSession: {},
+  currentRESTSession: {},
 };

-const shortCodeWithUser = {
+const mockEmbed = {
  id: '123',
  request: '{}',
+  embedProperties: '{}',
  createdOn: createdOn,
-  creatorUid: 'user_uid_1',
+  creatorUid: user.uid,
+  updatedOn: createdOn,
+};
+
+const mockShortcode = {
+  id: '123',
+  request: '{}',
+  embedProperties: null,
+  createdOn: createdOn,
+  creatorUid: user.uid,
+  updatedOn: createdOn,
 };

 const shortcodes = [
@@ -58,33 +77,67 @@ const shortcodes = [
    request: {
      hello: 'there',
    },
-    creatorUid: 'testuser',
+    embedProperties: {
+      foo: 'bar',
+    },
+    creatorUid: user.uid,
    createdOn: new Date(),
+    updatedOn: createdOn,
  },
  {
    id: 'blablabla1',
    request: {
      hello: 'there',
    },
-    creatorUid: 'testuser',
+    embedProperties: {
+      foo: 'bar',
+    },
+    creatorUid: user.uid,
    createdOn: new Date(),
+    updatedOn: createdOn,
+  },
+];
+
+const shortcodesWithUserEmail = [
+  {
+    id: 'blablabla',
+    request: {
+      hello: 'there',
+    },
+    embedProperties: {
+      foo: 'bar',
+    },
+    creatorUid: user.uid,
+    createdOn: new Date(),
+    updatedOn: createdOn,
+    User: user,
+  },
+  {
+    id: 'blablabla1',
+    request: {
+      hello: 'there',
+    },
+    embedProperties: {
+      foo: 'bar',
+    },
+    creatorUid: user.uid,
+    createdOn: new Date(),
+    updatedOn: createdOn,
+    User: user,
  },
 ];

 describe('ShortcodeService', () => {
  describe('getShortCode', () => {
-    test('should return a valid shortcode with valid shortcode ID', async () => {
-      mockPrisma.shortcode.findFirstOrThrow.mockResolvedValueOnce(
-        shortCodeWithOutUser,
-      );
+    test('should return a valid Shortcode with valid Shortcode ID', async () => {
+      mockPrisma.shortcode.findFirstOrThrow.mockResolvedValueOnce(mockEmbed);

-      const result = await shortcodeService.getShortCode(
-        shortCodeWithOutUser.id,
-      );
+      const result = await shortcodeService.getShortCode(mockEmbed.id);
      expect(result).toEqualRight(<Shortcode>{
-        id: shortCodeWithOutUser.id,
-        createdOn: shortCodeWithOutUser.createdOn,
-        request: JSON.stringify(shortCodeWithOutUser.request),
+        id: mockEmbed.id,
+        createdOn: mockEmbed.createdOn,
+        request: JSON.stringify(mockEmbed.request),
+        properties: JSON.stringify(mockEmbed.embedProperties),
      });
    });

@@ -99,10 +152,10 @@ describe('ShortcodeService', () => {
  });

  describe('fetchUserShortCodes', () => {
-    test('should return list of shortcodes with valid inputs and no cursor', async () => {
+    test('should return list of Shortcode with valid inputs and no cursor', async () => {
      mockPrisma.shortcode.findMany.mockResolvedValueOnce(shortcodes);

-      const result = await shortcodeService.fetchUserShortCodes('testuser', {
+      const result = await shortcodeService.fetchUserShortCodes(user.uid, {
        cursor: null,
        take: 10,
      });
@@ -110,20 +163,22 @@ describe('ShortcodeService', () => {
        {
          id: shortcodes[0].id,
          request: JSON.stringify(shortcodes[0].request),
+          properties: JSON.stringify(shortcodes[0].embedProperties),
          createdOn: shortcodes[0].createdOn,
        },
        {
          id: shortcodes[1].id,
          request: JSON.stringify(shortcodes[1].request),
+          properties: JSON.stringify(shortcodes[1].embedProperties),
          createdOn: shortcodes[1].createdOn,
        },
      ]);
    });

-    test('should return list of shortcodes with valid inputs and cursor', async () => {
+    test('should return list of Shortcode with valid inputs and cursor', async () => {
      mockPrisma.shortcode.findMany.mockResolvedValue([shortcodes[1]]);

-      const result = await shortcodeService.fetchUserShortCodes('testuser', {
+      const result = await shortcodeService.fetchUserShortCodes(user.uid, {
        cursor: 'blablabla',
        take: 10,
      });
@@ -131,6 +186,7 @@ describe('ShortcodeService', () => {
        {
          id: shortcodes[1].id,
          request: JSON.stringify(shortcodes[1].request),
+          properties: JSON.stringify(shortcodes[1].embedProperties),
          createdOn: shortcodes[1].createdOn,
        },
      ]);
@@ -139,7 +195,7 @@ describe('ShortcodeService', () => {
    test('should return an empty array for an invalid cursor', async () => {
      mockPrisma.shortcode.findMany.mockResolvedValue([]);

-      const result = await shortcodeService.fetchUserShortCodes('testuser', {
+      const result = await shortcodeService.fetchUserShortCodes(user.uid, {
        cursor: 'invalidcursor',
        take: 10,
      });
@@ -171,77 +227,111 @@ describe('ShortcodeService', () => {
  });

  describe('createShortcode', () => {
-    test('should throw SHORTCODE_INVALID_JSON error if incoming request data is invalid', async () => {
+    test('should throw SHORTCODE_INVALID_REQUEST_JSON error if incoming request data is invalid', async () => {
      const result = await shortcodeService.createShortcode(
        'invalidRequest',
-        'user_uid_1',
+        null,
+        user,
      );
-      expect(result).toEqualLeft(SHORTCODE_INVALID_JSON);
+      expect(result).toEqualLeft(SHORTCODE_INVALID_REQUEST_JSON);
    });

-    test('should successfully create a new shortcode with valid user uid', async () => {
-      // generateUniqueShortCodeID --> getShortCode
+    test('should throw SHORTCODE_INVALID_PROPERTIES_JSON error if incoming properties data is invalid', async () => {
+      const result = await shortcodeService.createShortcode(
+        '{}',
+        'invalid_data',
+        user,
+      );
+      expect(result).toEqualLeft(SHORTCODE_INVALID_PROPERTIES_JSON);
+    });
+
+    test('should successfully create a new Embed with valid user uid', async () => {
+      // generateUniqueShortCodeID --> getShortcode
      mockPrisma.shortcode.findFirstOrThrow.mockRejectedValueOnce(
        'NotFoundError',
      );
-      mockPrisma.shortcode.create.mockResolvedValueOnce(shortCodeWithUser);
+      mockPrisma.shortcode.create.mockResolvedValueOnce(mockEmbed);

-      const result = await shortcodeService.createShortcode('{}', 'user_uid_1');
-      expect(result).toEqualRight({
-        id: shortCodeWithUser.id,
-        createdOn: shortCodeWithUser.createdOn,
-        request: JSON.stringify(shortCodeWithUser.request),
+      const result = await shortcodeService.createShortcode('{}', '{}', user);
+      expect(result).toEqualRight(<Shortcode>{
+        id: mockEmbed.id,
+        createdOn: mockEmbed.createdOn,
+        request: JSON.stringify(mockEmbed.request),
+        properties: JSON.stringify(mockEmbed.embedProperties),
      });
    });

-    test('should successfully create a new shortcode with null user uid', async () => {
-      // generateUniqueShortCodeID --> getShortCode
+    test('should successfully create a new ShortCode with valid user uid', async () => {
+      // generateUniqueShortCodeID --> getShortcode
      mockPrisma.shortcode.findFirstOrThrow.mockRejectedValueOnce(
        'NotFoundError',
      );
-      mockPrisma.shortcode.create.mockResolvedValueOnce(shortCodeWithUser);
+      mockPrisma.shortcode.create.mockResolvedValueOnce(mockShortcode);

-      const result = await shortcodeService.createShortcode('{}', null);
-      expect(result).toEqualRight({
-        id: shortCodeWithUser.id,
-        createdOn: shortCodeWithUser.createdOn,
-        request: JSON.stringify(shortCodeWithOutUser.request),
+      const result = await shortcodeService.createShortcode('{}', null, user);
+      expect(result).toEqualRight(<Shortcode>{
+        id: mockShortcode.id,
+        createdOn: mockShortcode.createdOn,
+        request: JSON.stringify(mockShortcode.request),
+        properties: mockShortcode.embedProperties,
      });
    });

-    test('should send pubsub message to `shortcode/{uid}/created` on successful creation of shortcode', async () => {
-      // generateUniqueShortCodeID --> getShortCode
+    test('should send pubsub message to `shortcode/{uid}/created` on successful creation of a Shortcode', async () => {
+      // generateUniqueShortCodeID --> getShortcode
      mockPrisma.shortcode.findFirstOrThrow.mockRejectedValueOnce(
        'NotFoundError',
      );
-      mockPrisma.shortcode.create.mockResolvedValueOnce(shortCodeWithUser);
+      mockPrisma.shortcode.create.mockResolvedValueOnce(mockShortcode);
+
+      const result = await shortcodeService.createShortcode('{}', null, user);

-      const result = await shortcodeService.createShortcode('{}', 'user_uid_1');
      expect(mockPubSub.publish).toHaveBeenCalledWith(
-        `shortcode/${shortCodeWithUser.creatorUid}/created`,
-        {
-          id: shortCodeWithUser.id,
-          createdOn: shortCodeWithUser.createdOn,
-          request: JSON.stringify(shortCodeWithUser.request),
+        `shortcode/${mockShortcode.creatorUid}/created`,
+        <Shortcode>{
+          id: mockShortcode.id,
+          createdOn: mockShortcode.createdOn,
+          request: JSON.stringify(mockShortcode.request),
+          properties: mockShortcode.embedProperties,
+        },
+      );
+    });
+
+    test('should send pubsub message to `shortcode/{uid}/created` on successful creation of an Embed', async () => {
+      // generateUniqueShortCodeID --> getShortcode
+      mockPrisma.shortcode.findFirstOrThrow.mockRejectedValueOnce(
+        'NotFoundError',
+      );
+      mockPrisma.shortcode.create.mockResolvedValueOnce(mockEmbed);
+
+      const result = await shortcodeService.createShortcode('{}', '{}', user);
+
+      expect(mockPubSub.publish).toHaveBeenCalledWith(
+        `shortcode/${mockEmbed.creatorUid}/created`,
+        <Shortcode>{
+          id: mockEmbed.id,
+          createdOn: mockEmbed.createdOn,
+          request: JSON.stringify(mockEmbed.request),
+          properties: JSON.stringify(mockEmbed.embedProperties),
        },
      );
    });
  });

  describe('revokeShortCode', () => {
-    test('should return true on successful deletion of shortcode with valid inputs', async () => {
-      mockPrisma.shortcode.delete.mockResolvedValueOnce(shortCodeWithUser);
+    test('should return true on successful deletion of Shortcode with valid inputs', async () => {
+      mockPrisma.shortcode.delete.mockResolvedValueOnce(mockEmbed);

      const result = await shortcodeService.revokeShortCode(
-        shortCodeWithUser.id,
-        shortCodeWithUser.creatorUid,
+        mockEmbed.id,
+        mockEmbed.creatorUid,
      );

      expect(mockPrisma.shortcode.delete).toHaveBeenCalledWith({
        where: {
          creator_uid_shortcode_unique: {
-            creatorUid: shortCodeWithUser.creatorUid,
-            id: shortCodeWithUser.id,
+            creatorUid: mockEmbed.creatorUid,
+            id: mockEmbed.id,
          },
        },
      });
@@ -249,52 +339,53 @@ describe('ShortcodeService', () => {
      expect(result).toEqualRight(true);
    });

-    test('should return SHORTCODE_NOT_FOUND error when shortcode is invalid and user uid is valid', async () => {
+    test('should return SHORTCODE_NOT_FOUND error when Shortcode is invalid and user uid is valid', async () => {
      mockPrisma.shortcode.delete.mockRejectedValue('RecordNotFound');
      expect(
        shortcodeService.revokeShortCode('invalid', 'testuser'),
      ).resolves.toEqualLeft(SHORTCODE_NOT_FOUND);
    });

-    test('should return SHORTCODE_NOT_FOUND error when shortcode is valid and user uid is invalid', async () => {
+    test('should return SHORTCODE_NOT_FOUND error when Shortcode is valid and user uid is invalid', async () => {
      mockPrisma.shortcode.delete.mockRejectedValue('RecordNotFound');
      expect(
        shortcodeService.revokeShortCode('blablablabla', 'invalidUser'),
      ).resolves.toEqualLeft(SHORTCODE_NOT_FOUND);
    });

-    test('should return SHORTCODE_NOT_FOUND error when both shortcode and user uid are invalid', async () => {
+    test('should return SHORTCODE_NOT_FOUND error when both Shortcode and user uid are invalid', async () => {
      mockPrisma.shortcode.delete.mockRejectedValue('RecordNotFound');
      expect(
        shortcodeService.revokeShortCode('invalid', 'invalid'),
      ).resolves.toEqualLeft(SHORTCODE_NOT_FOUND);
    });

-    test('should send pubsub message to `shortcode/{uid}/revoked` on successful deletion of shortcode', async () => {
-      mockPrisma.shortcode.delete.mockResolvedValueOnce(shortCodeWithUser);
+    test('should send pubsub message to `shortcode/{uid}/revoked` on successful deletion of Shortcode', async () => {
+      mockPrisma.shortcode.delete.mockResolvedValueOnce(mockEmbed);

      const result = await shortcodeService.revokeShortCode(
-        shortCodeWithUser.id,
-        shortCodeWithUser.creatorUid,
+        mockEmbed.id,
+        mockEmbed.creatorUid,
      );

      expect(mockPubSub.publish).toHaveBeenCalledWith(
-        `shortcode/${shortCodeWithUser.creatorUid}/revoked`,
+        `shortcode/${mockEmbed.creatorUid}/revoked`,
        {
-          id: shortCodeWithUser.id,
-          createdOn: shortCodeWithUser.createdOn,
-          request: JSON.stringify(shortCodeWithUser.request),
+          id: mockEmbed.id,
+          createdOn: mockEmbed.createdOn,
+          request: JSON.stringify(mockEmbed.request),
+          properties: JSON.stringify(mockEmbed.embedProperties),
        },
      );
    });
  });

  describe('deleteUserShortCodes', () => {
-    test('should successfully delete all users shortcodes with valid user uid', async () => {
+    test('should successfully delete all users Shortcodes with valid user uid', async () => {
      mockPrisma.shortcode.deleteMany.mockResolvedValueOnce({ count: 1 });

      const result = await shortcodeService.deleteUserShortCodes(
-        shortCodeWithUser.creatorUid,
+        mockEmbed.creatorUid,
      );
      expect(result).toEqual(1);
    });
@@ -303,9 +394,176 @@ describe('ShortcodeService', () => {
      mockPrisma.shortcode.deleteMany.mockResolvedValueOnce({ count: 0 });

      const result = await shortcodeService.deleteUserShortCodes(
-        shortCodeWithUser.creatorUid,
+        mockEmbed.creatorUid,
      );
      expect(result).toEqual(0);
    });
  });
+
+  describe('updateShortcode', () => {
+    test('should return SHORTCODE_PROPERTIES_NOT_FOUND error when updatedProps in invalid', async () => {
+      const result = await shortcodeService.updateEmbedProperties(
+        mockEmbed.id,
+        user.uid,
+        '',
+      );
+      expect(result).toEqualLeft(SHORTCODE_PROPERTIES_NOT_FOUND);
+    });
+
+    test('should return SHORTCODE_PROPERTIES_NOT_FOUND error when updatedProps in invalid JSON format', async () => {
+      const result = await shortcodeService.updateEmbedProperties(
+        mockEmbed.id,
+        user.uid,
+        '{kk',
+      );
+      expect(result).toEqualLeft(SHORTCODE_INVALID_PROPERTIES_JSON);
+    });
+
+    test('should return SHORTCODE_NOT_FOUND error when Shortcode ID is invalid', async () => {
+      mockPrisma.shortcode.update.mockRejectedValue('RecordNotFound');
+      const result = await shortcodeService.updateEmbedProperties(
+        'invalidID',
+        user.uid,
+        '{}',
+      );
+      expect(result).toEqualLeft(SHORTCODE_NOT_FOUND);
+    });
+
+    test('should successfully update a Shortcodes with valid inputs', async () => {
+      mockPrisma.shortcode.update.mockResolvedValueOnce({
+        ...mockEmbed,
+        embedProperties: '{"foo":"bar"}',
+      });
+
+      const result = await shortcodeService.updateEmbedProperties(
+        mockEmbed.id,
+        user.uid,
+        '{"foo":"bar"}',
+      );
+      expect(result).toEqualRight({
+        id: mockEmbed.id,
+        createdOn: mockEmbed.createdOn,
+        request: JSON.stringify(mockEmbed.request),
+        properties: JSON.stringify('{"foo":"bar"}'),
+      });
+    });
+
+    test('should send pubsub message to `shortcode/{uid}/updated` on successful Update of Shortcode', async () => {
+      mockPrisma.shortcode.update.mockResolvedValueOnce({
+        ...mockEmbed,
+        embedProperties: '{"foo":"bar"}',
+      });
+
+      const result = await shortcodeService.updateEmbedProperties(
+        mockEmbed.id,
+        user.uid,
+        '{"foo":"bar"}',
+      );
+
+      expect(mockPubSub.publish).toHaveBeenCalledWith(
+        `shortcode/${mockEmbed.creatorUid}/updated`,
+        {
+          id: mockEmbed.id,
+          createdOn: mockEmbed.createdOn,
+          request: JSON.stringify(mockEmbed.request),
+          properties: JSON.stringify('{"foo":"bar"}'),
+        },
+      );
+    });
+  });
+
+  describe('deleteShortcode', () => {
+    test('should return true on successful deletion of Shortcode with valid inputs', async () => {
+      mockPrisma.shortcode.delete.mockResolvedValueOnce(mockEmbed);
+
+      const result = await shortcodeService.deleteShortcode(mockEmbed.id);
+      expect(result).toEqualRight(true);
+    });
+
+    test('should return SHORTCODE_NOT_FOUND error when Shortcode is invalid', async () => {
+      mockPrisma.shortcode.delete.mockRejectedValue('RecordNotFound');
+
+      expect(shortcodeService.deleteShortcode('invalid')).resolves.toEqualLeft(
+        SHORTCODE_NOT_FOUND,
+      );
+    });
+  });
+
+  describe('fetchAllShortcodes', () => {
+    test('should return list of Shortcodes with valid inputs and no cursor', async () => {
+      mockPrisma.shortcode.findMany.mockResolvedValueOnce(
+        shortcodesWithUserEmail,
+      );
+
+      const result = await shortcodeService.fetchAllShortcodes(
+        {
+          cursor: null,
+          take: 10,
+        },
+        user.email,
+      );
+      expect(result).toEqual(<ShortcodeWithUserEmail[]>[
+        {
+          id: shortcodes[0].id,
+          request: JSON.stringify(shortcodes[0].request),
+          properties: JSON.stringify(shortcodes[0].embedProperties),
+          createdOn: shortcodes[0].createdOn,
+          creator: {
+            uid: user.uid,
+            email: user.email,
+          },
+        },
+        {
+          id: shortcodes[1].id,
+          request: JSON.stringify(shortcodes[1].request),
+          properties: JSON.stringify(shortcodes[1].embedProperties),
+          createdOn: shortcodes[1].createdOn,
+          creator: {
+            uid: user.uid,
+            email: user.email,
+          },
+        },
+      ]);
+    });
+
+    test('should return list of Shortcode with valid inputs and cursor', async () => {
+      mockPrisma.shortcode.findMany.mockResolvedValue([
+        shortcodesWithUserEmail[1],
+      ]);
+
+      const result = await shortcodeService.fetchAllShortcodes(
+        {
+          cursor: 'blablabla',
+          take: 10,
+        },
+        user.email,
+      );
+      expect(result).toEqual(<ShortcodeWithUserEmail[]>[
+        {
+          id: shortcodes[1].id,
+          request: JSON.stringify(shortcodes[1].request),
+          properties: JSON.stringify(shortcodes[1].embedProperties),
+          createdOn: shortcodes[1].createdOn,
+          creator: {
+            uid: user.uid,
+            email: user.email,
+          },
+        },
+      ]);
+    });
+
+    test('should return an empty array for an invalid cursor', async () => {
+      mockPrisma.shortcode.findMany.mockResolvedValue([]);
+
+      const result = await shortcodeService.fetchAllShortcodes(
+        {
+          cursor: 'invalidcursor',
+          take: 10,
+        },
+        user.email,
+      );
+
+      expect(result).toHaveLength(0);
+    });
+  });
 });
--- a/packages/hoppscotch-backend/src/shortcode/shortcode.service.ts
+++ b/packages/hoppscotch-backend/src/shortcode/shortcode.service.ts
@@ -1,12 +1,16 @@
 import { Injectable, OnModuleInit } from '@nestjs/common';
 import * as T from 'fp-ts/Task';
-import * as O from 'fp-ts/Option';
 import * as TO from 'fp-ts/TaskOption';
 import * as E from 'fp-ts/Either';
 import { PrismaService } from 'src/prisma/prisma.service';
-import { SHORTCODE_INVALID_JSON, SHORTCODE_NOT_FOUND } from 'src/errors';
+import {
+  SHORTCODE_INVALID_PROPERTIES_JSON,
+  SHORTCODE_INVALID_REQUEST_JSON,
+  SHORTCODE_NOT_FOUND,
+  SHORTCODE_PROPERTIES_NOT_FOUND,
+} from 'src/errors';
 import { UserDataHandler } from 'src/user/user.data.handler';
-import { Shortcode } from './shortcode.model';
+import { Shortcode, ShortcodeWithUserEmail } from './shortcode.model';
 import { Shortcode as DBShortCode } from '@prisma/client';
 import { PubSubService } from 'src/pubsub/pubsub.service';
 import { UserService } from 'src/user/user.service';
@@ -46,10 +50,14 @@ export class ShortcodeService implements UserDataHandler, OnModuleInit {
   * @param shortcodeInfo Prisma Shortcode type
   * @returns GQL Shortcode
   */
-  private returnShortCode(shortcodeInfo: DBShortCode): Shortcode {
+  private cast(shortcodeInfo: DBShortCode): Shortcode {
    return <Shortcode>{
      id: shortcodeInfo.id,
      request: JSON.stringify(shortcodeInfo.request),
+      properties:
+        shortcodeInfo.embedProperties != null
+          ? JSON.stringify(shortcodeInfo.embedProperties)
+          : null,
      createdOn: shortcodeInfo.createdOn,
    };
  }
@@ -94,7 +102,7 @@ export class ShortcodeService implements UserDataHandler, OnModuleInit {
      const shortcodeInfo = await this.prisma.shortcode.findFirstOrThrow({
        where: { id: shortcode },
      });
-      return E.right(this.returnShortCode(shortcodeInfo));
+      return E.right(this.cast(shortcodeInfo));
    } catch (error) {
      return E.left(SHORTCODE_NOT_FOUND);
    }
@@ -104,14 +112,22 @@ export class ShortcodeService implements UserDataHandler, OnModuleInit {
   * Create a new ShortCode
   *
   * @param request JSON string of request details
-   * @param userUID user UID, if present
+   * @param userInfo user UI
+   * @param properties JSON string of embed properties, if present
   * @returns Either of ShortCode or error
   */
-  async createShortcode(request: string, userUID: string | null) {
-    const shortcodeData = stringToJson(request);
-    if (E.isLeft(shortcodeData)) return E.left(SHORTCODE_INVALID_JSON);
+  async createShortcode(
+    request: string,
+    properties: string | null = null,
+    userInfo: AuthUser,
+  ) {
+    const requestData = stringToJson(request);
+    if (E.isLeft(requestData) || !requestData.right)
+      return E.left(SHORTCODE_INVALID_REQUEST_JSON);

-    const user = await this.userService.findUserById(userUID);
+    const parsedProperties = stringToJson(properties);
+    if (E.isLeft(parsedProperties))
+      return E.left(SHORTCODE_INVALID_PROPERTIES_JSON);

    const generatedShortCode = await this.generateUniqueShortCodeID();
    if (E.isLeft(generatedShortCode)) return E.left(generatedShortCode.left);
@@ -119,8 +135,9 @@ export class ShortcodeService implements UserDataHandler, OnModuleInit {
    const createdShortCode = await this.prisma.shortcode.create({
      data: {
        id: generatedShortCode.right,
-        request: shortcodeData.right,
-        creatorUid: O.isNone(user) ? null : user.value.uid,
+        request: requestData.right,
+        embedProperties: parsedProperties.right ?? undefined,
+        creatorUid: userInfo.uid,
      },
    });

@@ -128,11 +145,11 @@ export class ShortcodeService implements UserDataHandler, OnModuleInit {
    if (createdShortCode.creatorUid) {
      this.pubsub.publish(
        `shortcode/${createdShortCode.creatorUid}/created`,
-        this.returnShortCode(createdShortCode),
+        this.cast(createdShortCode),
      );
    }

-    return E.right(this.returnShortCode(createdShortCode));
+    return E.right(this.cast(createdShortCode));
  }

  /**
@@ -150,20 +167,20 @@ export class ShortcodeService implements UserDataHandler, OnModuleInit {
      orderBy: {
        createdOn: 'desc',
      },
-      skip: 1,
+      skip: args.cursor ? 1 : 0,
      take: args.take,
      cursor: args.cursor ? { id: args.cursor } : undefined,
    });

    const fetchedShortCodes: Shortcode[] = shortCodes.map((code) =>
-      this.returnShortCode(code),
+      this.cast(code),
    );

    return fetchedShortCodes;
  }

  /**
-   * Delete a ShortCode
+   * Delete a ShortCode created by User of uid
   *
   * @param shortcode ShortCode
   * @param uid User Uid
@@ -182,7 +199,7 @@ export class ShortcodeService implements UserDataHandler, OnModuleInit {

      this.pubsub.publish(
        `shortcode/${deletedShortCodes.creatorUid}/revoked`,
-        this.returnShortCode(deletedShortCodes),
+        this.cast(deletedShortCodes),
      );

      return E.right(true);
@@ -205,4 +222,118 @@ export class ShortcodeService implements UserDataHandler, OnModuleInit {

    return deletedShortCodes.count;
  }
+
+  /**
+   * Delete a Shortcode
+   *
+   * @param shortcodeID ID of Shortcode being deleted
+   * @returns Boolean on successful deletion
+   */
+  async deleteShortcode(shortcodeID: string) {
+    try {
+      await this.prisma.shortcode.delete({
+        where: {
+          id: shortcodeID,
+        },
+      });
+
+      return E.right(true);
+    } catch (error) {
+      return E.left(SHORTCODE_NOT_FOUND);
+    }
+  }
+
+  /**
+   * Update a created Shortcode
+   * @param shortcodeID Shortcode ID
+   * @param uid User Uid
+   * @returns Updated Shortcode
+   */
+  async updateEmbedProperties(
+    shortcodeID: string,
+    uid: string,
+    updatedProps: string,
+  ) {
+    if (!updatedProps) return E.left(SHORTCODE_PROPERTIES_NOT_FOUND);
+
+    const parsedProperties = stringToJson(updatedProps);
+    if (E.isLeft(parsedProperties) || !parsedProperties.right)
+      return E.left(SHORTCODE_INVALID_PROPERTIES_JSON);
+
+    try {
+      const updatedShortcode = await this.prisma.shortcode.update({
+        where: {
+          creator_uid_shortcode_unique: {
+            creatorUid: uid,
+            id: shortcodeID,
+          },
+        },
+        data: {
+          embedProperties: parsedProperties.right,
+        },
+      });
+
+      this.pubsub.publish(
+        `shortcode/${updatedShortcode.creatorUid}/updated`,
+        this.cast(updatedShortcode),
+      );
+
+      return E.right(this.cast(updatedShortcode));
+    } catch (error) {
+      return E.left(SHORTCODE_NOT_FOUND);
+    }
+  }
+
+  /**
+   * Fetch all created ShortCodes
+   *
+   * @param args Pagination arguments
+   * @param userEmail User email
+   * @returns ShortcodeWithUserEmail
+   */
+  async fetchAllShortcodes(
+    args: PaginationArgs,
+    userEmail: string | null = null,
+  ) {
+    const shortCodes = await this.prisma.shortcode.findMany({
+      where: userEmail
+        ? {
+            User: {
+              email: userEmail,
+            },
+          }
+        : undefined,
+      orderBy: {
+        createdOn: 'desc',
+      },
+      skip: args.cursor ? 1 : 0,
+      take: args.take,
+      cursor: args.cursor ? { id: args.cursor } : undefined,
+      include: {
+        User: true,
+      },
+    });
+
+    const fetchedShortCodes: ShortcodeWithUserEmail[] = shortCodes.map(
+      (code) => {
+        return <ShortcodeWithUserEmail>{
+          id: code.id,
+          request: JSON.stringify(code.request),
+          properties:
+            code.embedProperties != null
+              ? JSON.stringify(code.embedProperties)
+              : null,
+          createdOn: code.createdOn,
+          creator: code.User
+            ? {
+                uid: code.User.uid,
+                email: code.User.email,
+              }
+            : null,
+        };
+      },
+    );
+
+    return fetchedShortCodes;
+  }
 }
--- a/packages/hoppscotch-backend/src/team-collection/input-type.args.ts
+++ b/packages/hoppscotch-backend/src/team-collection/input-type.args.ts
@@ -14,6 +14,13 @@ export class CreateRootTeamCollectionArgs {

  @Field({ name: 'title', description: 'Title of the new collection' })
  title: string;
+
+  @Field({
+    name: 'data',
+    description: 'JSON string representing the collection data',
+    nullable: true,
+  })
+  data: string;
 }

@ArgsType()
@@ -26,6 +33,13 @@ export class CreateChildTeamCollectionArgs {

  @Field({ name: 'childTitle', description: 'Title of the new collection' })
  childTitle: string;
+
+  @Field({
+    name: 'data',
+    description: 'JSON string representing the collection data',
+    nullable: true,
+  })
+  data: string;
 }

@ArgsType()
@@ -33,12 +47,14 @@ export class RenameTeamCollectionArgs {
  @Field(() => ID, {
    name: 'collectionID',
    description: 'ID of the collection',
+    deprecationReason: 'Switch to updateTeamCollection mutation instead',
  })
  collectionID: string;

  @Field({
    name: 'newTitle',
    description: 'The updated title of the collection',
+    deprecationReason: 'Switch to updateTeamCollection mutation instead',
  })
  newTitle: string;
 }
@@ -98,3 +114,26 @@ export class ReplaceTeamCollectionArgs {
  })
  parentCollectionID?: string;
 }
+
+@ArgsType()
+export class UpdateTeamCollectionArgs {
+  @Field(() => ID, {
+    name: 'collectionID',
+    description: 'ID of the collection',
+  })
+  collectionID: string;
+
+  @Field({
+    name: 'newTitle',
+    description: 'The updated title of the collection',
+    nullable: true,
+  })
+  newTitle: string;
+
+  @Field({
+    name: 'data',
+    description: 'JSON string representing the collection data',
+    nullable: true,
+  })
+  data: string;
+}
--- a/packages/hoppscotch-backend/src/team-collection/team-collection.model.ts
+++ b/packages/hoppscotch-backend/src/team-collection/team-collection.model.ts
@@ -12,12 +12,17 @@ export class TeamCollection {
  })
  title: string;

+  @Field({
+    description: 'JSON string representing the collection data',
+    nullable: true,
+  })
+  data: string;
+
  @Field(() => ID, {
    description: 'ID of the collection',
    nullable: true,
  })
  parentID: string;
-  teamID: string;
 }

@ObjectType()
--- a/packages/hoppscotch-backend/src/team-collection/team-collection.resolver.ts
+++ b/packages/hoppscotch-backend/src/team-collection/team-collection.resolver.ts
@@ -25,6 +25,7 @@ import {
  MoveTeamCollectionArgs,
  RenameTeamCollectionArgs,
  ReplaceTeamCollectionArgs,
+  UpdateTeamCollectionArgs,
  UpdateTeamCollectionOrderArgs,
 } from './input-type.args';
 import * as E from 'fp-ts/Either';
@@ -141,7 +142,14 @@ export class TeamCollectionResolver {
    );

    if (E.isLeft(teamCollections)) throwErr(teamCollections.left);
-    return teamCollections.right;
+    return <TeamCollection>{
+      id: teamCollections.right.id,
+      title: teamCollections.right.title,
+      parentID: teamCollections.right.parentID,
+      data: !teamCollections.right.data
+        ? null
+        : JSON.stringify(teamCollections.right.data),
+    };
  }

  // Mutations
@@ -155,6 +163,7 @@ export class TeamCollectionResolver {
    const teamCollection = await this.teamCollectionService.createCollection(
      args.teamID,
      args.title,
+      args.data,
      null,
    );

@@ -230,6 +239,7 @@ export class TeamCollectionResolver {
    const teamCollection = await this.teamCollectionService.createCollection(
      team.right.id,
      args.childTitle,
+      args.data,
      args.collectionID,
    );

@@ -239,6 +249,7 @@ export class TeamCollectionResolver {

  @Mutation(() => TeamCollection, {
    description: 'Rename a collection',
+    deprecationReason: 'Switch to updateTeamCollection mutation instead',
  })
  @UseGuards(GqlAuthGuard, GqlCollectionTeamMemberGuard)
  @RequiresTeamRole(TeamMemberRole.OWNER, TeamMemberRole.EDITOR)
@@ -303,6 +314,23 @@ export class TeamCollectionResolver {
    return request.right;
  }

+  @Mutation(() => TeamCollection, {
+    description: 'Update Team Collection details',
+  })
+  @UseGuards(GqlAuthGuard, GqlCollectionTeamMemberGuard)
+  @RequiresTeamRole(TeamMemberRole.OWNER, TeamMemberRole.EDITOR)
+  async updateTeamCollection(@Args() args: UpdateTeamCollectionArgs) {
+    const updatedTeamCollection =
+      await this.teamCollectionService.updateTeamCollection(
+        args.collectionID,
+        args.data,
+        args.newTitle,
+      );
+
+    if (E.isLeft(updatedTeamCollection)) throwErr(updatedTeamCollection.left);
+    return updatedTeamCollection.right;
+  }
+
  // Subscriptions

  @Subscription(() => TeamCollection, {
--- a/packages/hoppscotch-backend/src/team-collection/team-collection.service.spec.ts
+++ b/packages/hoppscotch-backend/src/team-collection/team-collection.service.spec.ts
@@ -1,6 +1,7 @@
 import { Team, TeamCollection as DBTeamCollection } from '@prisma/client';
-import { mock, mockDeep, mockReset } from 'jest-mock-extended';
+import { mockDeep, mockReset } from 'jest-mock-extended';
 import {
+  TEAM_COLL_DATA_INVALID,
  TEAM_COLL_DEST_SAME,
  TEAM_COLL_INVALID_JSON,
  TEAM_COLL_IS_PARENT_COLL,
@@ -18,8 +19,6 @@ import { PubSubService } from 'src/pubsub/pubsub.service';
 import { AuthUser } from 'src/types/AuthUser';
 import { TeamCollectionService } from './team-collection.service';
 import { TeamCollection } from './team-collection.model';
-import { TeamCollectionModule } from './team-collection.module';
-import * as E from 'fp-ts/Either';

 const mockPrisma = mockDeep<PrismaService>();
 const mockPubSub = mockDeep<PubSubService>();
@@ -54,35 +53,60 @@ const rootTeamCollection: DBTeamCollection = {
  id: '123',
  orderIndex: 1,
  parentID: null,
+  data: {},
  title: 'Root Collection 1',
  teamID: team.id,
  createdOn: currentTime,
  updatedOn: currentTime,
 };

+const rootTeamCollectionsCasted: TeamCollection = {
+  id: rootTeamCollection.id,
+  title: rootTeamCollection.title,
+  parentID: rootTeamCollection.parentID,
+  data: JSON.stringify(rootTeamCollection.data),
+};
+
 const rootTeamCollection_2: DBTeamCollection = {
  id: 'erv',
  orderIndex: 2,
  parentID: null,
+  data: {},
  title: 'Root Collection 1',
  teamID: team.id,
  createdOn: currentTime,
  updatedOn: currentTime,
 };

+const rootTeamCollection_2Casted: TeamCollection = {
+  id: 'erv',
+  parentID: null,
+  data: JSON.stringify(rootTeamCollection_2.data),
+  title: 'Root Collection 1',
+};
+
 const childTeamCollection: DBTeamCollection = {
  id: 'rfe',
  orderIndex: 1,
  parentID: rootTeamCollection.id,
+  data: {},
  title: 'Child Collection 1',
  teamID: team.id,
  createdOn: currentTime,
  updatedOn: currentTime,
 };

+const childTeamCollectionCasted: TeamCollection = {
+  id: 'rfe',
+  parentID: rootTeamCollection.id,
+  data: JSON.stringify(childTeamCollection.data),
+  title: 'Child Collection 1',
+};
+
 const childTeamCollection_2: DBTeamCollection = {
  id: 'bgdz',
  orderIndex: 1,
+  data: {},
  parentID: rootTeamCollection_2.id,
  title: 'Child Collection 1',
  teamID: team.id,
@@ -90,11 +114,20 @@ const childTeamCollection_2: DBTeamCollection = {
  updatedOn: currentTime,
 };

+const childTeamCollection_2Casted: TeamCollection = {
+  id: 'bgdz',
+  data: JSON.stringify(childTeamCollection_2.data),
+  parentID: rootTeamCollection_2.id,
+  title: 'Child Collection 1',
+};
+
 const rootTeamCollectionList: DBTeamCollection[] = [
  {
    id: 'fdv',
    orderIndex: 1,
    parentID: null,
+    data: {},
+
    title: 'Root Collection 1',
    teamID: team.id,
    createdOn: currentTime,
@@ -105,6 +138,8 @@ const rootTeamCollectionList: DBTeamCollection[] = [
    orderIndex: 2,
    parentID: null,
    title: 'Root Collection 1',
+    data: {},
+
    teamID: team.id,
    createdOn: currentTime,
    updatedOn: currentTime,
@@ -114,6 +149,8 @@ const rootTeamCollectionList: DBTeamCollection[] = [
    orderIndex: 3,
    parentID: null,
    title: 'Root Collection 1',
+    data: {},
+
    teamID: team.id,
    createdOn: currentTime,
    updatedOn: currentTime,
@@ -122,6 +159,8 @@ const rootTeamCollectionList: DBTeamCollection[] = [
    id: 'bre3',
    orderIndex: 4,
    parentID: null,
+    data: {},
+
    title: 'Root Collection 1',
    teamID: team.id,
    createdOn: currentTime,
@@ -132,6 +171,8 @@ const rootTeamCollectionList: DBTeamCollection[] = [
    orderIndex: 5,
    parentID: null,
    title: 'Root Collection 1',
+    data: {},
+
    teamID: team.id,
    createdOn: currentTime,
    updatedOn: currentTime,
@@ -142,6 +183,8 @@ const rootTeamCollectionList: DBTeamCollection[] = [
    parentID: null,
    title: 'Root Collection 1',
    teamID: team.id,
+    data: {},
+
    createdOn: currentTime,
    updatedOn: currentTime,
  },
@@ -151,6 +194,8 @@ const rootTeamCollectionList: DBTeamCollection[] = [
    parentID: null,
    title: 'Root Collection 1',
    teamID: team.id,
+    data: {},
+
    createdOn: currentTime,
    updatedOn: currentTime,
  },
@@ -159,6 +204,7 @@ const rootTeamCollectionList: DBTeamCollection[] = [
    orderIndex: 8,
    parentID: null,
    title: 'Root Collection 1',
+    data: {},
    teamID: team.id,
    createdOn: currentTime,
    updatedOn: currentTime,
@@ -168,6 +214,7 @@ const rootTeamCollectionList: DBTeamCollection[] = [
    orderIndex: 9,
    parentID: null,
    title: 'Root Collection 1',
+    data: {},
    teamID: team.id,
    createdOn: currentTime,
    updatedOn: currentTime,
@@ -178,17 +225,83 @@ const rootTeamCollectionList: DBTeamCollection[] = [
    parentID: null,
    title: 'Root Collection 1',
    teamID: team.id,
+    data: {},
    createdOn: currentTime,
    updatedOn: currentTime,
  },
 ];

+const rootTeamCollectionListCasted: TeamCollection[] = [
+  {
+    id: 'fdv',
+    parentID: null,
+    title: 'Root Collection 1',
+    data: JSON.stringify(rootTeamCollection.data),
+  },
+  {
+    id: 'fbbg',
+    parentID: null,
+    title: 'Root Collection 1',
+    data: JSON.stringify(rootTeamCollection.data),
+  },
+  {
+    id: 'fgbfg',
+    parentID: null,
+    title: 'Root Collection 1',
+    data: JSON.stringify(rootTeamCollection.data),
+  },
+  {
+    id: 'bre3',
+    parentID: null,
+    data: JSON.stringify(rootTeamCollection.data),
+    title: 'Root Collection 1',
+  },
+  {
+    id: 'hghgf',
+    parentID: null,
+    title: 'Root Collection 1',
+    data: JSON.stringify(rootTeamCollection.data),
+  },
+  {
+    id: '123',
+    parentID: null,
+    title: 'Root Collection 1',
+    data: JSON.stringify(rootTeamCollection.data),
+  },
+  {
+    id: '54tyh',
+    parentID: null,
+    title: 'Root Collection 1',
+    data: JSON.stringify(rootTeamCollection.data),
+  },
+  {
+    id: '234re',
+    parentID: null,
+    title: 'Root Collection 1',
+    data: JSON.stringify(rootTeamCollection.data),
+  },
+  {
+    id: '34rtg',
+    parentID: null,
+    title: 'Root Collection 1',
+    data: JSON.stringify(rootTeamCollection.data),
+  },
+  {
+    id: '45tgh',
+    parentID: null,
+    title: 'Root Collection 1',
+    data: JSON.stringify(rootTeamCollection.data),
+  },
+];
+
 const childTeamCollectionList: DBTeamCollection[] = [
  {
    id: '123',
    orderIndex: 1,
    parentID: rootTeamCollection.id,
    title: 'Root Collection 1',
+    data: {},
+
    teamID: team.id,
    createdOn: currentTime,
    updatedOn: currentTime,
@@ -198,6 +311,8 @@ const childTeamCollectionList: DBTeamCollection[] = [
    orderIndex: 2,
    parentID: rootTeamCollection.id,
    title: 'Root Collection 1',
+    data: {},
+
    teamID: team.id,
    createdOn: currentTime,
    updatedOn: currentTime,
@@ -207,6 +322,8 @@ const childTeamCollectionList: DBTeamCollection[] = [
    orderIndex: 3,
    parentID: rootTeamCollection.id,
    title: 'Root Collection 1',
+    data: {},
+
    teamID: team.id,
    createdOn: currentTime,
    updatedOn: currentTime,
@@ -215,6 +332,8 @@ const childTeamCollectionList: DBTeamCollection[] = [
    id: '567',
    orderIndex: 4,
    parentID: rootTeamCollection.id,
+    data: {},
+
    title: 'Root Collection 1',
    teamID: team.id,
    createdOn: currentTime,
@@ -224,6 +343,8 @@ const childTeamCollectionList: DBTeamCollection[] = [
    id: '123',
    orderIndex: 5,
    parentID: rootTeamCollection.id,
+    data: {},
+
    title: 'Root Collection 1',
    teamID: team.id,
    createdOn: currentTime,
@@ -233,6 +354,8 @@ const childTeamCollectionList: DBTeamCollection[] = [
    id: '678',
    orderIndex: 6,
    parentID: rootTeamCollection.id,
+    data: {},
+
    title: 'Root Collection 1',
    teamID: team.id,
    createdOn: currentTime,
@@ -242,6 +365,8 @@ const childTeamCollectionList: DBTeamCollection[] = [
    id: '789',
    orderIndex: 7,
    parentID: rootTeamCollection.id,
+    data: {},
+
    title: 'Root Collection 1',
    teamID: team.id,
    createdOn: currentTime,
@@ -251,6 +376,8 @@ const childTeamCollectionList: DBTeamCollection[] = [
    id: '890',
    orderIndex: 8,
    parentID: rootTeamCollection.id,
+    data: {},
+
    title: 'Root Collection 1',
    teamID: team.id,
    createdOn: currentTime,
@@ -260,6 +387,7 @@ const childTeamCollectionList: DBTeamCollection[] = [
    id: '012',
    orderIndex: 9,
    parentID: rootTeamCollection.id,
+    data: {},
    title: 'Root Collection 1',
    teamID: team.id,
    createdOn: currentTime,
@@ -269,6 +397,8 @@ const childTeamCollectionList: DBTeamCollection[] = [
    id: '0bhu',
    orderIndex: 10,
    parentID: rootTeamCollection.id,
+    data: {},
+
    title: 'Root Collection 1',
    teamID: team.id,
    createdOn: currentTime,
@@ -276,6 +406,75 @@ const childTeamCollectionList: DBTeamCollection[] = [
  },
 ];

+const childTeamCollectionListCasted: TeamCollection[] = [
+  {
+    id: '123',
+    parentID: rootTeamCollection.id,
+    title: 'Root Collection 1',
+    data: JSON.stringify({}),
+  },
+  {
+    id: '345',
+    parentID: rootTeamCollection.id,
+    title: 'Root Collection 1',
+    data: JSON.stringify({}),
+  },
+  {
+    id: '456',
+    parentID: rootTeamCollection.id,
+    title: 'Root Collection 1',
+    data: JSON.stringify({}),
+  },
+  {
+    id: '567',
+    parentID: rootTeamCollection.id,
+    data: JSON.stringify({}),
+
+    title: 'Root Collection 1',
+  },
+  {
+    id: '123',
+    parentID: rootTeamCollection.id,
+    data: JSON.stringify({}),
+
+    title: 'Root Collection 1',
+  },
+  {
+    id: '678',
+    parentID: rootTeamCollection.id,
+    data: JSON.stringify({}),
+
+    title: 'Root Collection 1',
+  },
+  {
+    id: '789',
+    parentID: rootTeamCollection.id,
+    data: JSON.stringify({}),
+
+    title: 'Root Collection 1',
+  },
+  {
+    id: '890',
+    parentID: rootTeamCollection.id,
+    data: JSON.stringify({}),
+
+    title: 'Root Collection 1',
+  },
+  {
+    id: '012',
+    parentID: rootTeamCollection.id,
+    data: JSON.stringify({}),
+    title: 'Root Collection 1',
+  },
+  {
+    id: '0bhu',
+    parentID: rootTeamCollection.id,
+    data: JSON.stringify({}),
+
+    title: 'Root Collection 1',
+  },
+];
+
 beforeEach(() => {
  mockReset(mockPrisma);
  mockPubSub.publish.mockClear();
@@ -314,7 +513,7 @@ describe('getParentOfCollection', () => {
    const result = await teamCollectionService.getParentOfCollection(
      childTeamCollection.id,
    );
-    expect(result).toEqual(rootTeamCollection);
+    expect(result).toEqual(rootTeamCollectionsCasted);
  });

  test('should return null successfully for a root collection with valid collectionID', async () => {
@@ -350,7 +549,7 @@ describe('getChildrenOfCollection', () => {
      null,
      10,
    );
-    expect(result).toEqual(childTeamCollectionList);
+    expect(result).toEqual(childTeamCollectionListCasted);
  });

  test('should return a list of 3 child collections successfully with cursor being equal to the 7th item in the list', async () => {
@@ -366,9 +565,9 @@ describe('getChildrenOfCollection', () => {
      10,
    );
    expect(result).toEqual([
-      { ...childTeamCollectionList[7] },
-      { ...childTeamCollectionList[8] },
-      { ...childTeamCollectionList[9] },
+      { ...childTeamCollectionListCasted[7] },
+      { ...childTeamCollectionListCasted[8] },
+      { ...childTeamCollectionListCasted[9] },
    ]);
  });

@@ -395,7 +594,7 @@ describe('getTeamRootCollections', () => {
      null,
      10,
    );
-    expect(result).toEqual(rootTeamCollectionList);
+    expect(result).toEqual(rootTeamCollectionListCasted);
  });

  test('should return a list of 3 root collections successfully with cursor being equal to the 7th item in the list', async () => {
@@ -411,9 +610,9 @@ describe('getTeamRootCollections', () => {
      10,
    );
    expect(result).toEqual([
-      { ...rootTeamCollectionList[7] },
-      { ...rootTeamCollectionList[8] },
-      { ...rootTeamCollectionList[9] },
+      { ...rootTeamCollectionListCasted[7] },
+      { ...rootTeamCollectionListCasted[8] },
+      { ...rootTeamCollectionListCasted[9] },
    ]);
  });

@@ -467,6 +666,7 @@ describe('createCollection', () => {
    const result = await teamCollectionService.createCollection(
      rootTeamCollection.teamID,
      'ab',
+      JSON.stringify(rootTeamCollection.data),
      rootTeamCollection.id,
    );
    expect(result).toEqualLeft(TEAM_COLL_SHORT_TITLE);
@@ -481,11 +681,27 @@ describe('createCollection', () => {
    const result = await teamCollectionService.createCollection(
      rootTeamCollection.teamID,
      'abcd',
+      JSON.stringify(rootTeamCollection.data),
      rootTeamCollection.id,
    );
    expect(result).toEqualLeft(TEAM_NOT_OWNER);
  });

+  test('should throw TEAM_COLL_DATA_INVALID when parent TeamCollection does not belong to the team', async () => {
+    // isOwnerCheck
+    mockPrisma.teamCollection.findFirstOrThrow.mockResolvedValueOnce(
+      rootTeamCollection,
+    );
+
+    const result = await teamCollectionService.createCollection(
+      rootTeamCollection.teamID,
+      'abcd',
+      '{',
+      rootTeamCollection.id,
+    );
+    expect(result).toEqualLeft(TEAM_COLL_DATA_INVALID);
+  });
+
  test('should successfully create a new root TeamCollection with valid inputs', async () => {
    // isOwnerCheck
    mockPrisma.teamCollection.findFirstOrThrow.mockResolvedValueOnce(
@@ -499,9 +715,10 @@ describe('createCollection', () => {
    const result = await teamCollectionService.createCollection(
      rootTeamCollection.teamID,
      'abcdefg',
+      JSON.stringify(rootTeamCollection.data),
      rootTeamCollection.id,
    );
-    expect(result).toEqualRight(rootTeamCollection);
+    expect(result).toEqualRight(rootTeamCollectionsCasted);
  });

  test('should successfully create a new child TeamCollection with valid inputs', async () => {
@@ -517,9 +734,10 @@ describe('createCollection', () => {
    const result = await teamCollectionService.createCollection(
      childTeamCollection.teamID,
      childTeamCollection.title,
+      JSON.stringify(rootTeamCollection.data),
      rootTeamCollection.id,
    );
-    expect(result).toEqualRight(childTeamCollection);
+    expect(result).toEqualRight(childTeamCollectionCasted);
  });

  test('should send pubsub message to "team_coll/<teamID>/coll_added" if child TeamCollection is created successfully', async () => {
@@ -535,11 +753,13 @@ describe('createCollection', () => {
    const result = await teamCollectionService.createCollection(
      childTeamCollection.teamID,
      childTeamCollection.title,
+      JSON.stringify(rootTeamCollection.data),
+
      rootTeamCollection.id,
    );
    expect(mockPubSub.publish).toHaveBeenCalledWith(
      `team_coll/${childTeamCollection.teamID}/coll_added`,
-      childTeamCollection,
+      childTeamCollectionCasted,
    );
  });

@@ -556,11 +776,13 @@ describe('createCollection', () => {
    const result = await teamCollectionService.createCollection(
      rootTeamCollection.teamID,
      'abcdefg',
+      JSON.stringify(rootTeamCollection.data),
+
      rootTeamCollection.id,
    );
    expect(mockPubSub.publish).toHaveBeenCalledWith(
      `team_coll/${rootTeamCollection.teamID}/coll_added`,
-      rootTeamCollection,
+      rootTeamCollectionsCasted,
    );
  });
 });
@@ -590,7 +812,7 @@ describe('renameCollection', () => {
      'NewTitle',
    );
    expect(result).toEqualRight({
-      ...rootTeamCollection,
+      ...rootTeamCollectionsCasted,
      title: 'NewTitle',
    });
  });
@@ -628,7 +850,7 @@ describe('renameCollection', () => {
    expect(mockPubSub.publish).toHaveBeenCalledWith(
      `team_coll/${rootTeamCollection.teamID}/coll_updated`,
      {
-        ...rootTeamCollection,
+        ...rootTeamCollectionsCasted,
        title: 'NewTitle',
      },
    );
@@ -835,9 +1057,8 @@ describe('moveCollection', () => {
      null,
    );
    expect(result).toEqualRight({
-      ...childTeamCollection,
+      ...childTeamCollectionCasted,
      parentID: null,
-      orderIndex: 2,
    });
  });

@@ -893,9 +1114,8 @@ describe('moveCollection', () => {
    expect(mockPubSub.publish).toHaveBeenCalledWith(
      `team_coll/${childTeamCollection.teamID}/coll_moved`,
      {
-        ...childTeamCollection,
+        ...childTeamCollectionCasted,
        parentID: null,
-        orderIndex: 2,
      },
    );
  });
@@ -934,9 +1154,8 @@ describe('moveCollection', () => {
      childTeamCollection_2.id,
    );
    expect(result).toEqualRight({
-      ...rootTeamCollection,
-      parentID: childTeamCollection_2.id,
-      orderIndex: 1,
+      ...rootTeamCollectionsCasted,
+      parentID: childTeamCollection_2Casted.id,
    });
  });

@@ -976,9 +1195,8 @@ describe('moveCollection', () => {
    expect(mockPubSub.publish).toHaveBeenCalledWith(
      `team_coll/${childTeamCollection_2.teamID}/coll_moved`,
      {
-        ...rootTeamCollection,
-        parentID: childTeamCollection_2.id,
-        orderIndex: 1,
+        ...rootTeamCollectionsCasted,
+        parentID: childTeamCollection_2Casted.id,
      },
    );
  });
@@ -1017,9 +1235,8 @@ describe('moveCollection', () => {
      childTeamCollection_2.id,
    );
    expect(result).toEqualRight({
-      ...childTeamCollection,
-      parentID: childTeamCollection_2.id,
-      orderIndex: 1,
+      ...childTeamCollectionCasted,
+      parentID: childTeamCollection_2Casted.id,
    });
  });

@@ -1059,9 +1276,8 @@ describe('moveCollection', () => {
    expect(mockPubSub.publish).toHaveBeenCalledWith(
      `team_coll/${childTeamCollection.teamID}/coll_moved`,
      {
-        ...childTeamCollection,
-        parentID: childTeamCollection_2.id,
-        orderIndex: 1,
+        ...childTeamCollectionCasted,
+        parentID: childTeamCollection_2Casted.id,
      },
    );
  });
@@ -1157,7 +1373,7 @@ describe('updateCollectionOrder', () => {
    expect(mockPubSub.publish).toHaveBeenCalledWith(
      `team_coll/${childTeamCollectionList[4].teamID}/coll_order_updated`,
      {
-        collection: rootTeamCollectionList[4],
+        collection: rootTeamCollectionListCasted[4],
        nextCollection: null,
      },
    );
@@ -1238,8 +1454,8 @@ describe('updateCollectionOrder', () => {
    expect(mockPubSub.publish).toHaveBeenCalledWith(
      `team_coll/${childTeamCollectionList[2].teamID}/coll_order_updated`,
      {
-        collection: childTeamCollectionList[4],
-        nextCollection: childTeamCollectionList[2],
+        collection: childTeamCollectionListCasted[4],
+        nextCollection: childTeamCollectionListCasted[2],
      },
    );
  });
@@ -1305,7 +1521,7 @@ describe('importCollectionsFromJSON', () => {
    );
    expect(mockPubSub.publish).toHaveBeenCalledWith(
      `team_coll/${rootTeamCollection.teamID}/coll_added`,
-      rootTeamCollection,
+      rootTeamCollectionsCasted,
    );
  });
 });
@@ -1424,7 +1640,7 @@ describe('replaceCollectionsWithJSON', () => {
    );
    expect(mockPubSub.publish).toHaveBeenCalledWith(
      `team_coll/${rootTeamCollection.teamID}/coll_added`,
-      rootTeamCollection,
+      rootTeamCollectionsCasted,
    );
  });
 });
@@ -1461,4 +1677,64 @@ describe('totalCollectionsInTeam', () => {
  });
 });

+describe('updateTeamCollection', () => {
+  test('should throw TEAM_COLL_SHORT_TITLE if title is invalid', async () => {
+    const result = await teamCollectionService.updateTeamCollection(
+      rootTeamCollection.id,
+      JSON.stringify(rootTeamCollection.data),
+      'de',
+    );
+    expect(result).toEqualLeft(TEAM_COLL_SHORT_TITLE);
+  });
+
+  test('should throw TEAM_COLL_DATA_INVALID is collection data is invalid', async () => {
+    const result = await teamCollectionService.updateTeamCollection(
+      rootTeamCollection.id,
+      '{',
+      rootTeamCollection.title,
+    );
+    expect(result).toEqualLeft(TEAM_COLL_DATA_INVALID);
+  });
+
+  test('should throw TEAM_COLL_NOT_FOUND is collectionID is invalid', async () => {
+    mockPrisma.teamCollection.update.mockRejectedValueOnce('RecordNotFound');
+
+    const result = await teamCollectionService.updateTeamCollection(
+      'invalid_id',
+      JSON.stringify(rootTeamCollection.data),
+      rootTeamCollection.title,
+    );
+    expect(result).toEqualLeft(TEAM_COLL_NOT_FOUND);
+  });
+
+  test('should successfully update a collection', async () => {
+    mockPrisma.teamCollection.update.mockResolvedValueOnce(rootTeamCollection);
+
+    const result = await teamCollectionService.updateTeamCollection(
+      rootTeamCollection.id,
+      JSON.stringify({ foo: 'bar' }),
+      'new_title',
+    );
+    expect(result).toEqualRight({
+      data: JSON.stringify({ foo: 'bar' }),
+      title: 'new_title',
+      ...rootTeamCollectionsCasted,
+    });
+  });
+
+  test('should send pubsub message to "team_coll/<teamID>/coll_updated" if TeamCollection is updated successfully', async () => {
+    mockPrisma.teamCollection.update.mockResolvedValueOnce(rootTeamCollection);
+
+    const result = await teamCollectionService.updateTeamCollection(
+      rootTeamCollection.id,
+      JSON.stringify(rootTeamCollection.data),
+      rootTeamCollection.title,
+    );
+    expect(mockPubSub.publish).toHaveBeenCalledWith(
+      `team_coll/${rootTeamCollection.teamID}/coll_updated`,
+      rootTeamCollectionsCasted,
+    );
+  });
+});
+
 //ToDo: write test cases for exportCollectionsToJSON
--- a/packages/hoppscotch-backend/src/team-collection/team-collection.service.ts
+++ b/packages/hoppscotch-backend/src/team-collection/team-collection.service.ts
@@ -13,6 +13,7 @@ import {
  TEAM_COLL_IS_PARENT_COLL,
  TEAM_COL_SAME_NEXT_COLL,
  TEAM_COL_REORDERING_FAILED,
+  TEAM_COLL_DATA_INVALID,
 } from '../errors';
 import { PubSubService } from '../pubsub/pubsub.service';
 import { isValidLength } from 'src/utils';
@@ -69,6 +70,7 @@ export class TeamCollectionService {
          this.generatePrismaQueryObjForFBCollFolder(f, teamID, index + 1),
        ),
      },
+      data: folder.data ?? undefined,
    };
  }

@@ -118,6 +120,7 @@ export class TeamCollectionService {
      name: collection.right.title,
      folders: childrenCollectionObjects,
      requests: requests.map((x) => x.request),
+      data: JSON.stringify(collection.right.data),
    };

    return E.right(result);
@@ -198,8 +201,11 @@ export class TeamCollectionService {
      ),
    );

-    teamCollections.forEach((x) =>
-      this.pubsub.publish(`team_coll/${destTeamID}/coll_added`, x),
+    teamCollections.forEach((collection) =>
+      this.pubsub.publish(
+        `team_coll/${destTeamID}/coll_added`,
+        this.cast(collection),
+      ),
    );

    return E.right(true);
@@ -268,8 +274,11 @@ export class TeamCollectionService {
      ),
    );

-    teamCollections.forEach((x) =>
-      this.pubsub.publish(`team_coll/${destTeamID}/coll_added`, x),
+    teamCollections.forEach((collections) =>
+      this.pubsub.publish(
+        `team_coll/${destTeamID}/coll_added`,
+        this.cast(collections),
+      ),
    );

    return E.right(true);
@@ -277,11 +286,17 @@ export class TeamCollectionService {

  /**
   * Typecast a database TeamCollection to a TeamCollection model
+   *
   * @param teamCollection database TeamCollection
   * @returns TeamCollection model
   */
  private cast(teamCollection: DBTeamCollection): TeamCollection {
-    return <TeamCollection>{ ...teamCollection };
+    return <TeamCollection>{
+      id: teamCollection.id,
+      title: teamCollection.title,
+      parentID: teamCollection.parentID,
+      data: !teamCollection.data ? null : JSON.stringify(teamCollection.data),
+    };
  }

  /**
@@ -324,7 +339,7 @@ export class TeamCollectionService {
    });
    if (!teamCollection) return null;

-    return teamCollection.parent;
+    return !teamCollection.parent ? null : this.cast(teamCollection.parent);
  }

  /**
@@ -335,12 +350,12 @@ export class TeamCollectionService {
   * @param take Number of items we want returned
   * @returns A list of child collections
   */
-  getChildrenOfCollection(
+  async getChildrenOfCollection(
    collectionID: string,
    cursor: string | null,
    take: number,
  ) {
-    return this.prisma.teamCollection.findMany({
+    const res = await this.prisma.teamCollection.findMany({
      where: {
        parentID: collectionID,
      },
@@ -351,6 +366,12 @@ export class TeamCollectionService {
      skip: cursor ? 1 : 0,
      cursor: cursor ? { id: cursor } : undefined,
    });
+
+    const childCollections = res.map((teamCollection) =>
+      this.cast(teamCollection),
+    );
+
+    return childCollections;
  }

  /**
@@ -366,7 +387,7 @@ export class TeamCollectionService {
    cursor: string | null,
    take: number,
  ) {
-    return this.prisma.teamCollection.findMany({
+    const res = await this.prisma.teamCollection.findMany({
      where: {
        teamID,
        parentID: null,
@@ -378,6 +399,12 @@ export class TeamCollectionService {
      skip: cursor ? 1 : 0,
      cursor: cursor ? { id: cursor } : undefined,
    });
+
+    const teamCollections = res.map((teamCollection) =>
+      this.cast(teamCollection),
+    );
+
+    return teamCollections;
  }

  /**
@@ -470,6 +497,7 @@ export class TeamCollectionService {
  async createCollection(
    teamID: string,
    title: string,
+    data: string | null = null,
    parentTeamCollectionID: string | null,
  ) {
    const isTitleValid = isValidLength(title, this.TITLE_LENGTH);
@@ -481,6 +509,13 @@ export class TeamCollectionService {
      if (O.isNone(isOwner)) return E.left(TEAM_NOT_OWNER);
    }

+    if (data === '') return E.left(TEAM_COLL_DATA_INVALID);
+    if (data) {
+      const jsonReq = stringToJson(data);
+      if (E.isLeft(jsonReq)) return E.left(TEAM_COLL_DATA_INVALID);
+      data = jsonReq.right;
+    }
+
    const isParent = parentTeamCollectionID
      ? {
          connect: {
@@ -498,18 +533,23 @@ export class TeamCollectionService {
          },
        },
        parent: isParent,
+        data: data ?? undefined,
        orderIndex: !parentTeamCollectionID
          ? (await this.getRootCollectionsCount(teamID)) + 1
          : (await this.getChildCollectionsCount(parentTeamCollectionID)) + 1,
      },
    });

-    this.pubsub.publish(`team_coll/${teamID}/coll_added`, teamCollection);
+    this.pubsub.publish(
+      `team_coll/${teamID}/coll_added`,
+      this.cast(teamCollection),
+    );

    return E.right(this.cast(teamCollection));
  }

  /**
+   * @deprecated Use updateTeamCollection method instead
   * Update the title of a TeamCollection
   *
   * @param collectionID The Collection ID
@@ -532,10 +572,10 @@ export class TeamCollectionService {

      this.pubsub.publish(
        `team_coll/${updatedTeamCollection.teamID}/coll_updated`,
-        updatedTeamCollection,
+        this.cast(updatedTeamCollection),
      );

-      return E.right(updatedTeamCollection);
+      return E.right(this.cast(updatedTeamCollection));
    } catch (error) {
      return E.left(TEAM_COLL_NOT_FOUND);
    }
@@ -694,8 +734,8 @@ export class TeamCollectionService {
   * @returns An Option of boolean, is parent or not
   */
  private async isParent(
-    collection: TeamCollection,
-    destCollection: TeamCollection,
+    collection: DBTeamCollection,
+    destCollection: DBTeamCollection,
  ): Promise<O.Option<boolean>> {
    //* Recursively check if collection is a parent by going up the tree of child-parent collections until we reach a root collection i.e parentID === null
    //* Valid condition, isParent returns false
@@ -971,4 +1011,49 @@ export class TeamCollectionService {
    const teamCollectionsCount = this.prisma.teamCollection.count();
    return teamCollectionsCount;
  }
+
+  /**
+   * Update Team Collection details
+   *
+   * @param collectionID Collection ID
+   * @param collectionData new header data in a JSONified string form
+   * @param newTitle New title of the collection
+   * @returns Updated TeamCollection
+   */
+  async updateTeamCollection(
+    collectionID: string,
+    collectionData: string = null,
+    newTitle: string = null,
+  ) {
+    try {
+      if (newTitle != null) {
+        const isTitleValid = isValidLength(newTitle, this.TITLE_LENGTH);
+        if (!isTitleValid) return E.left(TEAM_COLL_SHORT_TITLE);
+      }
+
+      if (collectionData === '') return E.left(TEAM_COLL_DATA_INVALID);
+      if (collectionData) {
+        const jsonReq = stringToJson(collectionData);
+        if (E.isLeft(jsonReq)) return E.left(TEAM_COLL_DATA_INVALID);
+        collectionData = jsonReq.right;
+      }
+
+      const updatedTeamCollection = await this.prisma.teamCollection.update({
+        where: { id: collectionID },
+        data: {
+          data: collectionData ?? undefined,
+          title: newTitle ?? undefined,
+        },
+      });
+
+      this.pubsub.publish(
+        `team_coll/${updatedTeamCollection.teamID}/coll_updated`,
+        this.cast(updatedTeamCollection),
+      );
+
+      return E.right(this.cast(updatedTeamCollection));
+    } catch (e) {
+      return E.left(TEAM_COLL_NOT_FOUND);
+    }
+  }
 }
--- a/packages/hoppscotch-backend/src/team-environments/gql-team-env-team.guard.ts
+++ b/packages/hoppscotch-backend/src/team-environments/gql-team-env-team.guard.ts
@@ -1,15 +1,5 @@
 import { CanActivate, ExecutionContext, Injectable } from '@nestjs/common';
 import { Reflector } from '@nestjs/core';
-import * as TE from 'fp-ts/TaskEither';
-import * as O from 'fp-ts/Option';
-import * as S from 'fp-ts/string';
-import { pipe } from 'fp-ts/function';
-import {
-  getAnnotatedRequiredRoles,
-  getGqlArg,
-  getUserFromGQLContext,
-  throwErr,
-} from 'src/utils';
 import { TeamEnvironmentsService } from './team-environments.service';
 import {
  BUG_AUTH_NO_USER_CTX,
@@ -19,6 +9,10 @@ import {
  TEAM_ENVIRONMENT_NOT_FOUND,
 } from 'src/errors';
 import { TeamService } from 'src/team/team.service';
+import { GqlExecutionContext } from '@nestjs/graphql';
+import * as E from 'fp-ts/Either';
+import { TeamMemberRole } from '@prisma/client';
+import { throwErr } from 'src/utils';

 /**
 * A guard which checks whether the caller of a GQL Operation
@@ -33,50 +27,31 @@ export class GqlTeamEnvTeamGuard implements CanActivate {
    private readonly teamService: TeamService,
  ) {}

-  canActivate(context: ExecutionContext): Promise<boolean> {
-    return pipe(
-      TE.Do,
+  async canActivate(context: ExecutionContext): Promise<boolean> {
+    const requireRoles = this.reflector.get<TeamMemberRole[]>(
+      'requiresTeamRole',
+      context.getHandler(),
+    );
+    if (!requireRoles) throw new Error(BUG_TEAM_ENV_GUARD_NO_REQUIRE_ROLES);

-      TE.bindW('requiredRoles', () =>
-        pipe(
-          getAnnotatedRequiredRoles(this.reflector, context),
-          TE.fromOption(() => BUG_TEAM_ENV_GUARD_NO_REQUIRE_ROLES),
-        ),
-      ),
+    const gqlExecCtx = GqlExecutionContext.create(context);

-      TE.bindW('user', () =>
-        pipe(
-          getUserFromGQLContext(context),
-          TE.fromOption(() => BUG_AUTH_NO_USER_CTX),
-        ),
-      ),
+    const { user } = gqlExecCtx.getContext().req;
+    if (user == undefined) throw new Error(BUG_AUTH_NO_USER_CTX);

-      TE.bindW('envID', () =>
-        pipe(
-          getGqlArg('id', context),
-          O.fromPredicate(S.isString),
-          TE.fromOption(() => BUG_TEAM_ENV_GUARD_NO_ENV_ID),
-        ),
-      ),
+    const { id } = gqlExecCtx.getArgs<{ id: string }>();
+    if (!id) throwErr(BUG_TEAM_ENV_GUARD_NO_ENV_ID);

-      TE.bindW('membership', ({ envID, user }) =>
-        pipe(
-          this.teamEnvironmentService.getTeamEnvironment(envID),
-          TE.fromTaskOption(() => TEAM_ENVIRONMENT_NOT_FOUND),
-          TE.chainW((env) =>
-            pipe(
-              this.teamService.getTeamMemberTE(env.teamID, user.uid),
-              TE.mapLeft(() => TEAM_ENVIRONMENT_NOT_TEAM_MEMBER),
-            ),
-          ),
-        ),
-      ),
+    const teamEnvironment =
+      await this.teamEnvironmentService.getTeamEnvironment(id);
+    if (E.isLeft(teamEnvironment)) throwErr(TEAM_ENVIRONMENT_NOT_FOUND);

-      TE.map(({ membership, requiredRoles }) =>
-        requiredRoles.includes(membership.role),
-      ),
+    const member = await this.teamService.getTeamMember(
+      teamEnvironment.right.teamID,
+      user.uid,
+    );
+    if (!member) throwErr(TEAM_ENVIRONMENT_NOT_TEAM_MEMBER);

-      TE.getOrElse(throwErr),
-    )();
+    return requireRoles.includes(member.role);
  }
 }
--- a/packages/hoppscotch-backend/src/team-environments/input-type.args.ts
+++ b/packages/hoppscotch-backend/src/team-environments/input-type.args.ts
@@ -0,0 +1,41 @@
+import { ArgsType, Field, ID } from '@nestjs/graphql';
+
+@ArgsType()
+export class CreateTeamEnvironmentArgs {
+  @Field({
+    name: 'name',
+    description: 'Name of the Team Environment',
+  })
+  name: string;
+
+  @Field(() => ID, {
+    name: 'teamID',
+    description: 'ID of the Team',
+  })
+  teamID: string;
+
+  @Field({
+    name: 'variables',
+    description: 'JSON string of the variables object',
+  })
+  variables: string;
+}
+
+@ArgsType()
+export class UpdateTeamEnvironmentArgs {
+  @Field(() => ID, {
+    name: 'id',
+    description: 'ID of the Team Environment',
+  })
+  id: string;
+  @Field({
+    name: 'name',
+    description: 'Name of the Team Environment',
+  })
+  name: string;
+  @Field({
+    name: 'variables',
+    description: 'JSON string of the variables object',
+  })
+  variables: string;
+}
--- a/packages/hoppscotch-backend/src/team-environments/team-environments.resolver.ts
+++ b/packages/hoppscotch-backend/src/team-environments/team-environments.resolver.ts
@@ -13,6 +13,11 @@ import { throwErr } from 'src/utils';
 import { GqlTeamEnvTeamGuard } from './gql-team-env-team.guard';
 import { TeamEnvironment } from './team-environments.model';
 import { TeamEnvironmentsService } from './team-environments.service';
+import * as E from 'fp-ts/Either';
+import {
+  CreateTeamEnvironmentArgs,
+  UpdateTeamEnvironmentArgs,
+} from './input-type.args';

@UseGuards(GqlThrottlerGuard)
@Resolver(() => 'TeamEnvironment')
@@ -29,29 +34,18 @@ export class TeamEnvironmentsResolver {
  })
  @UseGuards(GqlAuthGuard, GqlTeamMemberGuard)
  @RequiresTeamRole(TeamMemberRole.OWNER, TeamMemberRole.EDITOR)
-  createTeamEnvironment(
-    @Args({
-      name: 'name',
-      description: 'Name of the Team Environment',
-    })
-    name: string,
-    @Args({
-      name: 'teamID',
-      description: 'ID of the Team',
-      type: () => ID,
-    })
-    teamID: string,
-    @Args({
-      name: 'variables',
-      description: 'JSON string of the variables object',
-    })
-    variables: string,
+  async createTeamEnvironment(
+    @Args() args: CreateTeamEnvironmentArgs,
  ): Promise<TeamEnvironment> {
-    return this.teamEnvironmentsService.createTeamEnvironment(
-      name,
-      teamID,
-      variables,
-    )();
+    const teamEnvironment =
+      await this.teamEnvironmentsService.createTeamEnvironment(
+        args.name,
+        args.teamID,
+        args.variables,
+      );
+
+    if (E.isLeft(teamEnvironment)) throwErr(teamEnvironment.left);
+    return teamEnvironment.right;
  }

  @Mutation(() => Boolean, {
@@ -59,7 +53,7 @@ export class TeamEnvironmentsResolver {
  })
  @UseGuards(GqlAuthGuard, GqlTeamEnvTeamGuard)
  @RequiresTeamRole(TeamMemberRole.OWNER, TeamMemberRole.EDITOR)
-  deleteTeamEnvironment(
+  async deleteTeamEnvironment(
    @Args({
      name: 'id',
      description: 'ID of the Team Environment',
@@ -67,10 +61,12 @@ export class TeamEnvironmentsResolver {
    })
    id: string,
  ): Promise<boolean> {
-    return pipe(
-      this.teamEnvironmentsService.deleteTeamEnvironment(id),
-      TE.getOrElse(throwErr),
-    )();
+    const isDeleted = await this.teamEnvironmentsService.deleteTeamEnvironment(
+      id,
+    );
+
+    if (E.isLeft(isDeleted)) throwErr(isDeleted.left);
+    return isDeleted.right;
  }

  @Mutation(() => TeamEnvironment, {
@@ -79,28 +75,19 @@ export class TeamEnvironmentsResolver {
  })
  @UseGuards(GqlAuthGuard, GqlTeamEnvTeamGuard)
  @RequiresTeamRole(TeamMemberRole.OWNER, TeamMemberRole.EDITOR)
-  updateTeamEnvironment(
-    @Args({
-      name: 'id',
-      description: 'ID of the Team Environment',
-      type: () => ID,
-    })
-    id: string,
-    @Args({
-      name: 'name',
-      description: 'Name of the Team Environment',
-    })
-    name: string,
-    @Args({
-      name: 'variables',
-      description: 'JSON string of the variables object',
-    })
-    variables: string,
+  async updateTeamEnvironment(
+    @Args()
+    args: UpdateTeamEnvironmentArgs,
  ): Promise<TeamEnvironment> {
-    return pipe(
-      this.teamEnvironmentsService.updateTeamEnvironment(id, name, variables),
-      TE.getOrElse(throwErr),
-    )();
+    const updatedTeamEnvironment =
+      await this.teamEnvironmentsService.updateTeamEnvironment(
+        args.id,
+        args.name,
+        args.variables,
+      );
+
+    if (E.isLeft(updatedTeamEnvironment)) throwErr(updatedTeamEnvironment.left);
+    return updatedTeamEnvironment.right;
  }

  @Mutation(() => TeamEnvironment, {
@@ -108,7 +95,7 @@ export class TeamEnvironmentsResolver {
  })
  @UseGuards(GqlAuthGuard, GqlTeamEnvTeamGuard)
  @RequiresTeamRole(TeamMemberRole.OWNER, TeamMemberRole.EDITOR)
-  deleteAllVariablesFromTeamEnvironment(
+  async deleteAllVariablesFromTeamEnvironment(
    @Args({
      name: 'id',
      description: 'ID of the Team Environment',
@@ -116,10 +103,13 @@ export class TeamEnvironmentsResolver {
    })
    id: string,
  ): Promise<TeamEnvironment> {
-    return pipe(
-      this.teamEnvironmentsService.deleteAllVariablesFromTeamEnvironment(id),
-      TE.getOrElse(throwErr),
-    )();
+    const teamEnvironment =
+      await this.teamEnvironmentsService.deleteAllVariablesFromTeamEnvironment(
+        id,
+      );
+
+    if (E.isLeft(teamEnvironment)) throwErr(teamEnvironment.left);
+    return teamEnvironment.right;
  }

  @Mutation(() => TeamEnvironment, {
@@ -127,7 +117,7 @@ export class TeamEnvironmentsResolver {
  })
  @UseGuards(GqlAuthGuard, GqlTeamEnvTeamGuard)
  @RequiresTeamRole(TeamMemberRole.OWNER, TeamMemberRole.EDITOR)
-  createDuplicateEnvironment(
+  async createDuplicateEnvironment(
    @Args({
      name: 'id',
      description: 'ID of the Team Environment',
@@ -135,10 +125,12 @@ export class TeamEnvironmentsResolver {
    })
    id: string,
  ): Promise<TeamEnvironment> {
-    return pipe(
-      this.teamEnvironmentsService.createDuplicateEnvironment(id),
-      TE.getOrElse(throwErr),
-    )();
+    const res = await this.teamEnvironmentsService.createDuplicateEnvironment(
+      id,
+    );
+
+    if (E.isLeft(res)) throwErr(res.left);
+    return res.right;
  }

  /* Subscriptions */
--- a/packages/hoppscotch-backend/src/team-environments/team-environments.service.spec.ts
+++ b/packages/hoppscotch-backend/src/team-environments/team-environments.service.spec.ts
@@ -2,7 +2,11 @@ import { mockDeep, mockReset } from 'jest-mock-extended';
 import { PrismaService } from 'src/prisma/prisma.service';
 import { TeamEnvironment } from './team-environments.model';
 import { TeamEnvironmentsService } from './team-environments.service';
-import { TEAM_ENVIRONMENT_NOT_FOUND } from 'src/errors';
+import {
+  JSON_INVALID,
+  TEAM_ENVIRONMENT_NOT_FOUND,
+  TEAM_ENVIRONMENT_SHORT_NAME,
+} from 'src/errors';

 const mockPrisma = mockDeep<PrismaService>();

@@ -31,125 +35,81 @@ beforeEach(() => {

 describe('TeamEnvironmentsService', () => {
  describe('getTeamEnvironment', () => {
-    test('queries the db with the id', async () => {
-      mockPrisma.teamEnvironment.findFirst.mockResolvedValue(teamEnvironment);
-
-      await teamEnvironmentsService.getTeamEnvironment('123')();
-
-      expect(mockPrisma.teamEnvironment.findFirst).toHaveBeenCalledWith(
-        expect.objectContaining({
-          where: {
-            id: '123',
-          },
-        }),
+    test('should successfully return a TeamEnvironment with valid ID', async () => {
+      mockPrisma.teamEnvironment.findFirstOrThrow.mockResolvedValueOnce(
+        teamEnvironment,
      );
-    });

-    test('requests prisma to reject the query promise if not found', async () => {
-      mockPrisma.teamEnvironment.findFirst.mockResolvedValue(teamEnvironment);
-
-      await teamEnvironmentsService.getTeamEnvironment('123')();
-
-      expect(mockPrisma.teamEnvironment.findFirst).toHaveBeenCalledWith(
-        expect.objectContaining({
-          rejectOnNotFound: true,
-        }),
+      const result = await teamEnvironmentsService.getTeamEnvironment(
+        teamEnvironment.id,
      );
+      expect(result).toEqualRight(teamEnvironment);
    });

-    test('should return a Some of the correct environment if exists', async () => {
-      mockPrisma.teamEnvironment.findFirst.mockResolvedValue(teamEnvironment);
+    test('should throw TEAM_ENVIRONMENT_NOT_FOUND with invalid ID', async () => {
+      mockPrisma.teamEnvironment.findFirstOrThrow.mockRejectedValueOnce(
+        'RejectOnNotFound',
+      );

-      const result = await teamEnvironmentsService.getTeamEnvironment('123')();
-
-      expect(result).toEqualSome(teamEnvironment);
-    });
-
-    test('should return a None if the environment does not exist', async () => {
-      mockPrisma.teamEnvironment.findFirst.mockRejectedValue('NotFoundError');
-
-      const result = await teamEnvironmentsService.getTeamEnvironment('123')();
-
-      expect(result).toBeNone();
+      const result = await teamEnvironmentsService.getTeamEnvironment(
+        teamEnvironment.id,
+      );
+      expect(result).toEqualLeft(TEAM_ENVIRONMENT_NOT_FOUND);
    });
  });
+
  describe('createTeamEnvironment', () => {
-    test('should create and return a new team environment given a valid name,variable and team ID', async () => {
+    test('should successfully create and return a new team environment given valid inputs', async () => {
      mockPrisma.teamEnvironment.create.mockResolvedValue(teamEnvironment);

      const result = await teamEnvironmentsService.createTeamEnvironment(
        teamEnvironment.name,
        teamEnvironment.teamID,
        JSON.stringify(teamEnvironment.variables),
-      )();
+      );

-      expect(result).toEqual(<TeamEnvironment>{
-        id: teamEnvironment.id,
-        name: teamEnvironment.name,
-        teamID: teamEnvironment.teamID,
+      expect(result).toEqualRight({
+        ...teamEnvironment,
        variables: JSON.stringify(teamEnvironment.variables),
      });
    });

-    test('should reject if given team ID is invalid', async () => {
-      mockPrisma.teamEnvironment.create.mockRejectedValue(null as any);
+    test('should throw TEAM_ENVIRONMENT_SHORT_NAME if input TeamEnvironment name is invalid', async () => {
+      const result = await teamEnvironmentsService.createTeamEnvironment(
+        '12',
+        teamEnvironment.teamID,
+        JSON.stringify(teamEnvironment.variables),
+      );

-      await expect(
-        teamEnvironmentsService.createTeamEnvironment(
-          teamEnvironment.name,
-          'invalidteamid',
-          JSON.stringify(teamEnvironment.variables),
-        ),
-      ).rejects.toBeDefined();
-    });
-
-    test('should reject if provided team environment name is not a string', async () => {
-      mockPrisma.teamEnvironment.create.mockRejectedValue(null as any);
-
-      await expect(
-        teamEnvironmentsService.createTeamEnvironment(
-          null as any,
-          teamEnvironment.teamID,
-          JSON.stringify(teamEnvironment.variables),
-        ),
-      ).rejects.toBeDefined();
-    });
-
-    test('should reject if provided variable is not a string', async () => {
-      mockPrisma.teamEnvironment.create.mockRejectedValue(null as any);
-
-      await expect(
-        teamEnvironmentsService.createTeamEnvironment(
-          teamEnvironment.name,
-          teamEnvironment.teamID,
-          null as any,
-        ),
-      ).rejects.toBeDefined();
+      expect(result).toEqualLeft(TEAM_ENVIRONMENT_SHORT_NAME);
    });

    test('should send pubsub message to "team_environment/<teamID>/created" if team environment is created successfully', async () => {
-      mockPrisma.teamEnvironment.create.mockResolvedValueOnce(teamEnvironment);
+      mockPrisma.teamEnvironment.create.mockResolvedValue(teamEnvironment);

      const result = await teamEnvironmentsService.createTeamEnvironment(
        teamEnvironment.name,
        teamEnvironment.teamID,
        JSON.stringify(teamEnvironment.variables),
-      )();
+      );

      expect(mockPubSub.publish).toHaveBeenCalledWith(
        `team_environment/${teamEnvironment.teamID}/created`,
-        result,
+        {
+          ...teamEnvironment,
+          variables: JSON.stringify(teamEnvironment.variables),
+        },
      );
    });
  });

  describe('deleteTeamEnvironment', () => {
-    test('should resolve to true given a valid team environment ID', async () => {
+    test('should successfully delete a TeamEnvironment with a valid ID', async () => {
      mockPrisma.teamEnvironment.delete.mockResolvedValueOnce(teamEnvironment);

      const result = await teamEnvironmentsService.deleteTeamEnvironment(
        teamEnvironment.id,
-      )();
+      );

      expect(result).toEqualRight(true);
    });
@@ -159,7 +119,7 @@ describe('TeamEnvironmentsService', () => {

      const result = await teamEnvironmentsService.deleteTeamEnvironment(
        'invalidid',
-      )();
+      );

      expect(result).toEqualLeft(TEAM_ENVIRONMENT_NOT_FOUND);
    });
@@ -169,7 +129,7 @@ describe('TeamEnvironmentsService', () => {

      const result = await teamEnvironmentsService.deleteTeamEnvironment(
        teamEnvironment.id,
-      )();
+      );

      expect(mockPubSub.publish).toHaveBeenCalledWith(
        `team_environment/${teamEnvironment.teamID}/deleted`,
@@ -182,7 +142,7 @@ describe('TeamEnvironmentsService', () => {
  });

  describe('updateVariablesInTeamEnvironment', () => {
-    test('should add new variable to a team environment', async () => {
+    test('should successfully add new variable to a team environment', async () => {
      mockPrisma.teamEnvironment.update.mockResolvedValueOnce({
        ...teamEnvironment,
        variables: [{ key: 'value' }],
@@ -192,7 +152,7 @@ describe('TeamEnvironmentsService', () => {
        teamEnvironment.id,
        teamEnvironment.name,
        JSON.stringify([{ key: 'value' }]),
-      )();
+      );

      expect(result).toEqualRight(<TeamEnvironment>{
        ...teamEnvironment,
@@ -200,7 +160,7 @@ describe('TeamEnvironmentsService', () => {
      });
    });

-    test('should add new variable to already existing list of variables in a team environment', async () => {
+    test('should successfully add new variable to already existing list of variables in a team environment', async () => {
      mockPrisma.teamEnvironment.update.mockResolvedValueOnce({
        ...teamEnvironment,
        variables: [{ key: 'value' }, { key_2: 'value_2' }],
@@ -210,7 +170,7 @@ describe('TeamEnvironmentsService', () => {
        teamEnvironment.id,
        teamEnvironment.name,
        JSON.stringify([{ key: 'value' }, { key_2: 'value_2' }]),
-      )();
+      );

      expect(result).toEqualRight(<TeamEnvironment>{
        ...teamEnvironment,
@@ -218,7 +178,7 @@ describe('TeamEnvironmentsService', () => {
      });
    });

-    test('should edit existing variables in a team environment', async () => {
+    test('should successfully edit existing variables in a team environment', async () => {
      mockPrisma.teamEnvironment.update.mockResolvedValueOnce({
        ...teamEnvironment,
        variables: [{ key: '1234' }],
@@ -228,7 +188,7 @@ describe('TeamEnvironmentsService', () => {
        teamEnvironment.id,
        teamEnvironment.name,
        JSON.stringify([{ key: '1234' }]),
-      )();
+      );

      expect(result).toEqualRight(<TeamEnvironment>{
        ...teamEnvironment,
@@ -236,22 +196,7 @@ describe('TeamEnvironmentsService', () => {
      });
    });

-    test('should delete existing variable in a team environment', async () => {
-      mockPrisma.teamEnvironment.update.mockResolvedValueOnce(teamEnvironment);
-
-      const result = await teamEnvironmentsService.updateTeamEnvironment(
-        teamEnvironment.id,
-        teamEnvironment.name,
-        JSON.stringify([{}]),
-      )();
-
-      expect(result).toEqualRight(<TeamEnvironment>{
-        ...teamEnvironment,
-        variables: JSON.stringify([{}]),
-      });
-    });
-
-    test('should edit name of an existing team environment', async () => {
+    test('should successfully edit name of an existing team environment', async () => {
      mockPrisma.teamEnvironment.update.mockResolvedValueOnce({
        ...teamEnvironment,
        variables: [{ key: '123' }],
@@ -261,7 +206,7 @@ describe('TeamEnvironmentsService', () => {
        teamEnvironment.id,
        teamEnvironment.name,
        JSON.stringify([{ key: '123' }]),
-      )();
+      );

      expect(result).toEqualRight(<TeamEnvironment>{
        ...teamEnvironment,
@@ -269,14 +214,24 @@ describe('TeamEnvironmentsService', () => {
      });
    });

-    test('should reject to TEAM_ENVIRONMMENT_NOT_FOUND if provided id is invalid', async () => {
+    test('should throw TEAM_ENVIRONMENT_SHORT_NAME if input TeamEnvironment name is invalid', async () => {
+      const result = await teamEnvironmentsService.updateTeamEnvironment(
+        teamEnvironment.id,
+        '12',
+        JSON.stringify([{ key: 'value' }]),
+      );
+
+      expect(result).toEqualLeft(TEAM_ENVIRONMENT_SHORT_NAME);
+    });
+
+    test('should throw TEAM_ENVIRONMMENT_NOT_FOUND if provided id is invalid', async () => {
      mockPrisma.teamEnvironment.update.mockRejectedValue('RecordNotFound');

      const result = await teamEnvironmentsService.updateTeamEnvironment(
        'invalidid',
        teamEnvironment.name,
        JSON.stringify(teamEnvironment.variables),
-      )();
+      );

      expect(result).toEqualLeft(TEAM_ENVIRONMENT_NOT_FOUND);
    });
@@ -288,7 +243,7 @@ describe('TeamEnvironmentsService', () => {
        teamEnvironment.id,
        teamEnvironment.name,
        JSON.stringify([{ key: 'value' }]),
-      )();
+      );

      expect(mockPubSub.publish).toHaveBeenCalledWith(
        `team_environment/${teamEnvironment.teamID}/updated`,
@@ -301,13 +256,13 @@ describe('TeamEnvironmentsService', () => {
  });

  describe('deleteAllVariablesFromTeamEnvironment', () => {
-    test('should delete all variables in a team environment', async () => {
+    test('should successfully delete all variables in a team environment', async () => {
      mockPrisma.teamEnvironment.update.mockResolvedValueOnce(teamEnvironment);

      const result =
        await teamEnvironmentsService.deleteAllVariablesFromTeamEnvironment(
          teamEnvironment.id,
-        )();
+        );

      expect(result).toEqualRight(<TeamEnvironment>{
        ...teamEnvironment,
@@ -315,13 +270,13 @@ describe('TeamEnvironmentsService', () => {
      });
    });

-    test('should reject to TEAM_ENVIRONMMENT_NOT_FOUND if provided id is invalid', async () => {
+    test('should throw TEAM_ENVIRONMMENT_NOT_FOUND if provided id is invalid', async () => {
      mockPrisma.teamEnvironment.update.mockRejectedValue('RecordNotFound');

      const result =
        await teamEnvironmentsService.deleteAllVariablesFromTeamEnvironment(
          'invalidid',
-        )();
+        );

      expect(result).toEqualLeft(TEAM_ENVIRONMENT_NOT_FOUND);
    });
@@ -332,7 +287,7 @@ describe('TeamEnvironmentsService', () => {
      const result =
        await teamEnvironmentsService.deleteAllVariablesFromTeamEnvironment(
          teamEnvironment.id,
-        )();
+        );

      expect(mockPubSub.publish).toHaveBeenCalledWith(
        `team_environment/${teamEnvironment.teamID}/updated`,
@@ -345,56 +300,58 @@ describe('TeamEnvironmentsService', () => {
  });

  describe('createDuplicateEnvironment', () => {
-    test('should duplicate an existing team environment', async () => {
-      mockPrisma.teamEnvironment.findFirst.mockResolvedValueOnce(
+    test('should successfully duplicate an existing team environment', async () => {
+      mockPrisma.teamEnvironment.findFirstOrThrow.mockResolvedValueOnce(
        teamEnvironment,
      );

      mockPrisma.teamEnvironment.create.mockResolvedValueOnce({
-        ...teamEnvironment,
        id: 'newid',
+        ...teamEnvironment,
      });

      const result = await teamEnvironmentsService.createDuplicateEnvironment(
        teamEnvironment.id,
-      )();
+      );

      expect(result).toEqualRight(<TeamEnvironment>{
-        ...teamEnvironment,
        id: 'newid',
+        ...teamEnvironment,
        variables: JSON.stringify(teamEnvironment.variables),
      });
    });

-    test('should reject to TEAM_ENVIRONMMENT_NOT_FOUND if provided id is invalid', async () => {
-      mockPrisma.teamEnvironment.findFirst.mockRejectedValue('NotFoundError');
+    test('should throw TEAM_ENVIRONMMENT_NOT_FOUND if provided id is invalid', async () => {
+      mockPrisma.teamEnvironment.findFirstOrThrow.mockRejectedValue(
+        'NotFoundError',
+      );

      const result = await teamEnvironmentsService.createDuplicateEnvironment(
        teamEnvironment.id,
-      )();
+      );

      expect(result).toEqualLeft(TEAM_ENVIRONMENT_NOT_FOUND);
    });

    test('should send pubsub message to "team_environment/<teamID>/created" if team environment is updated successfully', async () => {
-      mockPrisma.teamEnvironment.findFirst.mockResolvedValueOnce(
+      mockPrisma.teamEnvironment.findFirstOrThrow.mockResolvedValueOnce(
        teamEnvironment,
      );

      mockPrisma.teamEnvironment.create.mockResolvedValueOnce({
-        ...teamEnvironment,
        id: 'newid',
+        ...teamEnvironment,
      });

      const result = await teamEnvironmentsService.createDuplicateEnvironment(
        teamEnvironment.id,
-      )();
+      );

      expect(mockPubSub.publish).toHaveBeenCalledWith(
        `team_environment/${teamEnvironment.teamID}/created`,
        {
-          ...teamEnvironment,
          id: 'newid',
+          ...teamEnvironment,
          variables: JSON.stringify([{}]),
        },
      );
--- a/packages/hoppscotch-backend/src/team-environments/team-environments.service.ts
+++ b/packages/hoppscotch-backend/src/team-environments/team-environments.service.ts
@@ -1,15 +1,14 @@
 import { Injectable } from '@nestjs/common';
-import { pipe } from 'fp-ts/function';
-import * as T from 'fp-ts/Task';
-import * as TO from 'fp-ts/TaskOption';
-import * as TE from 'fp-ts/TaskEither';
-import * as A from 'fp-ts/Array';
-import { Prisma } from '@prisma/client';
+import { TeamEnvironment as DBTeamEnvironment, Prisma } from '@prisma/client';
 import { PrismaService } from 'src/prisma/prisma.service';
 import { PubSubService } from 'src/pubsub/pubsub.service';
 import { TeamEnvironment } from './team-environments.model';
-import { TEAM_ENVIRONMENT_NOT_FOUND } from 'src/errors';
-
+import {
+  TEAM_ENVIRONMENT_NOT_FOUND,
+  TEAM_ENVIRONMENT_SHORT_NAME,
+} from 'src/errors';
+import * as E from 'fp-ts/Either';
+import { isValidLength } from 'src/utils';
@Injectable()
 export class TeamEnvironmentsService {
  constructor(
@@ -17,219 +16,217 @@ export class TeamEnvironmentsService {
    private readonly pubsub: PubSubService,
  ) {}

-  getTeamEnvironment(id: string) {
-    return TO.tryCatch(() =>
-      this.prisma.teamEnvironment.findFirst({
-        where: { id },
-        rejectOnNotFound: true,
-      }),
-    );
+  TITLE_LENGTH = 3;
+
+  /**
+   * TeamEnvironments are saved in the DB in the following way
+   * [{ key: value }, { key: value },....]
+   *
+   */
+
+  /**
+   * Typecast a database TeamEnvironment to a TeamEnvironment model
+   * @param teamEnvironment database TeamEnvironment
+   * @returns TeamEnvironment model
+   */
+  private cast(teamEnvironment: DBTeamEnvironment): TeamEnvironment {
+    return {
+      id: teamEnvironment.id,
+      name: teamEnvironment.name,
+      teamID: teamEnvironment.teamID,
+      variables: JSON.stringify(teamEnvironment.variables),
+    };
  }

-  createTeamEnvironment(name: string, teamID: string, variables: string) {
-    return pipe(
-      () =>
-        this.prisma.teamEnvironment.create({
-          data: {
-            name: name,
-            teamID: teamID,
-            variables: JSON.parse(variables),
-          },
-        }),
-      T.chainFirst(
-        (environment) => () =>
-          this.pubsub.publish(
-            `team_environment/${environment.teamID}/created`,
-            <TeamEnvironment>{
-              id: environment.id,
-              name: environment.name,
-              teamID: environment.teamID,
-              variables: JSON.stringify(environment.variables),
-            },
-          ),
-      ),
-      T.map((data) => {
-        return <TeamEnvironment>{
-          id: data.id,
-          name: data.name,
-          teamID: data.teamID,
-          variables: JSON.stringify(data.variables),
-        };
-      }),
-    );
+  /**
+   * Get details of a TeamEnvironment.
+   *
+   * @param id TeamEnvironment ID
+   * @returns Either of a TeamEnvironment or error message
+   */
+  async getTeamEnvironment(id: string) {
+    try {
+      const teamEnvironment =
+        await this.prisma.teamEnvironment.findFirstOrThrow({
+          where: { id },
+        });
+      return E.right(teamEnvironment);
+    } catch (error) {
+      return E.left(TEAM_ENVIRONMENT_NOT_FOUND);
+    }
  }

-  deleteTeamEnvironment(id: string) {
-    return pipe(
-      TE.tryCatch(
-        () =>
-          this.prisma.teamEnvironment.delete({
-            where: {
-              id: id,
-            },
-          }),
-        () => TEAM_ENVIRONMENT_NOT_FOUND,
-      ),
-      TE.chainFirst((environment) =>
-        TE.fromTask(() =>
-          this.pubsub.publish(
-            `team_environment/${environment.teamID}/deleted`,
-            <TeamEnvironment>{
-              id: environment.id,
-              name: environment.name,
-              teamID: environment.teamID,
-              variables: JSON.stringify(environment.variables),
-            },
-          ),
-        ),
-      ),
-      TE.map((data) => true),
+  /**
+   *  Create a new TeamEnvironment.
+   *
+   * @param name name of new TeamEnvironment
+   * @param teamID teamID of new TeamEnvironment
+   * @param variables JSONified string of contents of new TeamEnvironment
+   * @returns Either of a TeamEnvironment or error message
+   */
+  async createTeamEnvironment(name: string, teamID: string, variables: string) {
+    const isTitleValid = isValidLength(name, this.TITLE_LENGTH);
+    if (!isTitleValid) return E.left(TEAM_ENVIRONMENT_SHORT_NAME);
+
+    const result = await this.prisma.teamEnvironment.create({
+      data: {
+        name: name,
+        teamID: teamID,
+        variables: JSON.parse(variables),
+      },
+    });
+
+    const createdTeamEnvironment = this.cast(result);
+
+    this.pubsub.publish(
+      `team_environment/${createdTeamEnvironment.teamID}/created`,
+      createdTeamEnvironment,
    );
+
+    return E.right(createdTeamEnvironment);
  }

-  updateTeamEnvironment(id: string, name: string, variables: string) {
-    return pipe(
-      TE.tryCatch(
-        () =>
-          this.prisma.teamEnvironment.update({
-            where: { id: id },
-            data: {
-              name,
-              variables: JSON.parse(variables),
-            },
-          }),
-        () => TEAM_ENVIRONMENT_NOT_FOUND,
-      ),
-      TE.chainFirst((environment) =>
-        TE.fromTask(() =>
-          this.pubsub.publish(
-            `team_environment/${environment.teamID}/updated`,
-            <TeamEnvironment>{
-              id: environment.id,
-              name: environment.name,
-              teamID: environment.teamID,
-              variables: JSON.stringify(environment.variables),
-            },
-          ),
-        ),
-      ),
-      TE.map(
-        (environment) =>
-          <TeamEnvironment>{
-            id: environment.id,
-            name: environment.name,
-            teamID: environment.teamID,
-            variables: JSON.stringify(environment.variables),
-          },
-      ),
-    );
+  /**
+   * Delete a TeamEnvironment.
+   *
+   * @param id TeamEnvironment ID
+   * @returns Either of boolean or error message
+   */
+  async deleteTeamEnvironment(id: string) {
+    try {
+      const result = await this.prisma.teamEnvironment.delete({
+        where: {
+          id: id,
+        },
+      });
+
+      const deletedTeamEnvironment = this.cast(result);
+
+      this.pubsub.publish(
+        `team_environment/${deletedTeamEnvironment.teamID}/deleted`,
+        deletedTeamEnvironment,
+      );
+
+      return E.right(true);
+    } catch (error) {
+      return E.left(TEAM_ENVIRONMENT_NOT_FOUND);
+    }
  }

-  deleteAllVariablesFromTeamEnvironment(id: string) {
-    return pipe(
-      TE.tryCatch(
-        () =>
-          this.prisma.teamEnvironment.update({
-            where: { id: id },
-            data: {
-              variables: [],
-            },
-          }),
-        () => TEAM_ENVIRONMENT_NOT_FOUND,
-      ),
-      TE.chainFirst((environment) =>
-        TE.fromTask(() =>
-          this.pubsub.publish(
-            `team_environment/${environment.teamID}/updated`,
-            <TeamEnvironment>{
-              id: environment.id,
-              name: environment.name,
-              teamID: environment.teamID,
-              variables: JSON.stringify(environment.variables),
-            },
-          ),
-        ),
-      ),
-      TE.map(
-        (environment) =>
-          <TeamEnvironment>{
-            id: environment.id,
-            name: environment.name,
-            teamID: environment.teamID,
-            variables: JSON.stringify(environment.variables),
-          },
-      ),
-    );
+  /**
+   * Update a TeamEnvironment.
+   *
+   * @param id TeamEnvironment ID
+   * @param name TeamEnvironment name
+   * @param variables JSONified string of contents of new TeamEnvironment
+   * @returns Either of a TeamEnvironment or error message
+   */
+  async updateTeamEnvironment(id: string, name: string, variables: string) {
+    try {
+      const isTitleValid = isValidLength(name, this.TITLE_LENGTH);
+      if (!isTitleValid) return E.left(TEAM_ENVIRONMENT_SHORT_NAME);
+
+      const result = await this.prisma.teamEnvironment.update({
+        where: { id: id },
+        data: {
+          name,
+          variables: JSON.parse(variables),
+        },
+      });
+
+      const updatedTeamEnvironment = this.cast(result);
+
+      this.pubsub.publish(
+        `team_environment/${updatedTeamEnvironment.teamID}/updated`,
+        updatedTeamEnvironment,
+      );
+
+      return E.right(updatedTeamEnvironment);
+    } catch (error) {
+      return E.left(TEAM_ENVIRONMENT_NOT_FOUND);
+    }
  }

-  createDuplicateEnvironment(id: string) {
-    return pipe(
-      TE.tryCatch(
-        () =>
-          this.prisma.teamEnvironment.findFirst({
-            where: {
-              id: id,
-            },
-            rejectOnNotFound: true,
-          }),
-        () => TEAM_ENVIRONMENT_NOT_FOUND,
-      ),
-      TE.chain((environment) =>
-        TE.fromTask(() =>
-          this.prisma.teamEnvironment.create({
-            data: {
-              name: environment.name,
-              teamID: environment.teamID,
-              variables: environment.variables as Prisma.JsonArray,
-            },
-          }),
-        ),
-      ),
-      TE.chainFirst((environment) =>
-        TE.fromTask(() =>
-          this.pubsub.publish(
-            `team_environment/${environment.teamID}/created`,
-            <TeamEnvironment>{
-              id: environment.id,
-              name: environment.name,
-              teamID: environment.teamID,
-              variables: JSON.stringify(environment.variables),
-            },
-          ),
-        ),
-      ),
-      TE.map(
-        (environment) =>
-          <TeamEnvironment>{
-            id: environment.id,
-            name: environment.name,
-            teamID: environment.teamID,
-            variables: JSON.stringify(environment.variables),
-          },
-      ),
-    );
+  /**
+   * Clear contents of a TeamEnvironment.
+   *
+   * @param id TeamEnvironment ID
+   * @returns Either of a TeamEnvironment or error message
+   */
+  async deleteAllVariablesFromTeamEnvironment(id: string) {
+    try {
+      const result = await this.prisma.teamEnvironment.update({
+        where: { id: id },
+        data: {
+          variables: [],
+        },
+      });
+
+      const teamEnvironment = this.cast(result);
+
+      this.pubsub.publish(
+        `team_environment/${teamEnvironment.teamID}/updated`,
+        teamEnvironment,
+      );
+
+      return E.right(teamEnvironment);
+    } catch (error) {
+      return E.left(TEAM_ENVIRONMENT_NOT_FOUND);
+    }
  }

-  fetchAllTeamEnvironments(teamID: string) {
-    return pipe(
-      () =>
-        this.prisma.teamEnvironment.findMany({
-          where: {
-            teamID: teamID,
-          },
-        }),
-      T.map(
-        A.map(
-          (environment) =>
-            <TeamEnvironment>{
-              id: environment.id,
-              name: environment.name,
-              teamID: environment.teamID,
-              variables: JSON.stringify(environment.variables),
-            },
-        ),
-      ),
-    );
+  /**
+   * Create a duplicate of a existing TeamEnvironment.
+   *
+   * @param id TeamEnvironment ID
+   * @returns Either of a TeamEnvironment or error message
+   */
+  async createDuplicateEnvironment(id: string) {
+    try {
+      const environment = await this.prisma.teamEnvironment.findFirstOrThrow({
+        where: {
+          id: id,
+        },
+      });
+
+      const result = await this.prisma.teamEnvironment.create({
+        data: {
+          name: environment.name,
+          teamID: environment.teamID,
+          variables: environment.variables as Prisma.JsonArray,
+        },
+      });
+
+      const duplicatedTeamEnvironment = this.cast(result);
+
+      this.pubsub.publish(
+        `team_environment/${duplicatedTeamEnvironment.teamID}/created`,
+        duplicatedTeamEnvironment,
+      );
+
+      return E.right(duplicatedTeamEnvironment);
+    } catch (error) {
+      return E.left(TEAM_ENVIRONMENT_NOT_FOUND);
+    }
+  }
+
+  /**
+   * Fetch all TeamEnvironments of a team.
+   *
+   * @param teamID teamID of new TeamEnvironment
+   * @returns List of TeamEnvironments
+   */
+  async fetchAllTeamEnvironments(teamID: string) {
+    const result = await this.prisma.teamEnvironment.findMany({
+      where: {
+        teamID: teamID,
+      },
+    });
+    const teamEnvironments = result.map((item) => {
+      return this.cast(item);
+    });
+
+    return teamEnvironments;
  }

  /**
--- a/packages/hoppscotch-backend/src/team-environments/team.resolver.ts
+++ b/packages/hoppscotch-backend/src/team-environments/team.resolver.ts
@@ -11,6 +11,6 @@ export class TeamEnvsTeamResolver {
    description: 'Returns all Team Environments for the given Team',
  })
  teamEnvironments(@Parent() team: Team): Promise<TeamEnvironment[]> {
-    return this.teamEnvironmentService.fetchAllTeamEnvironments(team.id)();
+    return this.teamEnvironmentService.fetchAllTeamEnvironments(team.id);
  }
 }
--- a/packages/hoppscotch-backend/src/team-invitation/input-type.args.ts
+++ b/packages/hoppscotch-backend/src/team-invitation/input-type.args.ts
@@ -0,0 +1,20 @@
+import { ArgsType, Field, ID } from '@nestjs/graphql';
+import { TeamMemberRole } from 'src/team/team.model';
+
+@ArgsType()
+export class CreateTeamInvitationArgs {
+  @Field(() => ID, {
+    name: 'teamID',
+    description: 'ID of the Team ID to invite from',
+  })
+  teamID: string;
+
+  @Field({ name: 'inviteeEmail', description: 'Email of the user to invite' })
+  inviteeEmail: string;
+
+  @Field(() => TeamMemberRole, {
+    name: 'inviteeRole',
+    description: 'Role to be given to the user',
+  })
+  inviteeRole: TeamMemberRole;
+}
--- a/packages/hoppscotch-backend/src/team-invitation/team-invitation.resolver.ts
+++ b/packages/hoppscotch-backend/src/team-invitation/team-invitation.resolver.ts
@@ -12,15 +12,10 @@ import { TeamInvitation } from './team-invitation.model';
 import { TeamInvitationService } from './team-invitation.service';
 import { pipe } from 'fp-ts/function';
 import * as TE from 'fp-ts/TaskEither';
+import * as E from 'fp-ts/Either';
 import * as O from 'fp-ts/Option';
 import { Team, TeamMember, TeamMemberRole } from 'src/team/team.model';
-import { EmailCodec } from 'src/types/Email';
-import {
-  INVALID_EMAIL,
-  TEAM_INVITE_EMAIL_DO_NOT_MATCH,
-  TEAM_INVITE_NO_INVITE_FOUND,
-  USER_NOT_FOUND,
-} from 'src/errors';
+import { TEAM_INVITE_NO_INVITE_FOUND, USER_NOT_FOUND } from 'src/errors';
 import { GqlUser } from 'src/decorators/gql-user.decorator';
 import { User } from 'src/user/user.model';
 import { UseGuards } from '@nestjs/common';
@@ -36,6 +31,8 @@ import { UserService } from 'src/user/user.service';
 import { PubSubService } from 'src/pubsub/pubsub.service';
 import { GqlThrottlerGuard } from 'src/guards/gql-throttler.guard';
 import { SkipThrottle } from '@nestjs/throttler';
+import { AuthUser } from 'src/types/AuthUser';
+import { CreateTeamInvitationArgs } from './input-type.args';

@UseGuards(GqlThrottlerGuard)
@Resolver(() => TeamInvitation)
@@ -79,8 +76,8 @@ export class TeamInvitationResolver {
      'Gets the Team Invitation with the given ID, or null if not exists',
  })
  @UseGuards(GqlAuthGuard, TeamInviteViewerGuard)
-  teamInvitation(
-    @GqlUser() user: User,
+  async teamInvitation(
+    @GqlUser() user: AuthUser,
    @Args({
      name: 'inviteID',
      description: 'ID of the Team Invitation to lookup',
@@ -88,17 +85,11 @@ export class TeamInvitationResolver {
    })
    inviteID: string,
  ): Promise<TeamInvitation> {
-    return pipe(
-      this.teamInvitationService.getInvitation(inviteID),
-      TE.fromTaskOption(() => TEAM_INVITE_NO_INVITE_FOUND),
-      TE.chainW(
-        TE.fromPredicate(
-          (a) => a.inviteeEmail.toLowerCase() === user.email?.toLowerCase(),
-          () => TEAM_INVITE_EMAIL_DO_NOT_MATCH,
-        ),
-      ),
-      TE.getOrElse(throwErr),
-    )();
+    const teamInvitation = await this.teamInvitationService.getInvitation(
+      inviteID,
+    );
+    if (O.isNone(teamInvitation)) throwErr(TEAM_INVITE_NO_INVITE_FOUND);
+    return teamInvitation.value;
  }

  @Mutation(() => TeamInvitation, {
@@ -106,56 +97,19 @@ export class TeamInvitationResolver {
  })
  @UseGuards(GqlAuthGuard, GqlTeamMemberGuard)
  @RequiresTeamRole(TeamMemberRole.OWNER)
-  createTeamInvitation(
-    @GqlUser()
-    user: User,
-
-    @Args({
-      name: 'teamID',
-      description: 'ID of the Team ID to invite from',
-      type: () => ID,
-    })
-    teamID: string,
-    @Args({
-      name: 'inviteeEmail',
-      description: 'Email of the user to invite',
-    })
-    inviteeEmail: string,
-    @Args({
-      name: 'inviteeRole',
-      type: () => TeamMemberRole,
-      description: 'Role to be given to the user',
-    })
-    inviteeRole: TeamMemberRole,
+  async createTeamInvitation(
+    @GqlUser() user: AuthUser,
+    @Args() args: CreateTeamInvitationArgs,
  ): Promise<TeamInvitation> {
-    return pipe(
-      TE.Do,
+    const teamInvitation = await this.teamInvitationService.createInvitation(
+      user,
+      args.teamID,
+      args.inviteeEmail,
+      args.inviteeRole,
+    );

-      // Validate email
-      TE.bindW('email', () =>
-        pipe(
-          EmailCodec.decode(inviteeEmail),
-          TE.fromEither,
-          TE.mapLeft(() => INVALID_EMAIL),
-        ),
-      ),
-
-      // Validate and get Team
-      TE.bindW('team', () => this.teamService.getTeamWithIDTE(teamID)),
-
-      // Create team
-      TE.chainW(({ email, team }) =>
-        this.teamInvitationService.createInvitation(
-          user,
-          team,
-          email,
-          inviteeRole,
-        ),
-      ),
-
-      // If failed, throw err (so the message is passed) else return value
-      TE.getOrElse(throwErr),
-    )();
+    if (E.isLeft(teamInvitation)) throwErr(teamInvitation.left);
+    return teamInvitation.right;
  }

  @Mutation(() => Boolean, {
@@ -163,7 +117,7 @@ export class TeamInvitationResolver {
  })
  @UseGuards(GqlAuthGuard, TeamInviteTeamOwnerGuard)
  @RequiresTeamRole(TeamMemberRole.OWNER)
-  revokeTeamInvitation(
+  async revokeTeamInvitation(
    @Args({
      name: 'inviteID',
      type: () => ID,
@@ -171,19 +125,19 @@ export class TeamInvitationResolver {
    })
    inviteID: string,
  ): Promise<true> {
-    return pipe(
-      this.teamInvitationService.revokeInvitation(inviteID),
-      TE.map(() => true as const),
-      TE.getOrElse(throwErr),
-    )();
+    const isRevoked = await this.teamInvitationService.revokeInvitation(
+      inviteID,
+    );
+    if (E.isLeft(isRevoked)) throwErr(isRevoked.left);
+    return true;
  }

  @Mutation(() => TeamMember, {
    description: 'Accept an Invitation',
  })
  @UseGuards(GqlAuthGuard, TeamInviteeGuard)
-  acceptTeamInvitation(
-    @GqlUser() user: User,
+  async acceptTeamInvitation(
+    @GqlUser() user: AuthUser,
    @Args({
      name: 'inviteID',
      type: () => ID,
@@ -191,10 +145,12 @@ export class TeamInvitationResolver {
    })
    inviteID: string,
  ): Promise<TeamMember> {
-    return pipe(
-      this.teamInvitationService.acceptInvitation(inviteID, user),
-      TE.getOrElse(throwErr),
-    )();
+    const teamMember = await this.teamInvitationService.acceptInvitation(
+      inviteID,
+      user,
+    );
+    if (E.isLeft(teamMember)) throwErr(teamMember.left);
+    return teamMember.right;
  }

  // Subscriptions
--- a/packages/hoppscotch-backend/src/team-invitation/team-invitation.service.ts
+++ b/packages/hoppscotch-backend/src/team-invitation/team-invitation.service.ts
@@ -1,24 +1,25 @@
 import { Injectable } from '@nestjs/common';
-import * as T from 'fp-ts/Task';
 import * as O from 'fp-ts/Option';
-import * as TO from 'fp-ts/TaskOption';
-import * as TE from 'fp-ts/TaskEither';
-import { pipe, flow, constVoid } from 'fp-ts/function';
+import * as E from 'fp-ts/Either';
 import { PrismaService } from 'src/prisma/prisma.service';
-import { Team, TeamMemberRole } from 'src/team/team.model';
-import { Email } from 'src/types/Email';
-import { User } from 'src/user/user.model';
+import { TeamInvitation as DBTeamInvitation } from '@prisma/client';
+import { TeamMember, TeamMemberRole } from 'src/team/team.model';
 import { TeamService } from 'src/team/team.service';
 import {
+  INVALID_EMAIL,
+  TEAM_INVALID_ID,
  TEAM_INVITE_ALREADY_MEMBER,
  TEAM_INVITE_EMAIL_DO_NOT_MATCH,
  TEAM_INVITE_MEMBER_HAS_INVITE,
  TEAM_INVITE_NO_INVITE_FOUND,
+  TEAM_MEMBER_NOT_FOUND,
 } from 'src/errors';
 import { TeamInvitation } from './team-invitation.model';
 import { MailerService } from 'src/mailer/mailer.service';
 import { UserService } from 'src/user/user.service';
 import { PubSubService } from 'src/pubsub/pubsub.service';
+import { validateEmail } from '../utils';
+import { AuthUser } from 'src/types/AuthUser';

@Injectable()
 export class TeamInvitationService {
@@ -29,245 +30,221 @@ export class TeamInvitationService {
    private readonly mailerService: MailerService,

    private readonly pubsub: PubSubService,
-  ) {
-    this.getInvitation = this.getInvitation.bind(this);
-  }
+  ) {}

-  getInvitation(inviteID: string): TO.TaskOption<TeamInvitation> {
-    return pipe(
-      () =>
-        this.prisma.teamInvitation.findUnique({
-          where: {
-            id: inviteID,
-          },
-        }),
-      TO.fromTask,
-      TO.chain(flow(O.fromNullable, TO.fromOption)),
-      TO.map((x) => x as TeamInvitation),
-    );
-  }
-
-  getInvitationWithEmail(email: Email, team: Team) {
-    return pipe(
-      () =>
-        this.prisma.teamInvitation.findUnique({
-          where: {
-            teamID_inviteeEmail: {
-              inviteeEmail: email,
-              teamID: team.id,
-            },
-          },
-        }),
-      TO.fromTask,
-      TO.chain(flow(O.fromNullable, TO.fromOption)),
-    );
-  }
-
-  createInvitation(
-    creator: User,
-    team: Team,
-    inviteeEmail: Email,
-    inviteeRole: TeamMemberRole,
-  ) {
-    return pipe(
-      // Perform all validation checks
-      TE.sequenceArray([
-        // creator should be a TeamMember
-        pipe(
-          this.teamService.getTeamMemberTE(team.id, creator.uid),
-          TE.map(constVoid),
-        ),
-
-        // Invitee should not be a team member
-        pipe(
-          async () => await this.userService.findUserByEmail(inviteeEmail),
-          TO.foldW(
-            () => TE.right(undefined), // If no user, short circuit to completion
-            (user) =>
-              pipe(
-                // If user is found, check if team member
-                this.teamService.getTeamMemberTE(team.id, user.uid),
-                TE.foldW(
-                  () => TE.right(undefined), // Not team-member, this is good
-                  () => TE.left(TEAM_INVITE_ALREADY_MEMBER), // Is team member, not good
-                ),
-              ),
-          ),
-          TE.map(constVoid),
-        ),
-
-        // Should not have an existing invite
-        pipe(
-          this.getInvitationWithEmail(inviteeEmail, team),
-          TE.fromTaskOption(() => null),
-          TE.swap,
-          TE.map(constVoid),
-          TE.mapLeft(() => TEAM_INVITE_MEMBER_HAS_INVITE),
-        ),
-      ]),
-
-      // Create the invitation
-      TE.chainTaskK(
-        () => () =>
-          this.prisma.teamInvitation.create({
-            data: {
-              teamID: team.id,
-              inviteeEmail,
-              inviteeRole,
-              creatorUid: creator.uid,
-            },
-          }),
-      ),
-
-      // Send email, this is a side effect
-      TE.chainFirstTaskK((invitation) =>
-        pipe(
-          this.mailerService.sendMail(inviteeEmail, {
-            template: 'team-invitation',
-            variables: {
-              invitee: creator.displayName ?? 'A Hoppscotch User',
-              action_url: `${process.env.VITE_BASE_URL}/join-team?id=${invitation.id}`,
-              invite_team_name: team.name,
-            },
-          }),
-
-          TE.getOrElseW(() => T.of(undefined)), // This value doesn't matter as we don't mind the return value (chainFirst) as long as the task completes
-        ),
-      ),
-
-      // Send PubSub topic
-      TE.chainFirstTaskK((invitation) =>
-        TE.fromTask(async () => {
-          const inv: TeamInvitation = {
-            id: invitation.id,
-            teamID: invitation.teamID,
-            creatorUid: invitation.creatorUid,
-            inviteeEmail: invitation.inviteeEmail,
-            inviteeRole: TeamMemberRole[invitation.inviteeRole],
-          };
-
-          this.pubsub.publish(`team/${inv.teamID}/invite_added`, inv);
-        }),
-      ),
-
-      // Map to model type
-      TE.map((x) => x as TeamInvitation),
-    );
-  }
-
-  revokeInvitation(inviteID: string) {
-    return pipe(
-      // Make sure invite exists
-      this.getInvitation(inviteID),
-      TE.fromTaskOption(() => TEAM_INVITE_NO_INVITE_FOUND),
-
-      // Delete team invitation
-      TE.chainTaskK(
-        () => () =>
-          this.prisma.teamInvitation.delete({
-            where: {
-              id: inviteID,
-            },
-          }),
-      ),
-
-      // Emit Pubsub Event
-      TE.chainFirst((invitation) =>
-        TE.fromTask(() =>
-          this.pubsub.publish(
-            `team/${invitation.teamID}/invite_removed`,
-            invitation.id,
-          ),
-        ),
-      ),
-
-      // We are not returning anything
-      TE.map(constVoid),
-    );
-  }
-
-  getAllInvitationsInTeam(team: Team) {
-    return pipe(
-      () =>
-        this.prisma.teamInvitation.findMany({
-          where: {
-            teamID: team.id,
-          },
-        }),
-      T.map((x) => x as TeamInvitation[]),
-    );
-  }
-
-  acceptInvitation(inviteID: string, acceptedBy: User) {
-    return pipe(
-      TE.Do,
-
-      // First get the invitation
-      TE.bindW('invitation', () =>
-        pipe(
-          this.getInvitation(inviteID),
-          TE.fromTaskOption(() => TEAM_INVITE_NO_INVITE_FOUND),
-        ),
-      ),
-
-      // Validation checks
-      TE.chainFirstW(({ invitation }) =>
-        TE.sequenceArray([
-          // Make sure the invited user is not part of the team
-          pipe(
-            this.teamService.getTeamMemberTE(invitation.teamID, acceptedBy.uid),
-            TE.swap,
-            TE.bimap(
-              () => TEAM_INVITE_ALREADY_MEMBER,
-              constVoid, // The return type is ignored
-            ),
-          ),
-
-          // Make sure the invited user and accepting user has the same email
-          pipe(
-            undefined,
-            TE.fromPredicate(
-              (a) => acceptedBy.email === invitation.inviteeEmail,
-              () => TEAM_INVITE_EMAIL_DO_NOT_MATCH,
-            ),
-          ),
-        ]),
-      ),
-
-      // Add the team member
-      // TODO: Somehow bring subscriptions to this ?
-      TE.bindW('teamMember', ({ invitation }) =>
-        pipe(
-          TE.tryCatch(
-            () =>
-              this.teamService.addMemberToTeam(
-                invitation.teamID,
-                acceptedBy.uid,
-                invitation.inviteeRole,
-              ),
-            () => TEAM_INVITE_ALREADY_MEMBER, // Can only fail if Team Member already exists, which we checked, but due to async lets assert that here too
-          ),
-        ),
-      ),
-
-      TE.chainFirstW(({ invitation }) => this.revokeInvitation(invitation.id)),
-
-      TE.map(({ teamMember }) => teamMember),
-    );
+  /**
+   * Cast a DBTeamInvitation to a TeamInvitation
+   * @param dbTeamInvitation database TeamInvitation
+   * @returns TeamInvitation model
+   */
+  cast(dbTeamInvitation: DBTeamInvitation): TeamInvitation {
+    return {
+      ...dbTeamInvitation,
+      inviteeRole: TeamMemberRole[dbTeamInvitation.inviteeRole],
+    };
  }

  /**
-   * Fetch the count invitations for a given team.
-   * @param teamID team id
-   * @returns a count team invitations for a team
+   * Get the team invite
+   * @param inviteID invite id
+   * @returns an Option of team invitation or none
   */
-  async getAllTeamInvitations(teamID: string) {
-    const invitations = await this.prisma.teamInvitation.findMany({
+  async getInvitation(inviteID: string) {
+    try {
+      const dbInvitation = await this.prisma.teamInvitation.findUniqueOrThrow({
+        where: {
+          id: inviteID,
+        },
+      });
+
+      return O.some(this.cast(dbInvitation));
+    } catch (e) {
+      return O.none;
+    }
+  }
+
+  /**
+   * Get the team invite for an invitee with email and teamID.
+   * @param inviteeEmail invitee email
+   * @param teamID team id
+   * @returns an Either of team invitation for the invitee or error
+   */
+  async getTeamInviteByEmailAndTeamID(inviteeEmail: string, teamID: string) {
+    const isEmailValid = validateEmail(inviteeEmail);
+    if (!isEmailValid) return E.left(INVALID_EMAIL);
+
+    try {
+      const teamInvite = await this.prisma.teamInvitation.findUniqueOrThrow({
+        where: {
+          teamID_inviteeEmail: {
+            inviteeEmail: inviteeEmail,
+            teamID: teamID,
+          },
+        },
+      });
+
+      return E.right(teamInvite);
+    } catch (e) {
+      return E.left(TEAM_INVITE_NO_INVITE_FOUND);
+    }
+  }
+
+  /**
+   * Create a team invitation
+   * @param creator creator of the invitation
+   * @param teamID team id
+   * @param inviteeEmail invitee email
+   * @param inviteeRole invitee role
+   * @returns an Either of team invitation or error message
+   */
+  async createInvitation(
+    creator: AuthUser,
+    teamID: string,
+    inviteeEmail: string,
+    inviteeRole: TeamMemberRole,
+  ) {
+    // validate email
+    const isEmailValid = validateEmail(inviteeEmail);
+    if (!isEmailValid) return E.left(INVALID_EMAIL);
+
+    // team ID should valid
+    const team = await this.teamService.getTeamWithID(teamID);
+    if (!team) return E.left(TEAM_INVALID_ID);
+
+    // invitation creator should be a TeamMember
+    const isTeamMember = await this.teamService.getTeamMember(
+      team.id,
+      creator.uid,
+    );
+    if (!isTeamMember) return E.left(TEAM_MEMBER_NOT_FOUND);
+
+    // Checking to see if the invitee is already part of the team or not
+    const inviteeUser = await this.userService.findUserByEmail(inviteeEmail);
+    if (O.isSome(inviteeUser)) {
+      // invitee should not already a member
+      const isTeamMember = await this.teamService.getTeamMember(
+        team.id,
+        inviteeUser.value.uid,
+      );
+      if (isTeamMember) return E.left(TEAM_INVITE_ALREADY_MEMBER);
+    }
+
+    // check invitee already invited earlier or not
+    const teamInvitation = await this.getTeamInviteByEmailAndTeamID(
+      inviteeEmail,
+      team.id,
+    );
+    if (E.isRight(teamInvitation)) return E.left(TEAM_INVITE_MEMBER_HAS_INVITE);
+
+    // create the invitation
+    const dbInvitation = await this.prisma.teamInvitation.create({
+      data: {
+        teamID: team.id,
+        inviteeEmail,
+        inviteeRole,
+        creatorUid: creator.uid,
+      },
+    });
+
+    await this.mailerService.sendEmail(inviteeEmail, {
+      template: 'team-invitation',
+      variables: {
+        invitee: creator.displayName ?? 'A Hoppscotch User',
+        action_url: `${process.env.VITE_BASE_URL}/join-team?id=${dbInvitation.id}`,
+        invite_team_name: team.name,
+      },
+    });
+
+    const invitation = this.cast(dbInvitation);
+    this.pubsub.publish(`team/${invitation.teamID}/invite_added`, invitation);
+
+    return E.right(invitation);
+  }
+
+  /**
+   * Revoke a team invitation
+   * @param inviteID invite id
+   * @returns an Either of true or error message
+   */
+  async revokeInvitation(inviteID: string) {
+    // check if the invite exists
+    const invitation = await this.getInvitation(inviteID);
+    if (O.isNone(invitation)) return E.left(TEAM_INVITE_NO_INVITE_FOUND);
+
+    // delete the invite
+    await this.prisma.teamInvitation.delete({
+      where: {
+        id: inviteID,
+      },
+    });
+
+    this.pubsub.publish(
+      `team/${invitation.value.teamID}/invite_removed`,
+      invitation.value.id,
+    );
+
+    return E.right(true);
+  }
+
+  /**
+   * Accept a team invitation
+   * @param inviteID invite id
+   * @param acceptedBy user who accepted the invitation
+   * @returns an Either of team member or error message
+   */
+  async acceptInvitation(inviteID: string, acceptedBy: AuthUser) {
+    // check if the invite exists
+    const invitation = await this.getInvitation(inviteID);
+    if (O.isNone(invitation)) return E.left(TEAM_INVITE_NO_INVITE_FOUND);
+
+    // make sure the user is not already a member of the team
+    const teamMemberInvitee = await this.teamService.getTeamMember(
+      invitation.value.teamID,
+      acceptedBy.uid,
+    );
+    if (teamMemberInvitee) return E.left(TEAM_INVITE_ALREADY_MEMBER);
+
+    // make sure the user is the same as the invitee
+    if (
+      acceptedBy.email.toLowerCase() !==
+      invitation.value.inviteeEmail.toLowerCase()
+    )
+      return E.left(TEAM_INVITE_EMAIL_DO_NOT_MATCH);
+
+    // add the user to the team
+    let teamMember: TeamMember;
+    try {
+      teamMember = await this.teamService.addMemberToTeam(
+        invitation.value.teamID,
+        acceptedBy.uid,
+        invitation.value.inviteeRole,
+      );
+    } catch (e) {
+      return E.left(TEAM_INVITE_ALREADY_MEMBER);
+    }
+
+    // delete the invite
+    await this.revokeInvitation(inviteID);
+
+    return E.right(teamMember);
+  }
+
+  /**
+   * Fetch all team invitations for a given team.
+   * @param teamID team id
+   * @returns array of team invitations for a team
+   */
+  async getTeamInvitations(teamID: string) {
+    const dbInvitations = await this.prisma.teamInvitation.findMany({
      where: {
        teamID: teamID,
      },
    });

+    const invitations: TeamInvitation[] = dbInvitations.map((dbInvitation) =>
+      this.cast(dbInvitation),
+    );
+
    return invitations;
  }
 }
--- a/packages/hoppscotch-backend/src/team-invitation/team-invite-team-owner.guard.ts
+++ b/packages/hoppscotch-backend/src/team-invitation/team-invite-team-owner.guard.ts
@@ -1,21 +1,21 @@
 import { CanActivate, ExecutionContext, Injectable } from '@nestjs/common';
-import { pipe } from 'fp-ts/function';
 import { TeamService } from 'src/team/team.service';
 import { TeamInvitationService } from './team-invitation.service';
 import * as O from 'fp-ts/Option';
-import * as T from 'fp-ts/Task';
-import * as TE from 'fp-ts/TaskEither';
 import { GqlExecutionContext } from '@nestjs/graphql';
 import {
  BUG_AUTH_NO_USER_CTX,
  BUG_TEAM_INVITE_NO_INVITE_ID,
  TEAM_INVITE_NO_INVITE_FOUND,
+  TEAM_MEMBER_NOT_FOUND,
  TEAM_NOT_REQUIRED_ROLE,
 } from 'src/errors';
-import { User } from 'src/user/user.model';
 import { throwErr } from 'src/utils';
 import { TeamMemberRole } from 'src/team/team.model';

+/**
+ * This guard only allows team owner to execute the resolver
+ */
@Injectable()
 export class TeamInviteTeamOwnerGuard implements CanActivate {
  constructor(
@@ -24,48 +24,30 @@ export class TeamInviteTeamOwnerGuard implements CanActivate {
  ) {}

  async canActivate(context: ExecutionContext): Promise<boolean> {
-    return pipe(
-      TE.Do,
+    // Get GQL context
+    const gqlExecCtx = GqlExecutionContext.create(context);

-      TE.bindW('gqlCtx', () => TE.of(GqlExecutionContext.create(context))),
+    // Get user
+    const { user } = gqlExecCtx.getContext().req;
+    if (!user) throwErr(BUG_AUTH_NO_USER_CTX);

-      // Get the invite
-      TE.bindW('invite', ({ gqlCtx }) =>
-        pipe(
-          O.fromNullable(gqlCtx.getArgs<{ inviteID?: string }>().inviteID),
-          TE.fromOption(() => BUG_TEAM_INVITE_NO_INVITE_ID),
-          TE.chainW((inviteID) =>
-            pipe(
-              this.teamInviteService.getInvitation(inviteID),
-              TE.fromTaskOption(() => TEAM_INVITE_NO_INVITE_FOUND),
-            ),
-          ),
-        ),
-      ),
+    // Get the invite
+    const { inviteID } = gqlExecCtx.getArgs<{ inviteID: string }>();
+    if (!inviteID) throwErr(BUG_TEAM_INVITE_NO_INVITE_ID);

-      TE.bindW('user', ({ gqlCtx }) =>
-        pipe(
-          gqlCtx.getContext().req.user,
-          O.fromNullable,
-          TE.fromOption(() => BUG_AUTH_NO_USER_CTX),
-        ),
-      ),
+    const invitation = await this.teamInviteService.getInvitation(inviteID);
+    if (O.isNone(invitation)) throwErr(TEAM_INVITE_NO_INVITE_FOUND);

-      TE.bindW('userMember', ({ invite, user }) =>
-        this.teamService.getTeamMemberTE(invite.teamID, user.uid),
-      ),
+    // Fetch team member details of this user
+    const teamMember = await this.teamService.getTeamMember(
+      invitation.value.teamID,
+      user.uid,
+    );

-      TE.chainW(
-        TE.fromPredicate(
-          ({ userMember }) => userMember.role === TeamMemberRole.OWNER,
-          () => TEAM_NOT_REQUIRED_ROLE,
-        ),
-      ),
+    if (!teamMember) throwErr(TEAM_MEMBER_NOT_FOUND);
+    if (teamMember.role !== TeamMemberRole.OWNER)
+      throwErr(TEAM_NOT_REQUIRED_ROLE);

-      TE.fold(
-        (err) => throwErr(err),
-        () => T.of(true),
-      ),
-    )();
+    return true;
  }
 }
--- a/packages/hoppscotch-backend/src/team-invitation/team-invite-viewer.guard.ts
+++ b/packages/hoppscotch-backend/src/team-invitation/team-invite-viewer.guard.ts
@@ -1,20 +1,23 @@
 import { CanActivate, ExecutionContext, Injectable } from '@nestjs/common';
 import { TeamInvitationService } from './team-invitation.service';
-import { pipe, flow } from 'fp-ts/function';
-import * as TE from 'fp-ts/TaskEither';
-import * as T from 'fp-ts/Task';
 import * as O from 'fp-ts/Option';
 import { GqlExecutionContext } from '@nestjs/graphql';
 import {
  BUG_AUTH_NO_USER_CTX,
  BUG_TEAM_INVITE_NO_INVITE_ID,
-  TEAM_INVITE_NOT_VALID_VIEWER,
  TEAM_INVITE_NO_INVITE_FOUND,
+  TEAM_MEMBER_NOT_FOUND,
 } from 'src/errors';
-import { User } from 'src/user/user.model';
 import { throwErr } from 'src/utils';
 import { TeamService } from 'src/team/team.service';

+/**
+ * This guard only allows user to execute the resolver
+ * 1. If user is invitee, allow
+ * 2. Or else, if user is team member, allow
+ *
+ * TLDR: Allow if user is invitee or team member
+ */
@Injectable()
 export class TeamInviteViewerGuard implements CanActivate {
  constructor(
@@ -23,50 +26,32 @@ export class TeamInviteViewerGuard implements CanActivate {
  ) {}

  async canActivate(context: ExecutionContext): Promise<boolean> {
-    return pipe(
-      TE.Do,
+    // Get GQL context
+    const gqlExecCtx = GqlExecutionContext.create(context);

-      // Get GQL Context
-      TE.bindW('gqlCtx', () => TE.of(GqlExecutionContext.create(context))),
+    // Get user
+    const { user } = gqlExecCtx.getContext().req;
+    if (!user) throwErr(BUG_AUTH_NO_USER_CTX);

-      // Get user
-      TE.bindW('user', ({ gqlCtx }) =>
-        pipe(
-          O.fromNullable(gqlCtx.getContext<{ user?: User }>().user),
-          TE.fromOption(() => BUG_AUTH_NO_USER_CTX),
-        ),
-      ),
+    // Get the invite
+    const { inviteID } = gqlExecCtx.getArgs<{ inviteID: string }>();
+    if (!inviteID) throwErr(BUG_TEAM_INVITE_NO_INVITE_ID);

-      // Get the invite
-      TE.bindW('invite', ({ gqlCtx }) =>
-        pipe(
-          O.fromNullable(gqlCtx.getArgs<{ inviteID?: string }>().inviteID),
-          TE.fromOption(() => BUG_TEAM_INVITE_NO_INVITE_ID),
-          TE.chainW(
-            flow(
-              this.teamInviteService.getInvitation,
-              TE.fromTaskOption(() => TEAM_INVITE_NO_INVITE_FOUND),
-            ),
-          ),
-        ),
-      ),
+    const invitation = await this.teamInviteService.getInvitation(inviteID);
+    if (O.isNone(invitation)) throwErr(TEAM_INVITE_NO_INVITE_FOUND);

-      // Check if the user and the invite email match, else if we can resolver the user as a team member
-      // any better solution ?
-      TE.chainW(({ user, invite }) =>
-        user.email?.toLowerCase() === invite.inviteeEmail.toLowerCase()
-          ? TE.of(true)
-          : pipe(
-              this.teamService.getTeamMemberTE(invite.teamID, user.uid),
-              TE.map(() => true),
-            ),
-      ),
+    // Check if the user and the invite email match, else if user is a team member
+    if (
+      user.email?.toLowerCase() !== invitation.value.inviteeEmail.toLowerCase()
+    ) {
+      const teamMember = await this.teamService.getTeamMember(
+        invitation.value.teamID,
+        user.uid,
+      );

-      TE.mapLeft((e) =>
-        e === 'team/member_not_found' ? TEAM_INVITE_NOT_VALID_VIEWER : e,
-      ),
+      if (!teamMember) throwErr(TEAM_MEMBER_NOT_FOUND);
+    }

-      TE.fold(throwErr, () => T.of(true)),
-    )();
+    return true;
  }
 }
--- a/packages/hoppscotch-backend/src/team-invitation/team-invitee.guard.ts
+++ b/packages/hoppscotch-backend/src/team-invitation/team-invitee.guard.ts
@@ -1,11 +1,7 @@
 import { CanActivate, ExecutionContext, Injectable } from '@nestjs/common';
 import { TeamInvitationService } from './team-invitation.service';
-import { pipe, flow } from 'fp-ts/function';
 import * as O from 'fp-ts/Option';
-import * as T from 'fp-ts/Task';
-import * as TE from 'fp-ts/TaskEither';
 import { GqlExecutionContext } from '@nestjs/graphql';
-import { User } from 'src/user/user.model';
 import {
  BUG_AUTH_NO_USER_CTX,
  BUG_TEAM_INVITE_NO_INVITE_ID,
@@ -24,44 +20,26 @@ export class TeamInviteeGuard implements CanActivate {
  constructor(private readonly teamInviteService: TeamInvitationService) {}

  async canActivate(context: ExecutionContext): Promise<boolean> {
-    return pipe(
-      TE.Do,
+    // Get GQL Context
+    const gqlExecCtx = GqlExecutionContext.create(context);

-      // Get execution context
-      TE.bindW('gqlCtx', () => TE.of(GqlExecutionContext.create(context))),
+    // Get user
+    const { user } = gqlExecCtx.getContext().req;
+    if (!user) throwErr(BUG_AUTH_NO_USER_CTX);

-      // Get user
-      TE.bindW('user', ({ gqlCtx }) =>
-        pipe(
-          O.fromNullable(gqlCtx.getContext<{ user?: User }>().user),
-          TE.fromOption(() => BUG_AUTH_NO_USER_CTX),
-        ),
-      ),
+    // Get the invite
+    const { inviteID } = gqlExecCtx.getArgs<{ inviteID: string }>();
+    if (!inviteID) throwErr(BUG_TEAM_INVITE_NO_INVITE_ID);

-      // Get invite
-      TE.bindW('invite', ({ gqlCtx }) =>
-        pipe(
-          O.fromNullable(gqlCtx.getArgs<{ inviteID?: string }>().inviteID),
-          TE.fromOption(() => BUG_TEAM_INVITE_NO_INVITE_ID),
-          TE.chainW(
-            flow(
-              this.teamInviteService.getInvitation,
-              TE.fromTaskOption(() => TEAM_INVITE_NO_INVITE_FOUND),
-            ),
-          ),
-        ),
-      ),
+    const invitation = await this.teamInviteService.getInvitation(inviteID);
+    if (O.isNone(invitation)) throwErr(TEAM_INVITE_NO_INVITE_FOUND);

-      // Check if the emails match
-      TE.chainW(
-        TE.fromPredicate(
-          ({ user, invite }) => user.email === invite.inviteeEmail,
-          () => TEAM_INVITE_EMAIL_DO_NOT_MATCH,
-        ),
-      ),
+    if (
+      user.email.toLowerCase() !== invitation.value.inviteeEmail.toLowerCase()
+    ) {
+      throwErr(TEAM_INVITE_EMAIL_DO_NOT_MATCH);
+    }

-      // Fold it to a promise
-      TE.fold(throwErr, () => T.of(true)),
-    )();
+    return true;
  }
 }
--- a/packages/hoppscotch-backend/src/team-invitation/team-teaminvite-ext.resolver.ts
+++ b/packages/hoppscotch-backend/src/team-invitation/team-teaminvite-ext.resolver.ts
@@ -12,6 +12,6 @@ export class TeamTeamInviteExtResolver {
    complexity: 10,
  })
  teamInvitations(@Parent() team: Team): Promise<TeamInvitation[]> {
-    return this.teamInviteService.getAllInvitationsInTeam(team)();
+    return this.teamInviteService.getTeamInvitations(team.id);
  }
 }
--- a/packages/hoppscotch-backend/src/team-request/team-request.service.spec.ts
+++ b/packages/hoppscotch-backend/src/team-request/team-request.service.spec.ts
@@ -42,6 +42,7 @@ const teamCollection: DbTeamCollection = {
  id: 'team-coll-1',
  parentID: null,
  teamID: team.id,
+  data: {},
  title: 'Team Collection 1',
  orderIndex: 1,
  createdOn: new Date(),
--- a/packages/hoppscotch-backend/src/types/AuthError.ts
+++ b/packages/hoppscotch-backend/src/types/AuthError.ts
@@ -2,7 +2,7 @@ import { HttpStatus } from '@nestjs/common';

 /**
 ** Custom interface to handle errors specific to Auth module
- ** Since its REST we need to return HTTP status code along with error message
+ ** Since its REST we need to return the HTTP status code along with the error message
 */
 export type AuthError = {
  message: string;
--- a/packages/hoppscotch-backend/src/types/CollectionFolder.ts
+++ b/packages/hoppscotch-backend/src/types/CollectionFolder.ts
@@ -1,6 +1,8 @@
+// This interface defines how data will be received from the app when we are importing Hoppscotch collections
 export interface CollectionFolder {
  id?: string;
  folders: CollectionFolder[];
  requests: any[];
  name: string;
+  data?: string;
 }
--- a/packages/hoppscotch-backend/src/user-collection/input-type.args.ts
+++ b/packages/hoppscotch-backend/src/user-collection/input-type.args.ts
@@ -6,6 +6,13 @@ import { PaginationArgs } from 'src/types/input-types.args';
 export class CreateRootUserCollectionArgs {
  @Field({ name: 'title', description: 'Title of the new user collection' })
  title: string;
+
+  @Field({
+    name: 'data',
+    description: 'JSON string representing the collection data',
+    nullable: true,
+  })
+  data: string;
 }
@ArgsType()
 export class CreateChildUserCollectionArgs {
@@ -17,6 +24,13 @@ export class CreateChildUserCollectionArgs {
    description: 'ID of the parent to the new user collection',
  })
  parentUserCollectionID: string;
+
+  @Field({
+    name: 'data',
+    description: 'JSON string representing the collection data',
+    nullable: true,
+  })
+  data: string;
 }

@ArgsType()
@@ -95,3 +109,26 @@ export class ImportUserCollectionsFromJSONArgs {
  })
  parentCollectionID?: string;
 }
+
+@ArgsType()
+export class UpdateUserCollectionsArgs {
+  @Field(() => ID, {
+    name: 'userCollectionID',
+    description: 'ID of the user collection',
+  })
+  userCollectionID: string;
+
+  @Field({
+    name: 'newTitle',
+    description: 'The updated title of the user collection',
+    nullable: true,
+  })
+  newTitle: string;
+
+  @Field({
+    name: 'data',
+    description: 'JSON string representing the collection data',
+    nullable: true,
+  })
+  data: string;
+}
--- a/packages/hoppscotch-backend/src/user-collection/user-collection.resolver.ts
+++ b/packages/hoppscotch-backend/src/user-collection/user-collection.resolver.ts
@@ -30,6 +30,7 @@ import {
  MoveUserCollectionArgs,
  RenameUserCollectionsArgs,
  UpdateUserCollectionArgs,
+  UpdateUserCollectionsArgs,
 } from './input-type.args';
 import { ReqType } from 'src/types/RequestTypes';
 import * as E from 'fp-ts/Either';
@@ -142,7 +143,13 @@ export class UserCollectionResolver {
    );

    if (E.isLeft(userCollection)) throwErr(userCollection.left);
-    return userCollection.right;
+    return <UserCollection>{
+      ...userCollection.right,
+      userID: userCollection.right.userUid,
+      data: !userCollection.right.data
+        ? null
+        : JSON.stringify(userCollection.right.data),
+    };
  }

  @Query(() => UserCollectionExportJSONData, {
@@ -191,6 +198,7 @@ export class UserCollectionResolver {
      await this.userCollectionService.createUserCollection(
        user,
        args.title,
+        args.data,
        null,
        ReqType.REST,
      );
@@ -212,6 +220,7 @@ export class UserCollectionResolver {
      await this.userCollectionService.createUserCollection(
        user,
        args.title,
+        args.data,
        null,
        ReqType.GQL,
      );
@@ -232,6 +241,7 @@ export class UserCollectionResolver {
      await this.userCollectionService.createUserCollection(
        user,
        args.title,
+        args.data,
        args.parentUserCollectionID,
        ReqType.GQL,
      );
@@ -252,6 +262,7 @@ export class UserCollectionResolver {
      await this.userCollectionService.createUserCollection(
        user,
        args.title,
+        args.data,
        args.parentUserCollectionID,
        ReqType.REST,
      );
@@ -359,6 +370,26 @@ export class UserCollectionResolver {
    return importedCollection.right;
  }

+  @Mutation(() => UserCollection, {
+    description: 'Update a UserCollection',
+  })
+  @UseGuards(GqlAuthGuard)
+  async updateUserCollection(
+    @GqlUser() user: AuthUser,
+    @Args() args: UpdateUserCollectionsArgs,
+  ) {
+    const updatedUserCollection =
+      await this.userCollectionService.updateUserCollection(
+        args.newTitle,
+        args.data,
+        args.userCollectionID,
+        user.uid,
+      );
+
+    if (E.isLeft(updatedUserCollection)) throwErr(updatedUserCollection.left);
+    return updatedUserCollection.right;
+  }
+
  // Subscriptions
  @Subscription(() => UserCollection, {
    description: 'Listen for User Collection Creation',
--- a/packages/hoppscotch-backend/src/user-collection/user-collection.service.spec.ts
+++ b/packages/hoppscotch-backend/src/user-collection/user-collection.service.spec.ts
--- a/packages/hoppscotch-backend/src/user-collection/user-collection.service.ts
+++ b/packages/hoppscotch-backend/src/user-collection/user-collection.service.ts
@@ -12,6 +12,7 @@ import {
  USER_NOT_FOUND,
  USER_NOT_OWNER,
  USER_COLL_INVALID_JSON,
+  USER_COLL_DATA_INVALID,
 } from 'src/errors';
 import { PrismaService } from 'src/prisma/prisma.service';
 import { AuthUser } from 'src/types/AuthUser';
@@ -43,8 +44,12 @@ export class UserCollectionService {
   */
  private cast(collection: UserCollection) {
    return <UserCollectionModel>{
-      ...collection,
+      id: collection.id,
+      title: collection.title,
+      type: collection.type,
+      parentID: collection.parentID,
      userID: collection.userUid,
+      data: !collection.data ? null : JSON.stringify(collection.data),
    };
  }

@@ -146,7 +151,7 @@ export class UserCollectionService {
      },
    });

-    return parent;
+    return !parent ? null : this.cast(parent);
  }

  /**
@@ -164,7 +169,7 @@ export class UserCollectionService {
    take: number,
    type: ReqType,
  ) {
-    return this.prisma.userCollection.findMany({
+    const res = await this.prisma.userCollection.findMany({
      where: {
        parentID: collectionID,
        type: type,
@@ -176,6 +181,12 @@ export class UserCollectionService {
      skip: cursor ? 1 : 0,
      cursor: cursor ? { id: cursor } : undefined,
    });
+
+    const childCollections = res.map((childCollection) =>
+      this.cast(childCollection),
+    );
+
+    return childCollections;
  }

  /**
@@ -211,12 +222,20 @@ export class UserCollectionService {
  async createUserCollection(
    user: AuthUser,
    title: string,
+    data: string | null = null,
    parentUserCollectionID: string | null,
    type: ReqType,
  ) {
    const isTitleValid = isValidLength(title, this.TITLE_LENGTH);
    if (!isTitleValid) return E.left(USER_COLL_SHORT_TITLE);

+    if (data === '') return E.left(USER_COLL_DATA_INVALID);
+    if (data) {
+      const jsonReq = stringToJson(data);
+      if (E.isLeft(jsonReq)) return E.left(USER_COLL_DATA_INVALID);
+      data = jsonReq.right;
+    }
+
    // If creating a child collection
    if (parentUserCollectionID !== null) {
      const parentCollection = await this.getUserCollection(
@@ -251,15 +270,19 @@ export class UserCollectionService {
          },
        },
        parent: isParent,
+        data: data ?? undefined,
        orderIndex: !parentUserCollectionID
          ? (await this.getRootCollectionsCount(user.uid)) + 1
          : (await this.getChildCollectionsCount(parentUserCollectionID)) + 1,
      },
    });

-    await this.pubsub.publish(`user_coll/${user.uid}/created`, userCollection);
+    await this.pubsub.publish(
+      `user_coll/${user.uid}/created`,
+      this.cast(userCollection),
+    );

-    return E.right(userCollection);
+    return E.right(this.cast(userCollection));
  }

  /**
@@ -276,7 +299,7 @@ export class UserCollectionService {
    take: number,
    type: ReqType,
  ) {
-    return this.prisma.userCollection.findMany({
+    const res = await this.prisma.userCollection.findMany({
      where: {
        userUid: user.uid,
        parentID: null,
@@ -289,6 +312,12 @@ export class UserCollectionService {
      skip: cursor ? 1 : 0,
      cursor: cursor ? { id: cursor } : undefined,
    });
+
+    const userCollections = res.map((childCollection) =>
+      this.cast(childCollection),
+    );
+
+    return userCollections;
  }

  /**
@@ -307,7 +336,7 @@ export class UserCollectionService {
    take: number,
    type: ReqType,
  ) {
-    return this.prisma.userCollection.findMany({
+    const res = await this.prisma.userCollection.findMany({
      where: {
        userUid: user.uid,
        parentID: userCollectionID,
@@ -317,9 +346,16 @@ export class UserCollectionService {
      skip: cursor ? 1 : 0,
      cursor: cursor ? { id: cursor } : undefined,
    });
+
+    const childCollections = res.map((childCollection) =>
+      this.cast(childCollection),
+    );
+
+    return childCollections;
  }

  /**
+   * @deprecated Use updateUserCollection method instead
   * Update the title of a UserCollection
   *
   * @param newTitle The new title of collection
@@ -351,10 +387,10 @@ export class UserCollectionService {

      this.pubsub.publish(
        `user_coll/${updatedUserCollection.userUid}/updated`,
-        updatedUserCollection,
+        this.cast(updatedUserCollection),
      );

-      return E.right(updatedUserCollection);
+      return E.right(this.cast(updatedUserCollection));
    } catch (error) {
      return E.left(USER_COLL_NOT_FOUND);
    }
@@ -591,10 +627,10 @@ export class UserCollectionService {

      this.pubsub.publish(
        `user_coll/${collection.right.userUid}/moved`,
-        updatedCollection.right,
+        this.cast(updatedCollection.right),
      );

-      return E.right(updatedCollection.right);
+      return E.right(this.cast(updatedCollection.right));
    }

    // destCollectionID != null i.e move into another collection
@@ -642,10 +678,10 @@ export class UserCollectionService {

    this.pubsub.publish(
      `user_coll/${collection.right.userUid}/moved`,
-      updatedCollection.right,
+      this.cast(updatedCollection.right),
    );

-    return E.right(updatedCollection.right);
+    return E.right(this.cast(updatedCollection.right));
  }

  /**
@@ -846,6 +882,7 @@ export class UserCollectionService {
          ...(x.request as Record<string, unknown>), // type casting x.request of type Prisma.JSONValue to an object to enable spread
        };
      }),
+      data: JSON.stringify(collection.right.data),
    };

    return E.right(result);
@@ -918,6 +955,7 @@ export class UserCollectionService {
              ...(x.request as Record<string, unknown>), // type casting x.request of type Prisma.JSONValue to an object to enable spread
            };
          }),
+          data: JSON.stringify(parentCollection.right.data),
        }),
        collectionType: parentCollection.right.type,
      });
@@ -971,6 +1009,7 @@ export class UserCollectionService {
          this.generatePrismaQueryObj(f, userID, index + 1, reqType),
        ),
      },
+      data: folder.data ?? undefined,
    };
  }

@@ -1040,10 +1079,63 @@ export class UserCollectionService {
      ),
    );

-    userCollections.forEach((x) =>
-      this.pubsub.publish(`user_coll/${userID}/created`, x),
+    userCollections.forEach((collection) =>
+      this.pubsub.publish(`user_coll/${userID}/created`, this.cast(collection)),
    );

    return E.right(true);
  }
+
+  /**
+   * Update a UserCollection
+   *
+   * @param newTitle The new title of collection
+   * @param userCollectionID The Collection Id
+   * @param userID The User UID
+   * @returns An Either of the updated UserCollection
+   */
+  async updateUserCollection(
+    newTitle: string = null,
+    collectionData: string | null = null,
+    userCollectionID: string,
+    userID: string,
+  ) {
+    if (collectionData === '') return E.left(USER_COLL_DATA_INVALID);
+
+    if (collectionData) {
+      const jsonReq = stringToJson(collectionData);
+      if (E.isLeft(jsonReq)) return E.left(USER_COLL_DATA_INVALID);
+      collectionData = jsonReq.right;
+    }
+
+    if (newTitle != null) {
+      const isTitleValid = isValidLength(newTitle, this.TITLE_LENGTH);
+      if (!isTitleValid) return E.left(USER_COLL_SHORT_TITLE);
+    }
+
+    // Check to see is the collection belongs to the user
+    const isOwner = await this.isOwnerCheck(userCollectionID, userID);
+    if (O.isNone(isOwner)) return E.left(USER_NOT_OWNER);
+
+    try {
+      const updatedUserCollection = await this.prisma.userCollection.update({
+        where: {
+          id: userCollectionID,
+        },
+        data: {
+          data: collectionData ?? undefined,
+          title: newTitle ?? undefined,
+        },
+      });
+
+      this.pubsub.publish(
+        `user_coll/${updatedUserCollection.userUid}/updated`,
+        this.cast(updatedUserCollection),
+      );
+
+      return E.right(this.cast(updatedUserCollection));
+    } catch (error) {
+      return E.left(USER_COLL_NOT_FOUND);
+    }
+  }
 }
--- a/packages/hoppscotch-backend/src/user-collection/user-collections.model.ts
+++ b/packages/hoppscotch-backend/src/user-collection/user-collections.model.ts
@@ -13,6 +13,12 @@ export class UserCollection {
  })
  title: string;

+  @Field({
+    description: 'JSON string representing the collection data',
+    nullable: true,
+  })
+  data: string;
+
  @Field(() => ReqType, {
    description: 'Type of the user collection',
  })
--- a/Show More
+++ b/Show More