Merge branch 'main' of github.com:hoppscotch/hoppscotch

Co-authored-by: jamesgeorge007 <25279263+jamesgeorge007@users.noreply.github.com>

.devcontainer/devcontainer.json

@@ -0,0 +1,9 @@
+{
+  "name": "Hoppscotch",
+  "image": "mcr.microsoft.com/devcontainers/typescript-node:18",
+  "forwardPorts": [3000],
+  "features": {
+    "ghcr.io/NicoVIII/devcontainer-features/pnpm:1": {}
+  },
+  "postCreateCommand": "cp .env.example .env && pnpm i"
+}

.dockerignore

@@ -1,104 +1,2 @@
-Dockerfile
-.vscode
-.github
-
-# Created by .ignore support plugin (hsz.mobi)
-
-# Firebase
-.firebase
-
-### Node template
-# Logs
-logs
-*.log
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-
-# Runtime data
-pids
-*.pid
-*.seed
-*.pid.lock
-
-# Directory for instrumented libs generated by jscoverage/JSCover
-lib-cov
-
-# Coverage directory used by tools like istanbul
-coverage
-
-# nyc test coverage
-.nyc_output
-
-# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
-.grunt
-
-# Bower dependency directory (https://bower.io/)
-bower_components
-
-# node-waf configuration
-.lock-wscript
-
-# Compiled binary addons (https://nodejs.org/api/addons.html)
-build/Release
-
-# Dependency directories
-node_modules/
-jspm_packages/
-
-# TypeScript v1 declaration files
-typings/
-
-# Optional npm cache directory
-.npm
-
-# Optional eslint cache
-.eslintcache
-
-# Optional REPL history
-.node_repl_history
-
-# Output of 'npm pack'
-*.tgz
-
-# Yarn Integrity file
-.yarn-integrity
-
-# dotenv environment variables file
-.env
-
-# parcel-bundler cache (https://parceljs.org/)
-.cache
-
-# next.js build output
-.next
-
-# nuxt.js build output
-.nuxt
-
-# Nuxt generate
-dist
-
-# vuepress build output
-.vuepress/dist
-
-# Serverless directories
-.serverless
-
-# IDE / Editor
-.idea
-
-# Service worker
-sw.*
-
-# Mac OSX
-.DS_Store
-
-# Vim swap files
-*.swp
-
-# Build data
-.hoppscotch
-
-# File explorer
-.directory
+node_modules
+**/*/node_modules

.env.example

@@ -1,18 +1,79 @@
-# Google Analytics ID
-GA_ID=UA-61422507-4
+#-----------------------Backend Config------------------------------#
+# Prisma Config
+DATABASE_URL=postgresql://postgres:testpass@hoppscotch-db:5432/hoppscotch
 
-# Google Tag Manager ID
-GTM_ID=GTM-NMKVBMV
+# Auth Tokens Config
+JWT_SECRET="secret1233"
+TOKEN_SALT_COMPLEXITY=10
+MAGIC_LINK_TOKEN_VALIDITY= 3
+REFRESH_TOKEN_VALIDITY="604800000" # Default validity is 7 days (604800000 ms) in ms
+ACCESS_TOKEN_VALIDITY="86400000" # Default validity is 1 day (86400000 ms) in ms
+SESSION_SECRET='add some secret here'
+# Reccomended to be true, set to false if you are using http
+# Note: Some auth providers may not support http requests
+ALLOW_SECURE_COOKIES=true
 
-# Firebase config
-API_KEY=AIzaSyCMsFreESs58-hRxTtiqQrIcimh4i1wbsM
-AUTH_DOMAIN=postwoman-api.firebaseapp.com
-DATABASE_URL=https://postwoman-api.firebaseio.com
-PROJECT_ID=postwoman-api
-STORAGE_BUCKET=postwoman-api.appspot.com
-MESSAGING_SENDER_ID=421993993223
-APP_ID=1:421993993223:web:ec0baa8ee8c02ffa1fc6a2
-MEASUREMENT_ID=G-BBJ3R80PJT
+# Hoppscotch App Domain Config
+REDIRECT_URL="http://localhost:3000"
+WHITELISTED_ORIGINS="http://localhost:3170,http://localhost:3000,http://localhost:3100"
+VITE_ALLOWED_AUTH_PROVIDERS=GOOGLE,GITHUB,MICROSOFT,EMAIL
 
-# Base URL
-BASE_URL=https://hoppscotch.io
+# Google Auth Config
+GOOGLE_CLIENT_ID="************************************************"
+GOOGLE_CLIENT_SECRET="************************************************"
+GOOGLE_CALLBACK_URL="http://localhost:3170/v1/auth/google/callback"
+GOOGLE_SCOPE="email,profile"
+
+# Github Auth Config
+GITHUB_CLIENT_ID="************************************************"
+GITHUB_CLIENT_SECRET="************************************************"
+GITHUB_CALLBACK_URL="http://localhost:3170/v1/auth/github/callback"
+GITHUB_SCOPE="user:email"
+
+# Microsoft Auth Config
+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_ENABLE="true"
+MAILER_USE_CUSTOM_CONFIGS="false"
+MAILER_ADDRESS_FROM='"From Name Here" <from@example.com>'
+
+MAILER_SMTP_URL="smtps://user@domain.com:pass@smtp.domain.com" # used if custom mailer configs is false
+
+# The following are used if custom mailer configs is true
+MAILER_SMTP_HOST="smtp.domain.com"
+MAILER_SMTP_PORT="587"
+MAILER_SMTP_SECURE="true"
+MAILER_SMTP_USER="user@domain.com"
+MAILER_SMTP_PASSWORD="pass"
+MAILER_TLS_REJECT_UNAUTHORIZED="true"
+
+# Rate Limit Config
+RATE_LIMIT_TTL=60 # In seconds
+RATE_LIMIT_MAX=100 # Max requests per IP
+
+
+#-----------------------Frontend Config------------------------------#
+
+
+# Base URLs
+VITE_BACKEND_LOGIN_API_URL=http://localhost:5444
+VITE_BASE_URL=http://localhost:3000
+VITE_SHORTCODE_BASE_URL=http://localhost:3000
+VITE_ADMIN_URL=http://localhost:3100
+
+# Backend URLs
+VITE_BACKEND_GQL_URL=http://localhost:3170/graphql
+VITE_BACKEND_WS_URL=ws://localhost:3170/graphql
+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

.eslintrc.js

@@ -1,67 +0,0 @@
-module.exports = {
-  root: true,
-  env: {
-    browser: true,
-    node: true,
-    jest: true,
-  },
-  parserOptions: {
-    sourceType: "module",
-    requireConfigFile: false,
-  },
-  extends: [
-    "@nuxtjs",
-    "@nuxtjs/eslint-config-typescript",
-    "prettier/prettier",
-    "eslint:recommended",
-    "plugin:vue/recommended",
-    "plugin:prettier/recommended",
-    "plugin:nuxt/recommended",
-  ],
-  plugins: ["vue", "prettier"],
-  // add your custom rules here
-  rules: {
-    semi: [2, "never"],
-    "no-console": process.env.NODE_ENV === "production" ? "error" : "off",
-    "no-debugger": process.env.NODE_ENV === "production" ? "error" : "off",
-    "vue/max-attributes-per-line": "off",
-    "vue/component-name-in-template-casing": ["error", "PascalCase"],
-    "vue/html-self-closing": [
-      "error",
-      {
-        html: {
-          normal: "never",
-          void: "always",
-        },
-      },
-    ],
-    "vue/singleline-html-element-content-newline": "off",
-    "vue/multiline-html-element-content-newline": "off",
-    "vue/require-default-prop": "warn",
-    "vue/require-prop-types": "warn",
-    "prettier/prettier": ["warn", { semi: false }],
-    "import/no-named-as-default": "off",
-    "no-undef": "off",
-    // localStorage block
-    "no-restricted-globals": [
-      "error",
-      {
-        name: "localStorage",
-        message:
-          "Do not use 'localStorage' directly. Please use localpersistence.ts functions or stores",
-      },
-    ],
-    // window.localStorage block
-    "no-restricted-syntax": [
-      "error",
-      {
-        selector: "CallExpression[callee.object.property.name='localStorage']",
-        message:
-          "Do not use 'localStorage' directly. Please use localpersistence.ts functions or stores",
-      },
-    ],
-  },
-  globals: {
-    $nuxt: true,
-  },
-}

.gitattributes

@@ -0,0 +1 @@
+* text=auto eol=lf

.github/FUNDING.yml

@@ -1,4 +1,2 @@
 github: hoppscotch
 open_collective: hoppscotch
-patreon: liyasthomas
-custom: https://www.paypal.me/liyascthomas

.github/ISSUE_TEMPLATE/--bug-report.yaml

@@ -0,0 +1,57 @@
+name: Bug report
+description: Create a bug report to help us improve Hoppscotch
+title: "[bug]: "
+labels: [bug, need testing]
+body:
+- type: markdown
+  attributes:
+    value: |
+      Thank you for taking the time to fill out this bug report.
+- type: checkboxes
+  attributes:
+    label: Is there an existing issue for this?
+    description: Please search to see if an issue already exists for the bug you encountered
+    options:
+    - label: I have searched the existing issues
+      required: true
+- type: textarea
+  attributes:
+    label: Current behavior
+    description: A concise description of what you're experiencing and what you expect
+    placeholder: |
+      When I do <X>, <Y> happens and I see the error message attached below:
+      ```...```
+      What I expect is <Z>
+  validations:
+    required: true
+- type: textarea
+  attributes:
+    label: Steps to reproduce
+    description: Add steps to reproduce this behaviour, include console or network logs and screenshots
+    placeholder: |
+      1. Go to '...'
+      2. Click on '....'
+      3. Scroll down to '....'
+      4. See error
+  validations:
+    required: true
+- type: dropdown
+  id: env
+  attributes:
+    label: Environment
+    options:
+      - Production
+      - Release
+      - Deploy preview
+  validations:
+    required: true
+- type: dropdown
+  id: version
+  attributes:
+    label: Version
+    options:
+      - Cloud
+      - Self-hosted
+      - Local
+  validations:
+    required: true

.github/ISSUE_TEMPLATE/--feature-request.yaml

@@ -0,0 +1,28 @@
+name: Feature request
+description: Suggest a feature to improve Hoppscotch
+title: "[feature]: "
+labels: [feature]
+body:
+- type: markdown
+  attributes:
+    value: |
+      Thank you for taking the time to request a feature for Hoppscotch
+- type: checkboxes
+  attributes:
+    label: Is there an existing issue for this?
+    description: Please search to see if an issue related to this feature request already exists
+    options:
+    - label: I have searched the existing issues
+      required: true
+- type: textarea
+  attributes:
+    label: Summary
+    description: One paragraph description of the feature
+  validations:
+    required: true
+- type: textarea
+  attributes:
+    label: Why should this be worked on?
+    description: A concise description of the problems or use cases for this feature request
+  validations:
+    required: true

.github/ISSUE_TEMPLATE/bug_report.md

@@ -1,38 +0,0 @@
----
-name: Bug report
-about: Create a report to help us improve
-title: ''
-labels: ''
-assignees: ''
-
----
-
-**Describe the bug**
-A clear and concise description of what the bug is.
-
-**To Reproduce**
-Steps to reproduce the behavior:
-1. Go to '...'
-2. Click on '....'
-3. Scroll down to '....'
-4. See error
-
-**Expected behavior**
-A clear and concise description of what you expected to happen.
-
-**Screenshots**
-If applicable, add screenshots to help explain your problem.
-
-**Desktop (please complete the following information):**
- - OS: [e.g. iOS]
- - Browser [e.g. chrome, safari]
- - Version [e.g. 22]
-
-**Smartphone (please complete the following information):**
- - Device: [e.g. iPhone6]
- - OS: [e.g. iOS8.1]
- - Browser [e.g. stock browser, safari]
- - Version [e.g. 22]
-
-**Additional context**
-Add any other context about the problem here.

.github/ISSUE_TEMPLATE/config.yml

@@ -0,0 +1,7 @@
+contact_links:
+  - name: Help and support
+    url: https://github.com/hoppscotch/hoppscotch#support
+    about: Reach out to us on our Discord server or Telegram group or GitHub discussions.
+  - name: Dedicated support
+    url: mailto:support@hoppscotch.io
+    about: Write to us if you'd like dedicated support using Hoppscotch

.github/ISSUE_TEMPLATE/custom.md

@@ -1,8 +0,0 @@
----
-name: Custom issue template
-about: Describe this issue template's purpose here.
-title: ''
-labels: ''
-assignees: ''
-
----

.github/ISSUE_TEMPLATE/feature_request.md

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

.github/dependabot.yml

@@ -5,6 +5,6 @@ updates:
   schedule:
     interval: weekly
     time: '00:00'
-  open-pull-requests-limit: 10
+  open-pull-requests-limit: 0
   reviewers:
   - liyasthomas

.github/pull_request_template.md

@@ -0,0 +1,21 @@
+<!--
+Thanks for creating this pull request 🤗
+
+Please make sure that the pull request is limited to one type (docs, feature, etc.) and keep it as small as possible. You can open multiple prs instead of opening a huge one.
+-->
+
+<!-- If this pull request closes an issue, please mention the issue number below -->
+Closes # <!-- Issue # here -->
+
+<!-- Add an introduction into what this PR tries to solve in a couple of sentences -->
+
+### What's changed
+<!-- Describe point by point the different things you have changed in this PR -->
+
+<!-- You can also choose to add a list of changes and if they have been completed or not by using the markdown to-do list syntax
+- [ ] Not Completed
+- [x] Completed
+-->
+
+### Notes to reviewers
+<!-- Any information you feel the reviewer should know about when reviewing your PR -->

.github/workflows/codeql-analysis.yml

@@ -1,62 +1,63 @@
-# For most projects, this workflow file will not need changing; you simply need
-# to commit it to your repository.
-#
-# You may wish to alter this file to override the set of languages analyzed,
-# or to provide custom queries or build logic.
-name: "CodeQL"
+name: "CodeQL analysis"
 
 on:
   push:
     branches: [main]
   pull_request:
-    # The branches below must be a subset of the branches above
     branches: [main]
   schedule:
-    - cron: '0 0 * * 6'
+    #        ┌───────────── minute (0 - 59)
+    #        │  ┌───────────── hour (0 - 23)
+    #        │  │ ┌───────────── day of the month (1 - 31)
+    #        │  │ │ ┌───────────── month (1 - 12 or JAN-DEC)
+    #        │  │ │ │ ┌───────────── day of the week (0 - 6 or SUN-SAT)
+    #        │  │ │ │ │
+    #        │  │ │ │ │
+    #        │  │ │ │ │
+    #        *  * * * *
+    - cron: '30 1 * * 0'
 
 jobs:
   analyze:
     name: Analyze
+    # CodeQL runs on ubuntu-latest, windows-latest, and macos-latest
     runs-on: ubuntu-latest
 
-    strategy:
-      fail-fast: false
-      matrix:
-        # Override automatic language detection by changing the below list
-        # Supported options are ['csharp', 'cpp', 'go', 'java', 'javascript', 'python']
-        language: ['javascript']
-        # Learn more...
-        # https://docs.github.com/en/github/finding-security-vulnerabilities-and-errors-in-your-code/configuring-code-scanning#overriding-automatic-language-detection
+    permissions:
+      # required for all workflows
+      security-events: write
+
+      # only required for workflows in private repositories
+      actions: read
+      contents: read
 
     steps:
-    - name: Checkout repository
-      uses: actions/checkout@v2
+      - name: Checkout
+        uses: actions/checkout@v3
 
-    # Initializes the CodeQL tools for scanning.
-    - name: Initialize CodeQL
-      uses: github/codeql-action/init@v1
-      with:
-        languages: ${{ matrix.language }}
-        # If you wish to specify custom queries, you can do so here or in a config file.
-        # By default, queries listed here will override any specified in a config file.
-        # Prefix the list here with "+" to use these queries and those in the config file.
-        # queries: ./path/to/local/query, your-org/your-repo/queries@main
+      # Initializes the CodeQL tools for scanning.
+      - name: Initialize CodeQL
+        uses: github/codeql-action/init@v2
+        with:
+          # Run extended queries including queries using machine learning
+          queries: security-extended
+          languages: ${{ matrix.language }}
 
-    # Autobuild attempts to build any compiled languages  (C/C++, C#, or Java).
-    # If this step fails, then you should remove it and run the build manually (see below)
-    - name: Autobuild
-      uses: github/codeql-action/autobuild@v1
+      # Autobuild attempts to build any compiled languages (C/C++, C#, Go, or Java).
+      # If this step fails, then you should remove it and run the build manually (see below).
+      - name: Autobuild
+        uses: github/codeql-action/autobuild@v2
 
-    # ℹ️ Command-line programs to run using the OS shell.
-    # 📚 https://git.io/JvXDl
+      # ℹ️ Command-line programs to run using the OS shell.
+      # 📚 See https://docs.github.com/en/actions/using-workflows/workflow-syntax-for-github-actions#jobsjob_idstepsrun
 
-    # ✏️ If the Autobuild fails above, remove it and uncomment the following three lines
-    #    and modify them (or add more) to build your code if your project
-    #    uses a compiled language
+      # ✏️ If the Autobuild fails above, remove it and uncomment the following
+      #    three lines and modify them (or add more) to build your code if your
+      #    project uses a compiled language
 
-    #- run: |
-    #   make bootstrap
-    #   make release
+      #- run: |
+      #     make bootstrap
+      #     make release
 
-    - name: Perform CodeQL Analysis
-      uses: github/codeql-action/analyze@v1
+      - name: Perform CodeQL Analysis
+        uses: github/codeql-action/analyze@v2

.github/workflows/firebase-hosting-merge.yml

@@ -1,19 +0,0 @@
-# This file was auto-generated by the Firebase CLI
-# https://github.com/firebase/firebase-tools
-
-name: Deploy to Firebase Hosting on merge
-'on':
-  push:
-    branches:
-      - main
-jobs:
-  build_and_deploy:
-    runs-on: ubuntu-latest
-    steps:
-      - uses: actions/checkout@v2
-      - uses: FirebaseExtended/action-hosting-deploy@v0
-        with:
-          repoToken: '${{ secrets.GITHUB_TOKEN }}'
-          firebaseServiceAccount: '${{ secrets.FIREBASE_SERVICE_ACCOUNT_POSTWOMAN_API }}'
-          channelId: live
-          projectId: postwoman-api

.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 }}

.github/workflows/tests.yml

@@ -2,24 +2,36 @@ name: Node.js CI
 
 on:
   push:
-    branches: [ main ]
+    branches: [main, staging, "release/**"]
   pull_request:
-    branches: [ main ]
+    branches: [main, staging, "release/**"]
 
 jobs:
-  build:
-
+  test:
+    name: Test
     runs-on: ubuntu-latest
 
     strategy:
       matrix:
-        node-version: [14.x]
+        node-version: ["lts/*"]
 
     steps:
-      - uses: actions/checkout@v2
-      - name: Use Node.js ${{ matrix.node-version }}
-        uses: actions/setup-node@v1
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup environment
+        run: mv .env.example .env
+
+      - name: Setup node
+        uses: actions/setup-node@v4
         with:
           node-version: ${{ matrix.node-version }}
-      - run: npm ci
-      - run: npm test
+
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v3
+        with:
+          version: 8
+          run_install: true
+
+      - name: Run tests
+        run: pnpm test

.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 }}

.gitignore

@@ -1,15 +1,18 @@
-# Created by .ignore support plugin (hsz.mobi)
-
 # Firebase
 .firebase
 
-### Node template
+### Node ###
 # Logs
 logs
 *.log
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
+lerna-debug.log*
+.pnpm-debug.log*
+
+# Diagnostic reports (https://nodejs.org/api/report.html)
+report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
 
 # Runtime data
 pids
@@ -22,6 +25,7 @@ lib-cov
 
 # Coverage directory used by tools like istanbul
 coverage
+*.lcov
 
 # nyc test coverage
 .nyc_output
@@ -45,12 +49,27 @@ jspm_packages/
 # TypeScript v1 declaration files
 typings/
 
+# Snowpack dependency directory (https://snowpack.dev/)
+web_modules/
+
+# TypeScript cache
+*.tsbuildinfo
+
 # Optional npm cache directory
 .npm
 
 # Optional eslint cache
 .eslintcache
 
+# Optional stylelint cache
+.stylelintcache
+
+# Microbundle cache
+.rpt2_cache/
+.rts2_cache_cjs/
+.rts2_cache_es/
+.rts2_cache_umd/
+
 # Optional REPL history
 .node_repl_history
 
@@ -60,26 +79,65 @@ typings/
 # Yarn Integrity file
 .yarn-integrity
 
-# dotenv environment variables file
+# dotenv environment variable files
 .env
+.env.*
 
 # parcel-bundler cache (https://parceljs.org/)
 .cache
+.parcel-cache
 
-# next.js build output
+# Next.js build output
 .next
+out
 
-# nuxt.js build output
+# Nuxt.js build / generate output
 .nuxt
-
-# Nuxt generate
 dist
 
+# Gatsby files
+.cache/
+# Comment in the public line in if your project uses Gatsby and not Next.js
+# https://nextjs.org/blog/next-9-1#public-directory-support
+# public
+
 # vuepress build output
 .vuepress/dist
 
+# vuepress v2.x temp and cache directory
+.temp
+
+# Docusaurus cache and generated files
+.docusaurus
+
 # Serverless directories
-.serverless
+.serverless/
+
+# FuseBox cache
+.fusebox/
+
+# DynamoDB Local files
+.dynamodb/
+
+# TernJS port file
+.tern-port
+
+# Stores VSCode versions used for testing VSCode extensions
+.vscode-test
+
+# yarn v2
+.yarn/cache
+.yarn/unplugged
+.yarn/build-state.yml
+.yarn/install-state.gz
+.pnp.*
+
+### Node Patch ###
+# Serverless Webpack directories
+.webpack/
+
+# SvelteKit build / generate output
+.svelte-kit
 
 # IDE / Editor
 .idea
@@ -104,3 +162,12 @@ tests/*/screenshots
 
 # Tests videos
 tests/*/videos
+
+# Local Netlify folder
+.netlify
+
+# PNPM
+.pnpm-store
+
+# GQL SDL generated for the frontends
+gql-gen/

.husky/.gitignore

@@ -1 +0,0 @@
-_

.npmrc

@@ -0,0 +1,2 @@
+shamefully-hoist=false
+save-prefix=''

.prettierrc.js

@@ -1,3 +1,8 @@
 module.exports = {
-  semi: false
+  semi: false,
+  trailingComma: "es5",
+  singleQuote: false,
+  printWidth: 80,
+  useTabs: false,
+  tabWidth: 2
 }

.stylelintrc.js

@@ -1,23 +0,0 @@
-module.exports = {
-  extends: ["stylelint-config-standard", "stylelint-config-prettier"],
-  // add your custom config here
-  // https://stylelint.io/user-guide/configuration
-  rules: {
-    "at-rule-no-unknown": [
-      true,
-      {
-        ignoreAtRules: [
-          "extends",
-          "apply",
-          "variants",
-          "responsive",
-          "screen",
-          "mixin",
-          "include",
-        ],
-      },
-    ],
-    "declaration-block-trailing-semicolon": null,
-    "no-descending-specificity": null,
-  },
-}

CHANGELOG.md

@@ -1,833 +1,3 @@
 # Changelog
 
-## [v1.12.0](https://github.com/hoppscotch/hoppscotch/tree/v1.12.0) (2020-05-27)
-
-[Full Changelog](https://github.com/hoppscotch/hoppscotch/compare/v1.10.0...v1.12.0)
-
-## [v1.10.0](https://github.com/hoppscotch/hoppscotch/tree/v1.10.0) (2020-04-10)
-
-[Full Changelog](https://github.com/hoppscotch/hoppscotch/compare/v1.9.9...v1.10.0)
-
-## [v1.9.9](https://github.com/liyasthomas/postwoman/tree/v1.9.9) (2020-07-30)
-
-[Full Changelog](https://github.com/liyasthomas/postwoman/compare/v1.9.7...v1.9.9)
-
-**Fixed bugs:**
-
-- TextDecoder.decode\(\) TypeError hangs the whole app [\#1032](https://github.com/liyasthomas/postwoman/issues/1032)
-- response content doesn't fit to the text area when resizing [\#970](https://github.com/liyasthomas/postwoman/issues/970)
-- typing into headers input fields [\#912](https://github.com/liyasthomas/postwoman/issues/912)
-- Environment variable template \(\<\<foo\>\>\) appears urlencoded \(%3C%3Cfoo%3E%3E\) [\#896](https://github.com/liyasthomas/postwoman/issues/896)
-- TypeError: Cannot read property 'startsWith' of undefined - after getting 401 response [\#894](https://github.com/liyasthomas/postwoman/issues/894)
-- When deleting the header, the key is not updated [\#886](https://github.com/liyasthomas/postwoman/issues/886)
-- Cannot introduce query parameters in URL for WebSocket [\#873](https://github.com/liyasthomas/postwoman/issues/873)
-- Response content-type as `text/html` with content in `json` cause content area display empty [\#869](https://github.com/liyasthomas/postwoman/issues/869)
-- Proxy privacy policy link [\#865](https://github.com/liyasthomas/postwoman/issues/865)
-
-**Closed issues:**
-
-- Collections | Request UI Issue [\#1028](https://github.com/liyasthomas/postwoman/issues/1028)
-- JSON not showing up in the correct format [\#1023](https://github.com/liyasthomas/postwoman/issues/1023)
-- ignore duplicates in history [\#1022](https://github.com/liyasthomas/postwoman/issues/1022)
-- change history menu [\#1021](https://github.com/liyasthomas/postwoman/issues/1021)
-- integrate parameters with history [\#1020](https://github.com/liyasthomas/postwoman/issues/1020)
-- Why some Chrome do not have the ability to install PWA? [\#1015](https://github.com/liyasthomas/postwoman/issues/1015)
-- Shall we have the team management ability and some public documents? [\#1014](https://github.com/liyasthomas/postwoman/issues/1014)
-- I have edit this config, but it is not available to login. [\#1013](https://github.com/liyasthomas/postwoman/issues/1013)
-- User login is disabled after i run it on our local server. [\#1012](https://github.com/liyasthomas/postwoman/issues/1012)
-- postwoman google login doesn't work behind ingress or reverse proxy [\#1009](https://github.com/liyasthomas/postwoman/issues/1009)
-- Compile error [\#1006](https://github.com/liyasthomas/postwoman/issues/1006)
-- Postman Web is now out. It might be great to find a USP for Postwoman [\#1000](https://github.com/liyasthomas/postwoman/issues/1000)
-- Saving response data in env variable [\#984](https://github.com/liyasthomas/postwoman/issues/984)
-- contentType 无法使用 form-date 上传文件 [\#983](https://github.com/liyasthomas/postwoman/issues/983)
-- Currently completely broken [\#980](https://github.com/liyasthomas/postwoman/issues/980)
-- localhost request error [\#979](https://github.com/liyasthomas/postwoman/issues/979)
-- Installing postwoman locally [\#969](https://github.com/liyasthomas/postwoman/issues/969)
-- Do I install NodeJS for my online environment [\#968](https://github.com/liyasthomas/postwoman/issues/968)
-- Collections and Environment Module [\#967](https://github.com/liyasthomas/postwoman/issues/967)
-- Textarea display problem in super hi-dpi [\#965](https://github.com/liyasthomas/postwoman/issues/965)
-- TypeError: Cannot read property 'value' of undefined - when logged in [\#961](https://github.com/liyasthomas/postwoman/issues/961)
-- Enable user-select on websocket and other realtime message logs [\#951](https://github.com/liyasthomas/postwoman/issues/951)
-- POST requet error [\#947](https://github.com/liyasthomas/postwoman/issues/947)
-- Unable to fetch schema from localhost GraphQL server. [\#940](https://github.com/liyasthomas/postwoman/issues/940)
-- Support downloading binary responses [\#929](https://github.com/liyasthomas/postwoman/issues/929)
-- Integrate PostWoman In our Webapp [\#918](https://github.com/liyasthomas/postwoman/issues/918)
-- proxy issue [\#911](https://github.com/liyasthomas/postwoman/issues/911)
-- Button to cancel requests [\#909](https://github.com/liyasthomas/postwoman/issues/909)
-- How to upload a file with a post request [\#908](https://github.com/liyasthomas/postwoman/issues/908)
-- Cant Import Postman Global Environment Variables [\#907](https://github.com/liyasthomas/postwoman/issues/907)
-- Postwoman Docker Container behind Reverse Proxy [\#906](https://github.com/liyasthomas/postwoman/issues/906)
-- `pw.response` seems not to work [\#905](https://github.com/liyasthomas/postwoman/issues/905)
-- Could postman add Sign in with LDAP server？ [\#901](https://github.com/liyasthomas/postwoman/issues/901)
-- Collections & Environments not synced [\#900](https://github.com/liyasthomas/postwoman/issues/900)
-- Add authentication to MQTT [\#898](https://github.com/liyasthomas/postwoman/issues/898)
-- Labels are lost when using requests from collections [\#897](https://github.com/liyasthomas/postwoman/issues/897)
-- Handle JSON Parameter list validation [\#891](https://github.com/liyasthomas/postwoman/issues/891)
-- Nuxt fatal error [\#883](https://github.com/liyasthomas/postwoman/issues/883)
-- Cannot connect my local websocket server [\#880](https://github.com/liyasthomas/postwoman/issues/880)
-- Environments not synced after edit [\#877](https://github.com/liyasthomas/postwoman/issues/877)
-- Can't find Desktop app link anywhere [\#872](https://github.com/liyasthomas/postwoman/issues/872)
-- Show request completion time [\#871](https://github.com/liyasthomas/postwoman/issues/871)
-- Make docs on self-hosting Postwoman [\#868](https://github.com/liyasthomas/postwoman/issues/868)
-
-**Merged pull requests:**
-
-- Add trailing backslash to generated cURL code for easier paste-and-execute [\#1033](https://github.com/liyasthomas/postwoman/pull/1033) ([ushuz](https://github.com/ushuz))
-- Update zh-CN.json [\#1031](https://github.com/liyasthomas/postwoman/pull/1031) ([hantianwei](https://github.com/hantianwei))
-- Bump firebase from 7.17.0 to 7.17.1 [\#1026](https://github.com/liyasthomas/postwoman/pull/1026) ([dependabot[bot]](https://github.com/apps/dependabot))
-- Update zh-CN.json [\#1024](https://github.com/liyasthomas/postwoman/pull/1024) ([hantianwei](https://github.com/hantianwei))
-- Bump @nuxtjs/gtm from 2.3.0 to 2.3.2 [\#1019](https://github.com/liyasthomas/postwoman/pull/1019) ([dependabot[bot]](https://github.com/apps/dependabot))
-- Bump firebase from 7.16.1 to 7.17.0 [\#1018](https://github.com/liyasthomas/postwoman/pull/1018) ([dependabot[bot]](https://github.com/apps/dependabot))
-- Fix bugs with the renderer mixins [\#1008](https://github.com/liyasthomas/postwoman/pull/1008) ([AndrewBastin](https://github.com/AndrewBastin))
-- Bump eslint from 7.4.0 to 7.5.0 [\#1005](https://github.com/liyasthomas/postwoman/pull/1005) ([dependabot[bot]](https://github.com/apps/dependabot))
-- Add Collections section in Docs page [\#1004](https://github.com/liyasthomas/postwoman/pull/1004) ([liyasthomas](https://github.com/liyasthomas))
-- Bump lodash from 4.17.15 to 4.17.19 in /functions [\#999](https://github.com/liyasthomas/postwoman/pull/999) ([dependabot[bot]](https://github.com/apps/dependabot))
-- Bump @nuxtjs/google-analytics from 2.3.0 to 2.4.0 [\#998](https://github.com/liyasthomas/postwoman/pull/998) ([dependabot[bot]](https://github.com/apps/dependabot))
-- Bump firebase from 7.16.0 to 7.16.1 [\#997](https://github.com/liyasthomas/postwoman/pull/997) ([dependabot[bot]](https://github.com/apps/dependabot))
-- Fixed broken network requests in GraphQL [\#995](https://github.com/liyasthomas/postwoman/pull/995) ([AndrewBastin](https://github.com/AndrewBastin))
-- fix: replaceWithJSON used wrong commit name [\#993](https://github.com/liyasthomas/postwoman/pull/993) ([perseveringman](https://github.com/perseveringman))
-- ⬆️ Bump @nuxtjs/toast from 3.3.0 to 3.3.1 [\#992](https://github.com/liyasthomas/postwoman/pull/992) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump start-server-and-test from 1.11.1 to 1.11.2 [\#991](https://github.com/liyasthomas/postwoman/pull/991) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump @nuxtjs/axios from 5.11.0 to 5.12.0 [\#990](https://github.com/liyasthomas/postwoman/pull/990) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump firebase from 7.15.5 to 7.16.0 [\#989](https://github.com/liyasthomas/postwoman/pull/989) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump start-server-and-test from 1.11.0 to 1.11.1 [\#988](https://github.com/liyasthomas/postwoman/pull/988) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump sass-loader from 9.0.1 to 9.0.2 [\#986](https://github.com/liyasthomas/postwoman/pull/986) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump cypress from 4.9.0 to 4.10.0 [\#985](https://github.com/liyasthomas/postwoman/pull/985) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump ace-builds from 1.4.11 to 1.4.12 [\#982](https://github.com/liyasthomas/postwoman/pull/982) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump vuefire from 2.2.2 to 2.2.3 [\#981](https://github.com/liyasthomas/postwoman/pull/981) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump eslint from 7.3.1 to 7.4.0 [\#978](https://github.com/liyasthomas/postwoman/pull/978) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump sass-loader from 9.0.0 to 9.0.1 [\#977](https://github.com/liyasthomas/postwoman/pull/977) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump graphql from 15.2.0 to 15.3.0 [\#976](https://github.com/liyasthomas/postwoman/pull/976) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump nuxt-i18n from 6.13.0 to 6.13.1 [\#975](https://github.com/liyasthomas/postwoman/pull/975) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump sass-loader from 8.0.2 to 9.0.0 [\#973](https://github.com/liyasthomas/postwoman/pull/973) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump nuxt-i18n from 6.12.2 to 6.13.0 [\#972](https://github.com/liyasthomas/postwoman/pull/972) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump graphql from 15.1.0 to 15.2.0 [\#966](https://github.com/liyasthomas/postwoman/pull/966) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump @nuxtjs/sitemap from 2.3.2 to 2.4.0 [\#963](https://github.com/liyasthomas/postwoman/pull/963) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump firebase from 7.15.4 to 7.15.5 [\#962](https://github.com/liyasthomas/postwoman/pull/962) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump eslint from 7.3.0 to 7.3.1 [\#958](https://github.com/liyasthomas/postwoman/pull/958) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump cypress from 4.8.0 to 4.9.0 [\#957](https://github.com/liyasthomas/postwoman/pull/957) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump firebase from 7.15.3 to 7.15.4 [\#956](https://github.com/liyasthomas/postwoman/pull/956) ([dependabot[bot]](https://github.com/apps/dependabot))
-- Binary Responses & Response Lenses [\#955](https://github.com/liyasthomas/postwoman/pull/955) ([AndrewBastin](https://github.com/AndrewBastin))
-- Improving SEO [\#954](https://github.com/liyasthomas/postwoman/pull/954) ([liyasthomas](https://github.com/liyasthomas))
-- Isolate Netlify, Firebase and Helper functions + Import from absolute… [\#953](https://github.com/liyasthomas/postwoman/pull/953) ([liyasthomas](https://github.com/liyasthomas))
-- Added ability to select text in realtime log [\#952](https://github.com/liyasthomas/postwoman/pull/952) ([AndrewBastin](https://github.com/AndrewBastin))
-- ⬆️ Bump firebase from 7.15.1 to 7.15.3 [\#950](https://github.com/liyasthomas/postwoman/pull/950) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump eslint from 7.2.0 to 7.3.0 [\#949](https://github.com/liyasthomas/postwoman/pull/949) ([dependabot[bot]](https://github.com/apps/dependabot))
-- Revert "⬆️ Bump nuxt from 2.12.2 to 2.13.0" [\#946](https://github.com/liyasthomas/postwoman/pull/946) ([liyasthomas](https://github.com/liyasthomas))
-- ⬆️ Bump nuxt from 2.12.2 to 2.13.0 [\#942](https://github.com/liyasthomas/postwoman/pull/942) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump @nuxtjs/sitemap from 2.3.1 to 2.3.2 [\#939](https://github.com/liyasthomas/postwoman/pull/939) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump graphql from 14.6.0 to 15.1.0 [\#938](https://github.com/liyasthomas/postwoman/pull/938) ([dependabot[bot]](https://github.com/apps/dependabot))
-- Updated readme [\#937](https://github.com/liyasthomas/postwoman/pull/937) ([liyasthomas](https://github.com/liyasthomas))
-- ⬆️ Bump graphql-language-service-interface from 2.3.3 to 2.4.0 [\#936](https://github.com/liyasthomas/postwoman/pull/936) ([dependabot[bot]](https://github.com/apps/dependabot))
-- ⬆️ Bump firebase from 7.15.0 to 7.15.1 [\#935](https://github.com/liyasthomas/postwoman/pull/935) ([dependabot[bot]](https://github.com/apps/dependabot))
-- Transpiled ES5 code to ES6/ES7 [\#934](https://github.com/liyasthomas/postwoman/pull/934) ([liyasthomas](https://github.com/liyasthomas))
-- Create Dependabot config file [\#932](https://github.com/liyasthomas/postwoman/pull/932) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Hide download response button for non-JSON responses [\#931](https://github.com/liyasthomas/postwoman/pull/931) ([AndrewBastin](https://github.com/AndrewBastin))
-- chore\(deps-dev\): bump cypress from 4.7.0 to 4.8.0 [\#928](https://github.com/liyasthomas/postwoman/pull/928) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- fix: environment and collection sync issue with firebase [\#926](https://github.com/liyasthomas/postwoman/pull/926) ([myussufz](https://github.com/myussufz))
-- chore\(deps\): bump @nuxtjs/axios from 5.10.3 to 5.11.0 [\#925](https://github.com/liyasthomas/postwoman/pull/925) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump eslint from 7.1.0 to 7.2.0 [\#924](https://github.com/liyasthomas/postwoman/pull/924) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- GraphQL response options only visible when a response is shown [\#923](https://github.com/liyasthomas/postwoman/pull/923) ([AndrewBastin](https://github.com/AndrewBastin))
-- chore\(deps\): bump firebase from 7.14.6 to 7.15.0 [\#922](https://github.com/liyasthomas/postwoman/pull/922) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump @nuxtjs/sitemap from 2.3.0 to 2.3.1 [\#921](https://github.com/liyasthomas/postwoman/pull/921) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Added ability to download GraphQL responses [\#920](https://github.com/liyasthomas/postwoman/pull/920) ([AndrewBastin](https://github.com/AndrewBastin))
-- chore\(deps\): bump nuxt-i18n from 6.12.1 to 6.12.2 [\#919](https://github.com/liyasthomas/postwoman/pull/919) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump @nuxtjs/gtm from 2.2.3 to 2.3.0 [\#917](https://github.com/liyasthomas/postwoman/pull/917) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Cancel Request from the Keyboard [\#916](https://github.com/liyasthomas/postwoman/pull/916) ([AndrewBastin](https://github.com/AndrewBastin))
-- Cancellable Requests [\#915](https://github.com/liyasthomas/postwoman/pull/915) ([AndrewBastin](https://github.com/AndrewBastin))
-- chore\(deps\): bump nuxt-i18n from 6.12.0 to 6.12.1 [\#914](https://github.com/liyasthomas/postwoman/pull/914) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump firebase from 7.14.5 to 7.14.6 [\#913](https://github.com/liyasthomas/postwoman/pull/913) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-
-## [v1.9.7](https://github.com/liyasthomas/postwoman/tree/v1.9.7) (2020-05-12)
-
-[Full Changelog](https://github.com/liyasthomas/postwoman/compare/v1.9.5...v1.9.7)
-
-**Fixed bugs:**
-
-- Empty header in headers list results in SyntaxError: Failed to execute 'setRequestHeader' [\#765](https://github.com/liyasthomas/postwoman/issues/765)
-- Getting cannot read value of undefined [\#731](https://github.com/liyasthomas/postwoman/issues/731)
-- Environment variables in collections [\#642](https://github.com/liyasthomas/postwoman/issues/642)
-
-**Closed issues:**
-
-- Import/Export collections from private github repos to share among teams. [\#867](https://github.com/liyasthomas/postwoman/issues/867)
-- Unable to use postwoman with latest docker image from docker hub [\#866](https://github.com/liyasthomas/postwoman/issues/866)
-- Access to nonexistent routes will not be redirect to page 404 [\#849](https://github.com/liyasthomas/postwoman/issues/849)
-- Error: Network Error. Check console for details. [\#827](https://github.com/liyasthomas/postwoman/issues/827)
-- 'Documentation Generated' response stacking past top of page if submit clicked enough times/fast enough [\#826](https://github.com/liyasthomas/postwoman/issues/826)
-- The UI could use some improvements [\#825](https://github.com/liyasthomas/postwoman/issues/825)
-- Postwoman won't build, produces 'FATAL Nuxt build error' [\#824](https://github.com/liyasthomas/postwoman/issues/824)
-- Improve contrast of UI components in all themes [\#819](https://github.com/liyasthomas/postwoman/issues/819)
-- Add an option to hide and/or collapse the right panel [\#818](https://github.com/liyasthomas/postwoman/issues/818)
-- Docker Cannot log in normally in the container [\#817](https://github.com/liyasthomas/postwoman/issues/817)
-- Body in Request [\#815](https://github.com/liyasthomas/postwoman/issues/815)
-- How to run postwoman under reverse proxy [\#812](https://github.com/liyasthomas/postwoman/issues/812)
-- Call local support [\#811](https://github.com/liyasthomas/postwoman/issues/811)
-- feature [\#810](https://github.com/liyasthomas/postwoman/issues/810)
-- support response json array [\#805](https://github.com/liyasthomas/postwoman/issues/805)
-- socket binnery support [\#801](https://github.com/liyasthomas/postwoman/issues/801)
-- Ability to join and leave rooms in Socket.IO connection [\#796](https://github.com/liyasthomas/postwoman/issues/796)
-- How can I synchronize my data on local? [\#794](https://github.com/liyasthomas/postwoman/issues/794)
-- I cant login [\#792](https://github.com/liyasthomas/postwoman/issues/792)
-- Unresolved merge conflict in index.vue.orig [\#786](https://github.com/liyasthomas/postwoman/issues/786)
-- You send data my request to Google [\#780](https://github.com/liyasthomas/postwoman/issues/780)
-- I have question by \#750, it's closed,but my problem is still.... [\#770](https://github.com/liyasthomas/postwoman/issues/770)
-- Add Format Body option [\#767](https://github.com/liyasthomas/postwoman/issues/767)
-- Body scroll after modal is open [\#766](https://github.com/liyasthomas/postwoman/issues/766)
-- text.match is not a function [\#764](https://github.com/liyasthomas/postwoman/issues/764)
-- Request : Copy response headers [\#763](https://github.com/liyasthomas/postwoman/issues/763)
-- The accordion \(expand\) labels are out of place on mobile [\#762](https://github.com/liyasthomas/postwoman/issues/762)
-- why does the graphql case can't be saved? [\#761](https://github.com/liyasthomas/postwoman/issues/761)
-- Mobile responsiveness issues [\#760](https://github.com/liyasthomas/postwoman/issues/760)
-- Allow importing environment variables via Postman environment json files [\#759](https://github.com/liyasthomas/postwoman/issues/759)
-- Report abuse: liyasthomas/postwoman \(Contact Links\) [\#754](https://github.com/liyasthomas/postwoman/issues/754)
-- Report abuse: liyasthomas/postwoman \(Contact Links\) [\#753](https://github.com/liyasthomas/postwoman/issues/753)
-- Request headers kept same after changing request type [\#752](https://github.com/liyasthomas/postwoman/issues/752)
-- I used it to post test,but response network error [\#750](https://github.com/liyasthomas/postwoman/issues/750)
-- Add compatibility for postman collections & environments [\#746](https://github.com/liyasthomas/postwoman/issues/746)
-- Improve documentation on how to use environments [\#742](https://github.com/liyasthomas/postwoman/issues/742)
-- Add GraphQL syntax highlighting [\#741](https://github.com/liyasthomas/postwoman/issues/741)
-- Broken link to translations branch [\#737](https://github.com/liyasthomas/postwoman/issues/737)
-- Add docker Images for all Tags [\#722](https://github.com/liyasthomas/postwoman/issues/722)
-- Provide post-build resources and default setting files [\#714](https://github.com/liyasthomas/postwoman/issues/714)
-- Theme lacks of contrast [\#709](https://github.com/liyasthomas/postwoman/issues/709)
-- Postwoman raiase a connection error when communicate with localhost. [\#708](https://github.com/liyasthomas/postwoman/issues/708)
-- CORS issue when hosting [\#707](https://github.com/liyasthomas/postwoman/issues/707)
-- Add a description to the request or collection when saving it [\#706](https://github.com/liyasthomas/postwoman/issues/706)
-- Error: Network Error. Check console for details [\#704](https://github.com/liyasthomas/postwoman/issues/704)
-- Save collections on account sync turn on [\#679](https://github.com/liyasthomas/postwoman/issues/679)
-- Tests should be saved together with requests [\#643](https://github.com/liyasthomas/postwoman/issues/643)
-- npm modules of postwoman's vue components [\#384](https://github.com/liyasthomas/postwoman/issues/384)
-- \[request\] VS code extension [\#313](https://github.com/liyasthomas/postwoman/issues/313)
-- remove prerequest \<\< \>\> bindings when pre-request script is toggled off [\#234](https://github.com/liyasthomas/postwoman/issues/234)
-- Dynamic Headers [\#91](https://github.com/liyasthomas/postwoman/issues/91)
-
-**Merged pull requests:**
-
-- chore\(deps\): bump @nuxtjs/sitemap from 2.2.1 to 2.3.0 [\#864](https://github.com/liyasthomas/postwoman/pull/864) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- docs: add sboulema as a contributor [\#863](https://github.com/liyasthomas/postwoman/pull/863) ([allcontributors[bot]](https://github.com/apps/allcontributors))
-- Allow importing environment variables via Postman environment json files [\#862](https://github.com/liyasthomas/postwoman/pull/862) ([sboulema](https://github.com/sboulema))
-- chore\(deps\): bump nuxt-i18n from 6.11.0 to 6.11.1 [\#861](https://github.com/liyasthomas/postwoman/pull/861) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Produce valid output when showing/copying as code [\#857](https://github.com/liyasthomas/postwoman/pull/857) ([Hydrophobefireman](https://github.com/Hydrophobefireman))
-- dotenv [\#856](https://github.com/liyasthomas/postwoman/pull/856) ([liyasthomas](https://github.com/liyasthomas))
-- Save Collections/Environments on enabling sync [\#854](https://github.com/liyasthomas/postwoman/pull/854) ([sboulema](https://github.com/sboulema))
-- chore\(deps\): bump firebase from 7.14.2 to 7.14.3 [\#853](https://github.com/liyasthomas/postwoman/pull/853) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Environment variables in collections [\#851](https://github.com/liyasthomas/postwoman/pull/851) ([sboulema](https://github.com/sboulema))
-- Add format body option [\#847](https://github.com/liyasthomas/postwoman/pull/847) ([sboulema](https://github.com/sboulema))
-- Save GraphQL Docs [\#846](https://github.com/liyasthomas/postwoman/pull/846) ([AndrewBastin](https://github.com/AndrewBastin))
-- chore\(deps-dev\): bump node-sass from 4.14.0 to 4.14.1 [\#844](https://github.com/liyasthomas/postwoman/pull/844) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Remove not-deleted index.vue merge file [\#842](https://github.com/liyasthomas/postwoman/pull/842) ([AndrewBastin](https://github.com/AndrewBastin))
-- URL Path Parameters \#834 [\#840](https://github.com/liyasthomas/postwoman/pull/840) ([sboulema](https://github.com/sboulema))
-- chore\(deps\): remove stale dependency [\#839](https://github.com/liyasthomas/postwoman/pull/839) ([jamesgeorge007](https://github.com/jamesgeorge007))
-- GraphQL Query Editor Syntax Highlighting [\#838](https://github.com/liyasthomas/postwoman/pull/838) ([AndrewBastin](https://github.com/AndrewBastin))
-- chore\(deps-dev\): bump lint-staged from 10.2.1 to 10.2.2 [\#837](https://github.com/liyasthomas/postwoman/pull/837) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(store\): better code structure [\#835](https://github.com/liyasthomas/postwoman/pull/835) ([jameslahm](https://github.com/jameslahm))
-- chore\(deps\): bump @nuxtjs/axios from 5.10.2 to 5.10.3 [\#832](https://github.com/liyasthomas/postwoman/pull/832) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump nuxt-i18n from 6.10.1 to 6.11.0 [\#831](https://github.com/liyasthomas/postwoman/pull/831) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump lint-staged from 10.2.0 to 10.2.1 [\#830](https://github.com/liyasthomas/postwoman/pull/830) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Add ability to navigate through message history [\#828](https://github.com/liyasthomas/postwoman/pull/828) ([jinyus](https://github.com/jinyus))
-- chore\(config\): delete render option [\#823](https://github.com/liyasthomas/postwoman/pull/823) ([jameslahm](https://github.com/jameslahm))
-- chore\(deps-dev\): bump cypress from 4.4.1 to 4.5.0 [\#822](https://github.com/liyasthomas/postwoman/pull/822) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump lint-staged from 10.1.7 to 10.2.0 [\#821](https://github.com/liyasthomas/postwoman/pull/821) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Realtime SocketIO support for json user input [\#820](https://github.com/liyasthomas/postwoman/pull/820) ([feydan](https://github.com/feydan))
-- chore\(deps\): bump @nuxtjs/axios from 5.10.1 to 5.10.2 [\#816](https://github.com/liyasthomas/postwoman/pull/816) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Modify responseType by Object\(json\) or Array\(json5\) [\#813](https://github.com/liyasthomas/postwoman/pull/813) ([shtakai](https://github.com/shtakai))
-- chore\(deps\): bump nuxt-i18n from 6.9.2 to 6.10.1 [\#809](https://github.com/liyasthomas/postwoman/pull/809) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump firebase from 7.14.1 to 7.14.2 [\#808](https://github.com/liyasthomas/postwoman/pull/808) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump node-sass from 4.13.1 to 4.14.0 [\#807](https://github.com/liyasthomas/postwoman/pull/807) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump @nuxtjs/sitemap from 2.2.0 to 2.2.1 [\#806](https://github.com/liyasthomas/postwoman/pull/806) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump @nuxtjs/axios from 5.10.0 to 5.10.1 [\#803](https://github.com/liyasthomas/postwoman/pull/803) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump nuxt-i18n from 6.9.1 to 6.9.2 [\#802](https://github.com/liyasthomas/postwoman/pull/802) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump lint-staged from 10.1.6 to 10.1.7 [\#800](https://github.com/liyasthomas/postwoman/pull/800) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump prettier from 2.0.4 to 2.0.5 [\#799](https://github.com/liyasthomas/postwoman/pull/799) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump @nuxtjs/axios from 5.9.7 to 5.10.0 [\#798](https://github.com/liyasthomas/postwoman/pull/798) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump cypress from 4.4.0 to 4.4.1 [\#797](https://github.com/liyasthomas/postwoman/pull/797) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Listen to all events in socket.io connection [\#795](https://github.com/liyasthomas/postwoman/pull/795) ([konradkalemba](https://github.com/konradkalemba))
-- Fix postman import with empty url [\#791](https://github.com/liyasthomas/postwoman/pull/791) ([Nikita240](https://github.com/Nikita240))
-- chore\(deps-dev\): bump lint-staged from 10.1.5 to 10.1.6 [\#789](https://github.com/liyasthomas/postwoman/pull/789) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump lint-staged from 10.1.3 to 10.1.5 [\#787](https://github.com/liyasthomas/postwoman/pull/787) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump firebase from 7.14.0 to 7.14.1 [\#782](https://github.com/liyasthomas/postwoman/pull/782) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump yargs-parser from 18.1.2 to 18.1.3 [\#781](https://github.com/liyasthomas/postwoman/pull/781) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump start-server-and-test from 1.10.11 to 1.11.0 [\#778](https://github.com/liyasthomas/postwoman/pull/778) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump nuxt-i18n from 6.8.1 to 6.9.1 [\#776](https://github.com/liyasthomas/postwoman/pull/776) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump ace-builds from 1.4.9 to 1.4.11 [\#775](https://github.com/liyasthomas/postwoman/pull/775) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump cypress from 4.3.0 to 4.4.0 [\#774](https://github.com/liyasthomas/postwoman/pull/774) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump firebase from 7.13.2 to 7.14.0 [\#758](https://github.com/liyasthomas/postwoman/pull/758) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump husky from 4.2.3 to 4.2.5 [\#757](https://github.com/liyasthomas/postwoman/pull/757) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump lint-staged from 10.1.2 to 10.1.3 [\#756](https://github.com/liyasthomas/postwoman/pull/756) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Fix indicator if extension is installed [\#748](https://github.com/liyasthomas/postwoman/pull/748) ([levrik](https://github.com/levrik))
-- Remove support for legacy extensions [\#747](https://github.com/liyasthomas/postwoman/pull/747) ([levrik](https://github.com/levrik))
-- Fix GQL introspection query not sent through extension [\#745](https://github.com/liyasthomas/postwoman/pull/745) ([levrik](https://github.com/levrik))
-- chore\(deps-dev\): bump prettier from 2.0.2 to 2.0.4 [\#744](https://github.com/liyasthomas/postwoman/pull/744) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump @nuxtjs/sitemap from 2.1.0 to 2.2.0 [\#743](https://github.com/liyasthomas/postwoman/pull/743) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump lint-staged from 10.1.1 to 10.1.2 [\#740](https://github.com/liyasthomas/postwoman/pull/740) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump nuxt-i18n from 6.8.0 to 6.8.1 [\#736](https://github.com/liyasthomas/postwoman/pull/736) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump ace-builds from 1.4.8 to 1.4.9 [\#735](https://github.com/liyasthomas/postwoman/pull/735) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump firebase from 7.13.1 to 7.13.2 [\#734](https://github.com/liyasthomas/postwoman/pull/734) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump vue-virtual-scroll-list from 1.4.6 to 1.4.7 [\#733](https://github.com/liyasthomas/postwoman/pull/733) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump nuxt-i18n from 6.7.2 to 6.8.0 [\#732](https://github.com/liyasthomas/postwoman/pull/732) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump nuxt from 2.12.1 to 2.12.2 [\#729](https://github.com/liyasthomas/postwoman/pull/729) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump nuxt-i18n from 6.7.1 to 6.7.2 [\#728](https://github.com/liyasthomas/postwoman/pull/728) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump lint-staged from 10.1.0 to 10.1.1 [\#727](https://github.com/liyasthomas/postwoman/pull/727) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump cypress from 4.2.0 to 4.3.0 [\#726](https://github.com/liyasthomas/postwoman/pull/726) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump lint-staged from 10.0.10 to 10.1.0 [\#725](https://github.com/liyasthomas/postwoman/pull/725) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump nuxt-i18n from 6.7.0 to 6.7.1 [\#724](https://github.com/liyasthomas/postwoman/pull/724) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump @nuxtjs/axios from 5.9.6 to 5.9.7 [\#723](https://github.com/liyasthomas/postwoman/pull/723) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump lint-staged from 10.0.9 to 10.0.10 [\#721](https://github.com/liyasthomas/postwoman/pull/721) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump @nuxtjs/axios from 5.9.5 to 5.9.6 [\#719](https://github.com/liyasthomas/postwoman/pull/719) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump @nuxtjs/sitemap from 2.0.1 to 2.1.0 [\#718](https://github.com/liyasthomas/postwoman/pull/718) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump firebase from 7.13.0 to 7.13.1 [\#717](https://github.com/liyasthomas/postwoman/pull/717) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump yargs-parser from 18.1.1 to 18.1.2 [\#713](https://github.com/liyasthomas/postwoman/pull/713) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump nuxt-i18n from 6.6.1 to 6.7.0 [\#712](https://github.com/liyasthomas/postwoman/pull/712) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump nuxt from 2.12.0 to 2.12.1 [\#711](https://github.com/liyasthomas/postwoman/pull/711) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump firebase from 7.12.0 to 7.13.0 [\#710](https://github.com/liyasthomas/postwoman/pull/710) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Updating the UI and style files [\#705](https://github.com/liyasthomas/postwoman/pull/705) ([liyasthomas](https://github.com/liyasthomas))
-- chore\(deps-dev\): bump lint-staged from 10.0.8 to 10.0.9 [\#703](https://github.com/liyasthomas/postwoman/pull/703) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Improving performance [\#702](https://github.com/liyasthomas/postwoman/pull/702) ([liyasthomas](https://github.com/liyasthomas))
-- :package: Updating packages [\#701](https://github.com/liyasthomas/postwoman/pull/701) ([liyasthomas](https://github.com/liyasthomas))
-- chore\(deps-dev\): bump prettier from 2.0.1 to 2.0.2 [\#700](https://github.com/liyasthomas/postwoman/pull/700) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump prettier from 1.19.1 to 2.0.1 [\#697](https://github.com/liyasthomas/postwoman/pull/697) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-
-## [v1.9.5](https://github.com/liyasthomas/postwoman/tree/v1.9.5) (2020-03-22)
-
-[Full Changelog](https://github.com/liyasthomas/postwoman/compare/v1.9.0...v1.9.5)
-
-**Fixed bugs:**
-
-- Test script is not run after failing request [\#644](https://github.com/liyasthomas/postwoman/issues/644)
-- \[HELP\] Auth permission denied [\#621](https://github.com/liyasthomas/postwoman/issues/621)
-- Can't login on Brave Browser [\#607](https://github.com/liyasthomas/postwoman/issues/607)
-
-**Closed issues:**
-
-- \[UI/UX\] - Change place of Send button [\#696](https://github.com/liyasthomas/postwoman/issues/696)
-- Support preview of JSON:API's "application/vnd.api+json" Content-Type [\#694](https://github.com/liyasthomas/postwoman/issues/694)
-- Report Portal integration [\#691](https://github.com/liyasthomas/postwoman/issues/691)
-- Docs request: how to prevent secrets from leaving local storage wrt. sync. [\#686](https://github.com/liyasthomas/postwoman/issues/686)
-- \[bug\] - Can't make a request to HTTP [\#676](https://github.com/liyasthomas/postwoman/issues/676)
-- Looking forward to that the postwoman Compatible 'swagger ' at next version [\#675](https://github.com/liyasthomas/postwoman/issues/675)
-- Error: Network Error. Check console for details. [\#673](https://github.com/liyasthomas/postwoman/issues/673)
-- \[Bug\] - Can't login to Github and Google [\#661](https://github.com/liyasthomas/postwoman/issues/661)
-- A question that has been raised but not resolved [\#658](https://github.com/liyasthomas/postwoman/issues/658)
-- An unknown error occurred whilst the proxy was processing your request. [\#656](https://github.com/liyasthomas/postwoman/issues/656)
-- Running app from downloaded zip fails to compile [\#651](https://github.com/liyasthomas/postwoman/issues/651)
-- Environment variable in path won't update [\#641](https://github.com/liyasthomas/postwoman/issues/641)
-- Info: The current domain is not authorized for OAuth operations Error [\#637](https://github.com/liyasthomas/postwoman/issues/637)
-- A suggestion for UI [\#635](https://github.com/liyasthomas/postwoman/issues/635)
-- How to use postwoman for local development and testing [\#634](https://github.com/liyasthomas/postwoman/issues/634)
-- How to debug localhost \(cors\) [\#630](https://github.com/liyasthomas/postwoman/issues/630)
-- Support SocketIO connections on Realtime page [\#611](https://github.com/liyasthomas/postwoman/issues/611)
-- Requests to local API returning error response [\#608](https://github.com/liyasthomas/postwoman/issues/608)
-- Why does the URL input field display only one line [\#604](https://github.com/liyasthomas/postwoman/issues/604)
-- Parameter list not showing JSON object fields \(force raw?\) [\#597](https://github.com/liyasthomas/postwoman/issues/597)
-- Add setting to disable scroll animations [\#592](https://github.com/liyasthomas/postwoman/issues/592)
-- Bigger URL and/or Path input field [\#581](https://github.com/liyasthomas/postwoman/issues/581)
-- Ability to connect to a MQTT broker [\#342](https://github.com/liyasthomas/postwoman/issues/342)
-- \[request\] Offline cross-platform native build [\#267](https://github.com/liyasthomas/postwoman/issues/267)
-- On Save Update existing API [\#204](https://github.com/liyasthomas/postwoman/issues/204)
-- Import and export environments from JSON [\#190](https://github.com/liyasthomas/postwoman/issues/190)
-- Fast URL entry [\#62](https://github.com/liyasthomas/postwoman/issues/62)
-
-**Merged pull requests:**
-
-- Add application/vnd.api+json [\#695](https://github.com/liyasthomas/postwoman/pull/695) ([allthesignals](https://github.com/allthesignals))
-- Fix raw input \(JSON\) [\#693](https://github.com/liyasthomas/postwoman/pull/693) ([leomp12](https://github.com/leomp12))
-- chore\(deps\): bump firebase from 7.11.0 to 7.12.0 [\#689](https://github.com/liyasthomas/postwoman/pull/689) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump vuefire from 2.2.1 to 2.2.2 [\#688](https://github.com/liyasthomas/postwoman/pull/688) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump cypress from 4.1.0 to 4.2.0 [\#685](https://github.com/liyasthomas/postwoman/pull/685) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump start-server-and-test from 1.10.10 to 1.10.11 [\#684](https://github.com/liyasthomas/postwoman/pull/684) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump nuxt-i18n from 6.6.0 to 6.6.1 [\#683](https://github.com/liyasthomas/postwoman/pull/683) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump nuxt from 2.11.0 to 2.12.0 [\#682](https://github.com/liyasthomas/postwoman/pull/682) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Fix setting default raw params [\#681](https://github.com/liyasthomas/postwoman/pull/681) ([leomp12](https://github.com/leomp12))
-- Fix handling content type and raw input [\#678](https://github.com/liyasthomas/postwoman/pull/678) ([leomp12](https://github.com/leomp12))
-- \[Snyk\] Security upgrade yargs-parser from 18.1.0 to 18.1.1 [\#674](https://github.com/liyasthomas/postwoman/pull/674) ([snyk-bot](https://github.com/snyk-bot))
-- chore\(deps-dev\): bump start-server-and-test from 1.10.9 to 1.10.10 [\#672](https://github.com/liyasthomas/postwoman/pull/672) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump firebase from 7.10.0 to 7.11.0 [\#671](https://github.com/liyasthomas/postwoman/pull/671) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- ✅ Updating tests [\#669](https://github.com/liyasthomas/postwoman/pull/669) ([liyasthomas](https://github.com/liyasthomas))
-- Updating tests [\#668](https://github.com/liyasthomas/postwoman/pull/668) ([liyasthomas](https://github.com/liyasthomas))
-- APIs [\#667](https://github.com/liyasthomas/postwoman/pull/667) ([liyasthomas](https://github.com/liyasthomas))
-- Insecure Websocket connection issue while connecting to MQTT broker. [\#666](https://github.com/liyasthomas/postwoman/pull/666) ([rahulnpadalkar](https://github.com/rahulnpadalkar))
-- Improving performance [\#664](https://github.com/liyasthomas/postwoman/pull/664) ([liyasthomas](https://github.com/liyasthomas))
-- Feature/mqtt [\#663](https://github.com/liyasthomas/postwoman/pull/663) ([liyasthomas](https://github.com/liyasthomas))
-- Added Support for MQTT [\#662](https://github.com/liyasthomas/postwoman/pull/662) ([rahulnpadalkar](https://github.com/rahulnpadalkar))
-- chore\(deps\): bump yargs-parser from 18.0.0 to 18.1.0 [\#660](https://github.com/liyasthomas/postwoman/pull/660) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump start-server-and-test from 1.10.8 to 1.10.9 [\#659](https://github.com/liyasthomas/postwoman/pull/659) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Added icon slot to tabs [\#657](https://github.com/liyasthomas/postwoman/pull/657) ([liyasthomas](https://github.com/liyasthomas))
-- Refactor/ui [\#655](https://github.com/liyasthomas/postwoman/pull/655) ([liyasthomas](https://github.com/liyasthomas))
-- even [\#654](https://github.com/liyasthomas/postwoman/pull/654) ([liyasthomas](https://github.com/liyasthomas))
-- chore\(deps\): bump yargs-parser from 17.0.0 to 18.0.0 [\#653](https://github.com/liyasthomas/postwoman/pull/653) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump firebase from 7.9.3 to 7.10.0 [\#652](https://github.com/liyasthomas/postwoman/pull/652) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Added the ability to prettify GraphQL queries [\#650](https://github.com/liyasthomas/postwoman/pull/650) ([AndrewBastin](https://github.com/AndrewBastin))
-- Add http/https support to socketio url valid [\#648](https://github.com/liyasthomas/postwoman/pull/648) ([moonrailgun](https://github.com/moonrailgun))
-- Refactor/ui [\#647](https://github.com/liyasthomas/postwoman/pull/647) ([liyasthomas](https://github.com/liyasthomas))
-- Even [\#646](https://github.com/liyasthomas/postwoman/pull/646) ([liyasthomas](https://github.com/liyasthomas))
-- Run tests even after failed request [\#645](https://github.com/liyasthomas/postwoman/pull/645) ([liyasthomas](https://github.com/liyasthomas))
-- Feature: add socket io support [\#640](https://github.com/liyasthomas/postwoman/pull/640) ([moonrailgun](https://github.com/moonrailgun))
-- Removed linting for the collection docs import editor [\#639](https://github.com/liyasthomas/postwoman/pull/639) ([AndrewBastin](https://github.com/AndrewBastin))
-- Moving or renaming files [\#638](https://github.com/liyasthomas/postwoman/pull/638) ([liyasthomas](https://github.com/liyasthomas))
-- Refactor/ui [\#636](https://github.com/liyasthomas/postwoman/pull/636) ([liyasthomas](https://github.com/liyasthomas))
-- Updated messages for when GraphQL Get Schema fails [\#633](https://github.com/liyasthomas/postwoman/pull/633) ([AndrewBastin](https://github.com/AndrewBastin))
-- Minor GraphQL page improvements [\#631](https://github.com/liyasthomas/postwoman/pull/631) ([dmitryyankowski](https://github.com/dmitryyankowski))
-- Ignore empty GQL Variable Strings [\#629](https://github.com/liyasthomas/postwoman/pull/629) ([AndrewBastin](https://github.com/AndrewBastin))
-- chore\(deps-dev\): bump cypress from 4.0.2 to 4.1.0 [\#628](https://github.com/liyasthomas/postwoman/pull/628) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump nuxt-i18n from 6.5.0 to 6.6.0 [\#627](https://github.com/liyasthomas/postwoman/pull/627) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump firebase from 7.9.1 to 7.9.3 [\#626](https://github.com/liyasthomas/postwoman/pull/626) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump @nuxtjs/google-tag-manager from 2.3.1 to 2.3.2 [\#625](https://github.com/liyasthomas/postwoman/pull/625) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- test: purge travis [\#623](https://github.com/liyasthomas/postwoman/pull/623) ([yubathom](https://github.com/yubathom))
-- Added shortcut to quickly run the GraphQL query [\#620](https://github.com/liyasthomas/postwoman/pull/620) ([AndrewBastin](https://github.com/AndrewBastin))
-- docs: add dmitryyankowski as a contributor [\#619](https://github.com/liyasthomas/postwoman/pull/619) ([allcontributors[bot]](https://github.com/apps/allcontributors))
-- Link multiple auth providers [\#618](https://github.com/liyasthomas/postwoman/pull/618) ([liyasthomas](https://github.com/liyasthomas))
-- Add --staged parameter to pretty-quick pre-commit [\#617](https://github.com/liyasthomas/postwoman/pull/617) ([dmitryyankowski](https://github.com/dmitryyankowski))
-- :bug: FIxed URI not updating on Clear content, minor formData improve… [\#612](https://github.com/liyasthomas/postwoman/pull/612) ([liyasthomas](https://github.com/liyasthomas))
-- Update proxy information. [\#610](https://github.com/liyasthomas/postwoman/pull/610) ([NBTX](https://github.com/NBTX))
-- Fixed install extension toast appearing even when extension is installed [\#609](https://github.com/liyasthomas/postwoman/pull/609) ([AndrewBastin](https://github.com/AndrewBastin))
-- chore\(deps-dev\): bump lint-staged from 10.0.7 to 10.0.8 [\#606](https://github.com/liyasthomas/postwoman/pull/606) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- JSON linting in the code editor [\#605](https://github.com/liyasthomas/postwoman/pull/605) ([AndrewBastin](https://github.com/AndrewBastin))
-- Added regex to handle url parts [\#603](https://github.com/liyasthomas/postwoman/pull/603) ([JacobAnavisca](https://github.com/JacobAnavisca))
-- GraphQL page improvements, and more [\#602](https://github.com/liyasthomas/postwoman/pull/602) ([dmitryyankowski](https://github.com/dmitryyankowski))
-- I18n [\#601](https://github.com/liyasthomas/postwoman/pull/601) ([liyasthomas](https://github.com/liyasthomas))
-- feat\(i18n\): add Korean [\#600](https://github.com/liyasthomas/postwoman/pull/600) ([9j](https://github.com/9j))
-- Improve page load/unload experience \(remove FOUCs\) [\#599](https://github.com/liyasthomas/postwoman/pull/599) ([NBTX](https://github.com/NBTX))
-- Feature: Add prettier/pretty-quick formatting w/ Husky pre-commit [\#596](https://github.com/liyasthomas/postwoman/pull/596) ([dmitryyankowski](https://github.com/dmitryyankowski))
-
-## [v1.9.0](https://github.com/liyasthomas/postwoman/tree/v1.9.0) (2020-02-24)
-
-[Full Changelog](https://github.com/liyasthomas/postwoman/compare/v1.8.0...v1.9.0)
-
-**Fixed bugs:**
-
-- Auto Theme Selection is kinda difficult to see [\#563](https://github.com/liyasthomas/postwoman/issues/563)
-- Can't send request to localhost via Chrome extention [\#560](https://github.com/liyasthomas/postwoman/issues/560)
-- Validation for duplicate collection ignores letter case [\#547](https://github.com/liyasthomas/postwoman/issues/547)
-- Build failed [\#327](https://github.com/liyasthomas/postwoman/issues/327)
-- Fixed typo in translation file for Auto theme [\#556](https://github.com/liyasthomas/postwoman/pull/556) ([AndrewBastin](https://github.com/AndrewBastin))
-
-**Closed issues:**
-
-- don't run [\#577](https://github.com/liyasthomas/postwoman/issues/577)
-- Get correct response data but occurs with error "Cannot read property 'value' of undefined" [\#575](https://github.com/liyasthomas/postwoman/issues/575)
-- firebase_app\_\_WEBPACK_IMPORTED_MODULE_2\_\_\_default.a.firestore is not a function [\#558](https://github.com/liyasthomas/postwoman/issues/558)
-- Disable SSL cert for websockets [\#557](https://github.com/liyasthomas/postwoman/issues/557)
-- relative module not found during start [\#552](https://github.com/liyasthomas/postwoman/issues/552)
-- Feature Request: Subfolders [\#540](https://github.com/liyasthomas/postwoman/issues/540)
-- Feature request: Keyboard shortcuts for folder creation [\#539](https://github.com/liyasthomas/postwoman/issues/539)
-- Add max-height and overflow: auto to "parameter list" textarea [\#532](https://github.com/liyasthomas/postwoman/issues/532)
-- Friendly minded GraphQL [\#468](https://github.com/liyasthomas/postwoman/issues/468)
-- multipart/form-data support [\#434](https://github.com/liyasthomas/postwoman/issues/434)
-- IE Support [\#386](https://github.com/liyasthomas/postwoman/issues/386)
-- ⏬ Import a Postman's Collection [\#333](https://github.com/liyasthomas/postwoman/issues/333)
-- Implement pre-request and post-request scripts \(and request chaining\) [\#218](https://github.com/liyasthomas/postwoman/issues/218)
-- Environment management and configuration [\#147](https://github.com/liyasthomas/postwoman/issues/147)
-
-**Merged pull requests:**
-
-- POST request body editor reacts to the content type [\#594](https://github.com/liyasthomas/postwoman/pull/594) ([AndrewBastin](https://github.com/AndrewBastin))
-- Fix variablesJSONString store default for GraphQL page [\#593](https://github.com/liyasthomas/postwoman/pull/593) ([dmitryyankowski](https://github.com/dmitryyankowski))
-- Environment Mangement [\#591](https://github.com/liyasthomas/postwoman/pull/591) ([JacobAnavisca](https://github.com/JacobAnavisca))
-- GraphQL Query Autocompletion [\#590](https://github.com/liyasthomas/postwoman/pull/590) ([AndrewBastin](https://github.com/AndrewBastin))
-- Refactor/lint [\#589](https://github.com/liyasthomas/postwoman/pull/589) ([liyasthomas](https://github.com/liyasthomas))
-- Even [\#588](https://github.com/liyasthomas/postwoman/pull/588) ([liyasthomas](https://github.com/liyasthomas))
-- chore\(deps\): bump firebase from 7.9.0 to 7.9.1 [\#587](https://github.com/liyasthomas/postwoman/pull/587) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Even [\#586](https://github.com/liyasthomas/postwoman/pull/586) ([liyasthomas](https://github.com/liyasthomas))
-- chore\(deps\): bump firebase from 7.8.2 to 7.9.0 [\#585](https://github.com/liyasthomas/postwoman/pull/585) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump vue-virtual-scroll-list from 1.4.5 to 1.4.6 [\#584](https://github.com/liyasthomas/postwoman/pull/584) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Adapt extension check to new extensions [\#583](https://github.com/liyasthomas/postwoman/pull/583) ([levrik](https://github.com/levrik))
-- Update link to extension repo in README [\#582](https://github.com/liyasthomas/postwoman/pull/582) ([levrik](https://github.com/levrik))
-- Even [\#579](https://github.com/liyasthomas/postwoman/pull/579) ([liyasthomas](https://github.com/liyasthomas))
-- Refactor/lint [\#578](https://github.com/liyasthomas/postwoman/pull/578) ([liyasthomas](https://github.com/liyasthomas))
-- chore\(deps\): bump vue-virtual-scroll-list from 1.4.4 to 1.4.5 [\#576](https://github.com/liyasthomas/postwoman/pull/576) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Postman collection parsing [\#574](https://github.com/liyasthomas/postwoman/pull/574) ([JacobAnavisca](https://github.com/JacobAnavisca))
-- Unify Chrome and Firefox extensions [\#573](https://github.com/liyasthomas/postwoman/pull/573) ([levrik](https://github.com/levrik))
-- fix: drop the toast which doesn't show up [\#572](https://github.com/liyasthomas/postwoman/pull/572) ([jamesgeorge007](https://github.com/jamesgeorge007))
-- :sparkles: Native share + updated meta description [\#571](https://github.com/liyasthomas/postwoman/pull/571) ([liyasthomas](https://github.com/liyasthomas))
-- chore\(deps\): bump firebase from 7.8.1 to 7.8.2 [\#570](https://github.com/liyasthomas/postwoman/pull/570) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump cypress from 4.0.1 to 4.0.2 [\#569](https://github.com/liyasthomas/postwoman/pull/569) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Added create collection and save request syncs [\#568](https://github.com/liyasthomas/postwoman/pull/568) ([JacobAnavisca](https://github.com/JacobAnavisca))
-- Moved common headers to a separate file [\#566](https://github.com/liyasthomas/postwoman/pull/566) ([AndrewBastin](https://github.com/AndrewBastin))
-- chore\(deps-dev\): bump cypress from 4.0.0 to 4.0.1 [\#565](https://github.com/liyasthomas/postwoman/pull/565) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump yargs-parser from 16.1.0 to 17.0.0 [\#564](https://github.com/liyasthomas/postwoman/pull/564) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump cypress from 3.8.3 to 4.0.0 [\#562](https://github.com/liyasthomas/postwoman/pull/562) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump firebase from 7.8.0 to 7.8.1 [\#561](https://github.com/liyasthomas/postwoman/pull/561) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore: use typeof as an operator and make use of localizable strings [\#559](https://github.com/liyasthomas/postwoman/pull/559) ([jamesgeorge007](https://github.com/jamesgeorge007))
-- Support for Formdata [\#555](https://github.com/liyasthomas/postwoman/pull/555) ([liyasthomas](https://github.com/liyasthomas))
-- chore\(deps\): bump @nuxtjs/pwa from 3.0.0-beta.19 to 3.0.0-beta.20 [\#554](https://github.com/liyasthomas/postwoman/pull/554) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump @nuxtjs/axios from 5.9.4 to 5.9.5 [\#553](https://github.com/liyasthomas/postwoman/pull/553) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Added toggle to decide whether extensions should be used [\#551](https://github.com/liyasthomas/postwoman/pull/551) ([AndrewBastin](https://github.com/AndrewBastin))
-- Show Ctrl instead of Command for shortcuts non-Apple platforms [\#549](https://github.com/liyasthomas/postwoman/pull/549) ([AndrewBastin](https://github.com/AndrewBastin))
-- fix\(chore\): Take letter casing into account while checking for duplicate collection [\#548](https://github.com/liyasthomas/postwoman/pull/548) ([jamesgeorge007](https://github.com/jamesgeorge007))
-- update e2e tests [\#546](https://github.com/liyasthomas/postwoman/pull/546) ([yubathom](https://github.com/yubathom))
-- chore\(deps\): bump @nuxtjs/axios from 5.9.3 to 5.9.4 [\#545](https://github.com/liyasthomas/postwoman/pull/545) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Refactor [\#543](https://github.com/liyasthomas/postwoman/pull/543) ([liyasthomas](https://github.com/liyasthomas))
-- chore\(deps\): bump firebase from 7.7.0 to 7.8.0 [\#542](https://github.com/liyasthomas/postwoman/pull/542) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump graphql from 14.5.8 to 14.6.0 [\#541](https://github.com/liyasthomas/postwoman/pull/541) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- i18n [\#538](https://github.com/liyasthomas/postwoman/pull/538) ([liyasthomas](https://github.com/liyasthomas))
-- Modification of French translations [\#537](https://github.com/liyasthomas/postwoman/pull/537) ([thomasbnt](https://github.com/thomasbnt))
-- Even [\#535](https://github.com/liyasthomas/postwoman/pull/535) ([liyasthomas](https://github.com/liyasthomas))
-- Updated GraphQL Query Variable Editor [\#534](https://github.com/liyasthomas/postwoman/pull/534) ([AndrewBastin](https://github.com/AndrewBastin))
-- Updating spanish translation [\#529](https://github.com/liyasthomas/postwoman/pull/529) ([liyasthomas](https://github.com/liyasthomas))
-- even merge [\#528](https://github.com/liyasthomas/postwoman/pull/528) ([liyasthomas](https://github.com/liyasthomas))
-
-## [v1.8.0](https://github.com/liyasthomas/postwoman/tree/v1.8.0) (2020-01-28)
-
-[Full Changelog](https://github.com/liyasthomas/postwoman/compare/v1.5.0...v1.8.0)
-
-**Fixed bugs:**
-
-- Warn the user if name field was left blank while creating a new collection [\#515](https://github.com/liyasthomas/postwoman/issues/515)
-- Multiple collections with the same name shouldn't exist [\#509](https://github.com/liyasthomas/postwoman/issues/509)
-- GraphQL String variables are null [\#497](https://github.com/liyasthomas/postwoman/issues/497)
-- Post request body is empty [\#473](https://github.com/liyasthomas/postwoman/issues/473)
-
-**Closed issues:**
-
-- Allow importing Postman collections [\#524](https://github.com/liyasthomas/postwoman/issues/524)
-- Request descriptions [\#511](https://github.com/liyasthomas/postwoman/issues/511)
-- Sync collection with a cloud storage \(e.g: Google drive\) [\#507](https://github.com/liyasthomas/postwoman/issues/507)
-- Ability to run all requests of a folder/collection [\#498](https://github.com/liyasthomas/postwoman/issues/498)
-- Change import/export collection on requests page icon [\#495](https://github.com/liyasthomas/postwoman/issues/495)
-- Application contains many hard-coded strings that aren't translatable [\#488](https://github.com/liyasthomas/postwoman/issues/488)
-- import cURL error [\#477](https://github.com/liyasthomas/postwoman/issues/477)
-- move to postwoman org [\#475](https://github.com/liyasthomas/postwoman/issues/475)
-- Create standalone vue components of the request builder. [\#474](https://github.com/liyasthomas/postwoman/issues/474)
-- ULR parsing and var auto creation [\#469](https://github.com/liyasthomas/postwoman/issues/469)
-- What about additional loaders: + Pug, TypeScript, SASS, material-vue ? [\#467](https://github.com/liyasthomas/postwoman/issues/467)
-- \[suggestion\] - Tests tab [\#465](https://github.com/liyasthomas/postwoman/issues/465)
-- cookie not found support [\#443](https://github.com/liyasthomas/postwoman/issues/443)
-- Feature Request: Consumer Driven Contract Testing [\#420](https://github.com/liyasthomas/postwoman/issues/420)
-- Feature Request: Support OAuth2/OIDC [\#337](https://github.com/liyasthomas/postwoman/issues/337)
-- Enable running proxy as a backend for Request Capture [\#325](https://github.com/liyasthomas/postwoman/issues/325)
-- Label doesn't change when switching between collection requests [\#291](https://github.com/liyasthomas/postwoman/issues/291)
-- Add DB cache [\#26](https://github.com/liyasthomas/postwoman/issues/26)
-
-**Merged pull requests:**
-
-- Enhancements [\#531](https://github.com/liyasthomas/postwoman/pull/531) ([jamesgeorge007](https://github.com/jamesgeorge007))
-- Merge pull request \#530 from liyasthomas/feature/post-request-tests [\#530](https://github.com/liyasthomas/postwoman/pull/530) ([liyasthomas](https://github.com/liyasthomas))
-- Refactor [\#523](https://github.com/liyasthomas/postwoman/pull/523) ([liyasthomas](https://github.com/liyasthomas))
-- chore\(deps\): bump nuxt-i18n from 6.4.1 to 6.5.0 [\#522](https://github.com/liyasthomas/postwoman/pull/522) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump v-tooltip from 2.0.2 to 2.0.3 [\#521](https://github.com/liyasthomas/postwoman/pull/521) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump cypress from 3.8.2 to 3.8.3 [\#520](https://github.com/liyasthomas/postwoman/pull/520) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Feature/post request tests [\#518](https://github.com/liyasthomas/postwoman/pull/518) ([nickpalenchar](https://github.com/nickpalenchar))
-- Validations for edit and create collections activity [\#516](https://github.com/liyasthomas/postwoman/pull/516) ([jamesgeorge007](https://github.com/jamesgeorge007))
-- Auth [\#513](https://github.com/liyasthomas/postwoman/pull/513) ([liyasthomas](https://github.com/liyasthomas))
-- Support for Google Chrome Extension [\#512](https://github.com/liyasthomas/postwoman/pull/512) ([AndrewBastin](https://github.com/AndrewBastin))
-- Validate duplicate collections [\#510](https://github.com/liyasthomas/postwoman/pull/510) ([jamesgeorge007](https://github.com/jamesgeorge007))
-- GraphQL query validation based on schema [\#508](https://github.com/liyasthomas/postwoman/pull/508) ([AndrewBastin](https://github.com/AndrewBastin))
-- Lint and refactor [\#506](https://github.com/liyasthomas/postwoman/pull/506) ([liyasthomas](https://github.com/liyasthomas))
-- Syntax Error marking in GraphQL query editor [\#505](https://github.com/liyasthomas/postwoman/pull/505) ([AndrewBastin](https://github.com/AndrewBastin))
-- Merge pull request \#504 from liyasthomas/dependabot/npm_and_yarn/node-sass-4.13.1 [\#504](https://github.com/liyasthomas/postwoman/pull/504) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump @nuxtjs/axios from 5.9.2 to 5.9.3 [\#503](https://github.com/liyasthomas/postwoman/pull/503) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps-dev\): bump sass-loader from 8.0.1 to 8.0.2 [\#502](https://github.com/liyasthomas/postwoman/pull/502) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- chore\(deps\): bump ace-builds from 1.4.7 to 1.4.8 [\#501](https://github.com/liyasthomas/postwoman/pull/501) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Refactoring proxy handling to be done in strategies [\#500](https://github.com/liyasthomas/postwoman/pull/500) ([AndrewBastin](https://github.com/AndrewBastin))
-- 💚 Fixed \#497 [\#499](https://github.com/liyasthomas/postwoman/pull/499) ([pushrbx](https://github.com/pushrbx))
-- Feat/firefox strategy [\#496](https://github.com/liyasthomas/postwoman/pull/496) ([liyasthomas](https://github.com/liyasthomas))
-- Firefox Extension compatibility [\#494](https://github.com/liyasthomas/postwoman/pull/494) ([AndrewBastin](https://github.com/AndrewBastin))
-- i18n Japanese: Added new translations [\#492](https://github.com/liyasthomas/postwoman/pull/492) ([reefqi037](https://github.com/reefqi037))
-- Merge pull request \#491 from liyasthomas/i18n [\#491](https://github.com/liyasthomas/postwoman/pull/491) ([liyasthomas](https://github.com/liyasthomas))
-- Replaced hard-coded strings with localizable strings [\#490](https://github.com/liyasthomas/postwoman/pull/490) ([liyasthomas](https://github.com/liyasthomas))
-- Network Strategies [\#487](https://github.com/liyasthomas/postwoman/pull/487) ([AndrewBastin](https://github.com/AndrewBastin))
-- chore\(oauth\): Added method signatures as per JSDoc conventions [\#486](https://github.com/liyasthomas/postwoman/pull/486) ([jamesgeorge007](https://github.com/jamesgeorge007))
-- chore: Minor tweaks [\#485](https://github.com/liyasthomas/postwoman/pull/485) ([jamesgeorge007](https://github.com/jamesgeorge007))
-- ⬆️ Bump cypress from 3.8.1 to 3.8.2 [\#483](https://github.com/liyasthomas/postwoman/pull/483) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- ⬆️ Bump sass-loader from 8.0.0 to 8.0.1 [\#482](https://github.com/liyasthomas/postwoman/pull/482) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- ⬆️ Bump @nuxtjs/google-analytics from 2.2.2 to 2.2.3 [\#481](https://github.com/liyasthomas/postwoman/pull/481) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- GraphQL Type Highlight and Links [\#479](https://github.com/liyasthomas/postwoman/pull/479) ([AndrewBastin](https://github.com/AndrewBastin))
-- OAuth 2.0/OIDC Access Token Retrieval Support [\#476](https://github.com/liyasthomas/postwoman/pull/476) ([reefqi037](https://github.com/reefqi037))
-
-## [v1.5.0](https://github.com/liyasthomas/postwoman/tree/v1.5.0) (2020-01-04)
-
-[Full Changelog](https://github.com/liyasthomas/postwoman/compare/v1.0.0...v1.5.0)
-
-**Fixed bugs:**
-
-- WebSocket page freezes when pasting long URL [\#471](https://github.com/liyasthomas/postwoman/issues/471)
-- API Documentation won't be generated [\#456](https://github.com/liyasthomas/postwoman/issues/456)
-- Sharing Requests via link is not working [\#435](https://github.com/liyasthomas/postwoman/issues/435)
-- URL input text is so stutters [\#412](https://github.com/liyasthomas/postwoman/issues/412)
-- Save to collections after deleting all the collections causes an error page [\#390](https://github.com/liyasthomas/postwoman/issues/390)
-- Bearer token doesn’t work with CORS when only authorization header is allowed [\#353](https://github.com/liyasthomas/postwoman/issues/353)
-- Make the UI more compact [\#314](https://github.com/liyasthomas/postwoman/issues/314)
-- Allow reserved characters on websocket URI [\#289](https://github.com/liyasthomas/postwoman/issues/289)
-- Unable to edit or delete row in history table [\#281](https://github.com/liyasthomas/postwoman/issues/281)
-- Allow url request with `/` at eol [\#275](https://github.com/liyasthomas/postwoman/issues/275)
-- \[request\] localhost support [\#274](https://github.com/liyasthomas/postwoman/issues/274)
-- Code generation for Fetch request type of some methods \(POST, PUT, PATCH\) won't be shown [\#268](https://github.com/liyasthomas/postwoman/issues/268)
-- \[BUG\] \[UI\] \[Mobile\] Get results not scrollable. [\#266](https://github.com/liyasthomas/postwoman/issues/266)
-- POSTing large raw JSON packets [\#265](https://github.com/liyasthomas/postwoman/issues/265)
-
-**Closed issues:**
-
-- Can WSDL be implemented, similar to SoapUI? [\#461](https://github.com/liyasthomas/postwoman/issues/461)
-- Module not found: Error: Can't resolve '../.postwoman/version.json' [\#457](https://github.com/liyasthomas/postwoman/issues/457)
-- \* ../.postwoman/version.json in ./node_modules/babel-loader/lib??ref--2-0!./node_modules/vue-loader/lib??vue-loader-options!./layouts/default.vue?vue&type=script&lang=js& friendly-errors 11:12:37 [\#448](https://github.com/liyasthomas/postwoman/issues/448)
-- Raw Request Body should be supported to format the JSON string [\#446](https://github.com/liyasthomas/postwoman/issues/446)
-- npm run dev module was not found: ../.postwoman/version.json [\#442](https://github.com/liyasthomas/postwoman/issues/442)
-- graphql and websocket work, but http and https do not [\#441](https://github.com/liyasthomas/postwoman/issues/441)
-- Can I test localhost? [\#433](https://github.com/liyasthomas/postwoman/issues/433)
-- No 'Access-Control-Allow-Origin' [\#426](https://github.com/liyasthomas/postwoman/issues/426)
-- When uninstall the PWA the "install PWA" link in postwoman.io isn't appear anymore [\#419](https://github.com/liyasthomas/postwoman/issues/419)
-- Toggling options will reset the UI to English [\#417](https://github.com/liyasthomas/postwoman/issues/417)
-- Ability to send Binary data using Postwoman [\#415](https://github.com/liyasthomas/postwoman/issues/415)
-- Oh my dear god why don't we just wrap it in electron [\#413](https://github.com/liyasthomas/postwoman/issues/413)
-- UI improvement suggestion for request method drop down [\#409](https://github.com/liyasthomas/postwoman/issues/409)
-- Can I share a request with my team? [\#408](https://github.com/liyasthomas/postwoman/issues/408)
-- Does it not support the post method? [\#403](https://github.com/liyasthomas/postwoman/issues/403)
-- Post can't send request [\#401](https://github.com/liyasthomas/postwoman/issues/401)
-- \[Bug\] fix header icons overlap [\#399](https://github.com/liyasthomas/postwoman/issues/399)
-- Custom request method [\#398](https://github.com/liyasthomas/postwoman/issues/398)
-- Improve translate for pt-BR \(i18n\) [\#395](https://github.com/liyasthomas/postwoman/issues/395)
-- Raw input disabled is not working properly [\#394](https://github.com/liyasthomas/postwoman/issues/394)
-- Input area is not clearly to identify for users because the dark mode [\#393](https://github.com/liyasthomas/postwoman/issues/393)
-- \[UX\] Setting to make sidebar buttons small [\#389](https://github.com/liyasthomas/postwoman/issues/389)
-- \[UX\] Improve responsive breaking points [\#388](https://github.com/liyasthomas/postwoman/issues/388)
-- \[UX\] Hide history/collections [\#387](https://github.com/liyasthomas/postwoman/issues/387)
-- Clearing shortcut overrides browser default [\#374](https://github.com/liyasthomas/postwoman/issues/374)
-- Proxy server default configuration [\#373](https://github.com/liyasthomas/postwoman/issues/373)
-- Intent to translate [\#367](https://github.com/liyasthomas/postwoman/issues/367)
-- \[request\]: CLI possibilities [\#363](https://github.com/liyasthomas/postwoman/issues/363)
-- Feature request: OAuth header support/integration [\#358](https://github.com/liyasthomas/postwoman/issues/358)
-- Static builds on releases [\#352](https://github.com/liyasthomas/postwoman/issues/352)
-- fix:SSE onclose handle [\#349](https://github.com/liyasthomas/postwoman/issues/349)
-- i18n support [\#348](https://github.com/liyasthomas/postwoman/issues/348)
-- Separate layers in dockerfile to improve image build [\#339](https://github.com/liyasthomas/postwoman/issues/339)
-- Internal server environment usage requirements [\#336](https://github.com/liyasthomas/postwoman/issues/336)
-- Server Sent Events [\#329](https://github.com/liyasthomas/postwoman/issues/329)
-- Generate API documentation [\#326](https://github.com/liyasthomas/postwoman/issues/326)
-- \[Request\] Use responses for next request? [\#324](https://github.com/liyasthomas/postwoman/issues/324)
-- Auth info on WebSocket connections [\#321](https://github.com/liyasthomas/postwoman/issues/321)
-- Set response panel to fullscreen [\#320](https://github.com/liyasthomas/postwoman/issues/320)
-- Graphql support [\#312](https://github.com/liyasthomas/postwoman/issues/312)
-- Keyboard shortcuts [\#302](https://github.com/liyasthomas/postwoman/issues/302)
-- File/binary request body support [\#298](https://github.com/liyasthomas/postwoman/issues/298)
-- Make response body area expandable [\#294](https://github.com/liyasthomas/postwoman/issues/294)
-- It's possible to tab into read only and non-form elements [\#287](https://github.com/liyasthomas/postwoman/issues/287)
-- Change cursor to disabled on disabled inputs [\#286](https://github.com/liyasthomas/postwoman/issues/286)
-- Hover Styling on Inputs [\#285](https://github.com/liyasthomas/postwoman/issues/285)
-- Focus Styles on Buttons [\#284](https://github.com/liyasthomas/postwoman/issues/284)
-- Mobile can't see console for request errors [\#283](https://github.com/liyasthomas/postwoman/issues/283)
-- Missing Focus on Inputs [\#279](https://github.com/liyasthomas/postwoman/issues/279)
-- Download the request result into a file. [\#278](https://github.com/liyasthomas/postwoman/issues/278)
-- Improve UI Contrast [\#277](https://github.com/liyasthomas/postwoman/issues/277)
-- Duplicated query string in generated code [\#272](https://github.com/liyasthomas/postwoman/issues/272)
-- Query parameters are duplicated [\#271](https://github.com/liyasthomas/postwoman/issues/271)
-- Generated code is incorrect [\#269](https://github.com/liyasthomas/postwoman/issues/269)
-- \[UI\] \[UX\] Allow app to take width of browser [\#236](https://github.com/liyasthomas/postwoman/issues/236)
-- Extend syntax highlighting with ACE for pre-request script textarea [\#235](https://github.com/liyasthomas/postwoman/issues/235)
-- Store pre-request scripts in history [\#233](https://github.com/liyasthomas/postwoman/issues/233)
-- Lacking documentation and wiki [\#232](https://github.com/liyasthomas/postwoman/issues/232)
-- Store the time spent on fetching a response [\#225](https://github.com/liyasthomas/postwoman/issues/225)
-- I can't send POST method [\#210](https://github.com/liyasthomas/postwoman/issues/210)
-- Cache view [\#188](https://github.com/liyasthomas/postwoman/issues/188)
-- Handling request failures when build number is obtained from GitHub [\#122](https://github.com/liyasthomas/postwoman/issues/122)
-
-**Merged pull requests:**
-
-- ⬆️ Bump @nuxtjs/axios from 5.9.0 to 5.9.2 [\#472](https://github.com/liyasthomas/postwoman/pull/472) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Added variables to graphql page. [\#464](https://github.com/liyasthomas/postwoman/pull/464) ([pushrbx](https://github.com/pushrbx))
-- i18n [\#463](https://github.com/liyasthomas/postwoman/pull/463) ([liyasthomas](https://github.com/liyasthomas))
-- ⬆️ Bump cypress from 3.8.0 to 3.8.1 [\#460](https://github.com/liyasthomas/postwoman/pull/460) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- i18n\(de-DE\): improve some translations [\#459](https://github.com/liyasthomas/postwoman/pull/459) ([gabschne](https://github.com/gabschne))
-- bn-BD i18n [\#455](https://github.com/liyasthomas/postwoman/pull/455) ([hmtanbir](https://github.com/hmtanbir))
-- API documentation page [\#451](https://github.com/liyasthomas/postwoman/pull/451) ([liyasthomas](https://github.com/liyasthomas))
-- ⬆️ Bump @nuxtjs/axios from 5.8.0 to 5.9.0 [\#450](https://github.com/liyasthomas/postwoman/pull/450) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- ⬆️ Bump nuxt from 2.10.2 to 2.11.0 [\#449](https://github.com/liyasthomas/postwoman/pull/449) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Various UI tweaks [\#439](https://github.com/liyasthomas/postwoman/pull/439) ([liyasthomas](https://github.com/liyasthomas))
-- i18n [\#438](https://github.com/liyasthomas/postwoman/pull/438) ([liyasthomas](https://github.com/liyasthomas))
-- Burmese translation added [\#437](https://github.com/liyasthomas/postwoman/pull/437) ([ZattWine](https://github.com/ZattWine))
-- chore: stick to Vue.js best practices [\#432](https://github.com/liyasthomas/postwoman/pull/432) ([jamesgeorge007](https://github.com/jamesgeorge007))
-- Styled select input [\#431](https://github.com/liyasthomas/postwoman/pull/431) ([liyasthomas](https://github.com/liyasthomas))
-- Bumped dependencies and Improved UI contrast [\#430](https://github.com/liyasthomas/postwoman/pull/430) ([liyasthomas](https://github.com/liyasthomas))
-- ⬆️ Bump cypress from 3.7.0 to 3.8.0 [\#429](https://github.com/liyasthomas/postwoman/pull/429) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- I18n [\#428](https://github.com/liyasthomas/postwoman/pull/428) ([liyasthomas](https://github.com/liyasthomas))
-- I18n Japanese translation added [\#427](https://github.com/liyasthomas/postwoman/pull/427) ([reefqi037](https://github.com/reefqi037))
-- Even [\#424](https://github.com/liyasthomas/postwoman/pull/424) ([liyasthomas](https://github.com/liyasthomas))
-- I18n [\#423](https://github.com/liyasthomas/postwoman/pull/423) ([liyasthomas](https://github.com/liyasthomas))
-- I18n German translation added [\#422](https://github.com/liyasthomas/postwoman/pull/422) ([NJannasch](https://github.com/NJannasch))
-- Header key autocompletion [\#421](https://github.com/liyasthomas/postwoman/pull/421) ([AndrewBastin](https://github.com/AndrewBastin))
-- Update id-ID.js [\#416](https://github.com/liyasthomas/postwoman/pull/416) ([williamsp](https://github.com/williamsp))
-- Improving translation for id-ID [\#414](https://github.com/liyasthomas/postwoman/pull/414) ([williamsp](https://github.com/williamsp))
-- Fixing bug on request saving [\#410](https://github.com/liyasthomas/postwoman/pull/410) ([adevr](https://github.com/adevr))
-- ⬆️ Bump @nuxtjs/google-analytics from 2.2.1 to 2.2.2 [\#407](https://github.com/liyasthomas/postwoman/pull/407) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- ⬆️ Bump vue-virtual-scroll-list from 1.4.3 to 1.4.4 [\#406](https://github.com/liyasthomas/postwoman/pull/406) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- ⬆️ Bump nuxt-i18n from 6.4.0 to 6.4.1 [\#405](https://github.com/liyasthomas/postwoman/pull/405) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- I18n [\#404](https://github.com/liyasthomas/postwoman/pull/404) ([yubathom](https://github.com/yubathom))
-- Custom methods support [\#400](https://github.com/liyasthomas/postwoman/pull/400) ([liyasthomas](https://github.com/liyasthomas))
-- App UI [\#391](https://github.com/liyasthomas/postwoman/pull/391) ([liyasthomas](https://github.com/liyasthomas))
-- i18n [\#383](https://github.com/liyasthomas/postwoman/pull/383) ([liyasthomas](https://github.com/liyasthomas))
-- Added Turkish Language Support [\#382](https://github.com/liyasthomas/postwoman/pull/382) ([AliAnilKocak](https://github.com/AliAnilKocak))
-- Translated new words to Farsi lang [\#380](https://github.com/liyasthomas/postwoman/pull/380) ([hosseinnedaee](https://github.com/hosseinnedaee))
-- Two Way Data Binding \(v-model\) to Ace Editor component [\#379](https://github.com/liyasthomas/postwoman/pull/379) ([AndrewBastin](https://github.com/AndrewBastin))
-- fix: twitter summary card image url [\#378](https://github.com/liyasthomas/postwoman/pull/378) ([peterpeterparker](https://github.com/peterpeterparker))
-- Added nav shortcuts to GraphQL query and response, updated GraphQL shortcut icons [\#377](https://github.com/liyasthomas/postwoman/pull/377) ([AndrewBastin](https://github.com/AndrewBastin))
-- Bump cypress from 3.6.1 to 3.7.0 [\#376](https://github.com/liyasthomas/postwoman/pull/376) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Bump vuex-persist from 2.1.1 to 2.2.0 [\#375](https://github.com/liyasthomas/postwoman/pull/375) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- I18n [\#372](https://github.com/liyasthomas/postwoman/pull/372) ([EdikWang](https://github.com/EdikWang))
-- Use GraphQL logo for GraphQL tab [\#371](https://github.com/liyasthomas/postwoman/pull/371) ([NBTX](https://github.com/NBTX))
-- Update i18n keywords for Bahasa Indonesia [\#369](https://github.com/liyasthomas/postwoman/pull/369) ([wahwahid](https://github.com/wahwahid))
-- Intent to translate to Spanish on I18n [\#368](https://github.com/liyasthomas/postwoman/pull/368) ([adlpaf](https://github.com/adlpaf))
-- I18n [\#366](https://github.com/liyasthomas/postwoman/pull/366) ([liyasthomas](https://github.com/liyasthomas))
-- Add translations for FR/EN catalogues [\#364](https://github.com/liyasthomas/postwoman/pull/364) ([LaurentBrieu](https://github.com/LaurentBrieu))
-- Added Bahasa Indonesia language support [\#362](https://github.com/liyasthomas/postwoman/pull/362) ([wahwahid](https://github.com/wahwahid))
-- i18n [\#361](https://github.com/liyasthomas/postwoman/pull/361) ([liyasthomas](https://github.com/liyasthomas))
-- Add Simplified Chinese language [\#360](https://github.com/liyasthomas/postwoman/pull/360) ([EdikWang](https://github.com/EdikWang))
-- Added Brazilian Portuguese language support [\#359](https://github.com/liyasthomas/postwoman/pull/359) ([tetri](https://github.com/tetri))
-- Added Farsi language support [\#357](https://github.com/liyasthomas/postwoman/pull/357) ([hosseinnedaee](https://github.com/hosseinnedaee))
-- Adding french language basic [\#355](https://github.com/liyasthomas/postwoman/pull/355) ([thomasbnt](https://github.com/thomasbnt))
-- Basic i18n support [\#351](https://github.com/liyasthomas/postwoman/pull/351) ([liyasthomas](https://github.com/liyasthomas))
-- Undo header/param/body param deletion [\#350](https://github.com/liyasthomas/postwoman/pull/350) ([AndrewBastin](https://github.com/AndrewBastin))
-- Added ability to run GraphQL queries [\#346](https://github.com/liyasthomas/postwoman/pull/346) ([AndrewBastin](https://github.com/AndrewBastin))
-- Add Proxy URL option [\#345](https://github.com/liyasthomas/postwoman/pull/345) ([NBTX](https://github.com/NBTX))
-- ♻️ Refactor Functions [\#344](https://github.com/liyasthomas/postwoman/pull/344) ([athul](https://github.com/athul))
-- refactor: minor improvements [\#343](https://github.com/liyasthomas/postwoman/pull/343) ([jamesgeorge007](https://github.com/jamesgeorge007))
-
-## [v1.0.0](https://github.com/liyasthomas/postwoman/tree/v1.0.0) (2019-11-04)
-
-[Full Changelog](https://github.com/liyasthomas/postwoman/compare/v0.1.0...v1.0.0)
-
-**Fixed bugs:**
-
-- Bearer Token value still left even after being cleared [\#212](https://github.com/liyasthomas/postwoman/issues/212)
-- All changes in input fields lost when you switch to another page [\#203](https://github.com/liyasthomas/postwoman/issues/203)
-- POST request json bodies aren't sent [\#180](https://github.com/liyasthomas/postwoman/issues/180)
-- Headers turn into 0 : \[Object object\] [\#166](https://github.com/liyasthomas/postwoman/issues/166)
-- Send Again Button Constantly Flickering [\#157](https://github.com/liyasthomas/postwoman/issues/157)
-- There are cross-domain problems [\#128](https://github.com/liyasthomas/postwoman/issues/128)
-- Raw requests are not being sent [\#124](https://github.com/liyasthomas/postwoman/issues/124)
-- Request Body Is Not Sent [\#113](https://github.com/liyasthomas/postwoman/issues/113)
-- default menu option - 'Http' is not highlighted when launched from installed pwa app \(UI bug\) [\#100](https://github.com/liyasthomas/postwoman/issues/100)
-- App is broken with old history in localStorage [\#74](https://github.com/liyasthomas/postwoman/issues/74)
-- Last added history entry is removed automatically after refresh [\#66](https://github.com/liyasthomas/postwoman/issues/66)
-- Cannot use localhost as base url [\#56](https://github.com/liyasthomas/postwoman/issues/56)
-- \[CORS\] No 'Access-Control-Allow-Origin' header is present on the requested resource [\#2](https://github.com/liyasthomas/postwoman/issues/2)
-
-**Closed issues:**
-
-- Section labels don't display properly in Firefox [\#237](https://github.com/liyasthomas/postwoman/issues/237)
-- Unsupported URLs \[BUG\]? [\#229](https://github.com/liyasthomas/postwoman/issues/229)
-- Credentials are still being included in Permalink even when "Include in URL" is turned off [\#227](https://github.com/liyasthomas/postwoman/issues/227)
-- Display sendRequest runtime errors in the console [\#206](https://github.com/liyasthomas/postwoman/issues/206)
-- Chain requests. Execute a bunch of requests one by one and produce results [\#196](https://github.com/liyasthomas/postwoman/issues/196)
-- Allow User to Choose Whether to Include Authentication in Permalink [\#178](https://github.com/liyasthomas/postwoman/issues/178)
-- Allow HTTP \(not HTTPS\) on postwoman.io [\#175](https://github.com/liyasthomas/postwoman/issues/175)
-- Docker-compose in development [\#168](https://github.com/liyasthomas/postwoman/issues/168)
-- Add Docker [\#164](https://github.com/liyasthomas/postwoman/issues/164)
-- Missing "Landing/start page" [\#162](https://github.com/liyasthomas/postwoman/issues/162)
-- Response with content-type "application/hal+json" shows as \[Object object\] [\#158](https://github.com/liyasthomas/postwoman/issues/158)
-- Clear Input [\#155](https://github.com/liyasthomas/postwoman/issues/155)
-- A place to discuss [\#149](https://github.com/liyasthomas/postwoman/issues/149)
-- Inconsistent version name [\#141](https://github.com/liyasthomas/postwoman/issues/141)
-- introduce some script language to parse the response and pass environment variable as request parameter [\#139](https://github.com/liyasthomas/postwoman/issues/139)
-- Add links to the footer version and commit sha [\#134](https://github.com/liyasthomas/postwoman/issues/134)
-- Please add a label for each request. It will be helpful. [\#133](https://github.com/liyasthomas/postwoman/issues/133)
-- Use 'icon buttons' instead of 'text buttons' [\#130](https://github.com/liyasthomas/postwoman/issues/130)
-- Change .editorconfig [\#115](https://github.com/liyasthomas/postwoman/issues/115)
-- \[UX\] Provide Focus State for Buttons, etc. [\#112](https://github.com/liyasthomas/postwoman/issues/112)
-- Autoresize the textarea [\#102](https://github.com/liyasthomas/postwoman/issues/102)
-- Content-Type revamping [\#99](https://github.com/liyasthomas/postwoman/issues/99)
-- Add linter semistandard [\#98](https://github.com/liyasthomas/postwoman/issues/98)
-- Add version number in footer [\#97](https://github.com/liyasthomas/postwoman/issues/97)
-- Show "Send" button all over the page or enable hotkeys [\#94](https://github.com/liyasthomas/postwoman/issues/94)
-- Import request from cURL [\#93](https://github.com/liyasthomas/postwoman/issues/93)
-- Search on History [\#92](https://github.com/liyasthomas/postwoman/issues/92)
-- Add support for "application/hal+json" Content-Type [\#88](https://github.com/liyasthomas/postwoman/issues/88)
-- The query string is built incorrectly when the path contains a parameter [\#87](https://github.com/liyasthomas/postwoman/issues/87)
-- The history doesn't show a date with the timestamp. [\#81](https://github.com/liyasthomas/postwoman/issues/81)
-- Option to Copy request as Fetch or XHR Or CURL [\#76](https://github.com/liyasthomas/postwoman/issues/76)
-- Not working on Brave Browser anymore [\#71](https://github.com/liyasthomas/postwoman/issues/71)
-- Why da fuq is your name plastered all over the README? [\#70](https://github.com/liyasthomas/postwoman/issues/70)
-- Comparison with Postman is missing [\#69](https://github.com/liyasthomas/postwoman/issues/69)
-- Add Tests [\#65](https://github.com/liyasthomas/postwoman/issues/65)
-- HTTP request with different library [\#61](https://github.com/liyasthomas/postwoman/issues/61)
-- Editorconfig file [\#60](https://github.com/liyasthomas/postwoman/issues/60)
-- 500 this.isValidURL is not a function [\#58](https://github.com/liyasthomas/postwoman/issues/58)
-- Request Headers [\#57](https://github.com/liyasthomas/postwoman/issues/57)
-- Colored response codes based on status code [\#46](https://github.com/liyasthomas/postwoman/issues/46)
-- Improve SEO [\#45](https://github.com/liyasthomas/postwoman/issues/45)
-- Add html preview to response section [\#41](https://github.com/liyasthomas/postwoman/issues/41)
-- websocket support [\#40](https://github.com/liyasthomas/postwoman/issues/40)
-- Styling with Tailwindcss [\#38](https://github.com/liyasthomas/postwoman/issues/38)
-- Not Working in IE 11 [\#37](https://github.com/liyasthomas/postwoman/issues/37)
-- Raw request body for POST requests and Authorization key/value in Header [\#36](https://github.com/liyasthomas/postwoman/issues/36)
-- Code highlight on response body [\#33](https://github.com/liyasthomas/postwoman/issues/33)
-- Template selector [\#32](https://github.com/liyasthomas/postwoman/issues/32)
-- Vue template [\#31](https://github.com/liyasthomas/postwoman/issues/31)
-- Add copy response to clipboard button [\#30](https://github.com/liyasthomas/postwoman/issues/30)
-- Ability to store/share/create collections [\#29](https://github.com/liyasthomas/postwoman/issues/29)
-- PWA not installable [\#19](https://github.com/liyasthomas/postwoman/issues/19)
-- Send request on Enter Key press [\#17](https://github.com/liyasthomas/postwoman/issues/17)
-- Simple Misspelling [\#8](https://github.com/liyasthomas/postwoman/issues/8)
-- Readable [\#5](https://github.com/liyasthomas/postwoman/issues/5)
-- Serialize a request into JSON? [\#4](https://github.com/liyasthomas/postwoman/issues/4)
-
-**Merged pull requests:**
-
-- docs: add liyasthomas as a contributor [\#264](https://github.com/liyasthomas/postwoman/pull/264) ([allcontributors[bot]](https://github.com/apps/allcontributors))
-- docs: add jamesgeorge007 as a contributor [\#263](https://github.com/liyasthomas/postwoman/pull/263) ([allcontributors[bot]](https://github.com/apps/allcontributors))
-- docs: add NBTX as a contributor [\#262](https://github.com/liyasthomas/postwoman/pull/262) ([allcontributors[bot]](https://github.com/apps/allcontributors))
-- Fix .all-contributorsrc badge template. [\#260](https://github.com/liyasthomas/postwoman/pull/260) ([NBTX](https://github.com/NBTX))
-- docs: add hosseinnedaee as a contributor [\#259](https://github.com/liyasthomas/postwoman/pull/259) ([allcontributors[bot]](https://github.com/apps/allcontributors))
-- docs: add nityanandagohain as a contributor [\#257](https://github.com/liyasthomas/postwoman/pull/257) ([allcontributors[bot]](https://github.com/apps/allcontributors))
-- docs: add JacobAnavisca as a contributor [\#256](https://github.com/liyasthomas/postwoman/pull/256) ([allcontributors[bot]](https://github.com/apps/allcontributors))
-- docs: add izerozlu as a contributor [\#255](https://github.com/liyasthomas/postwoman/pull/255) ([allcontributors[bot]](https://github.com/apps/allcontributors))
-- docs: add vlad0337187 as a contributor [\#254](https://github.com/liyasthomas/postwoman/pull/254) ([allcontributors[bot]](https://github.com/apps/allcontributors))
-- docs: add AndrewBastin as a contributor [\#253](https://github.com/liyasthomas/postwoman/pull/253) ([allcontributors[bot]](https://github.com/apps/allcontributors))
-- docs: add terranblake as a contributor [\#252](https://github.com/liyasthomas/postwoman/pull/252) ([allcontributors[bot]](https://github.com/apps/allcontributors))
-- docs: add nickpalenchar as a contributor [\#251](https://github.com/liyasthomas/postwoman/pull/251) ([allcontributors[bot]](https://github.com/apps/allcontributors))
-- docs: add yubathom as a contributor [\#250](https://github.com/liyasthomas/postwoman/pull/250) ([allcontributors[bot]](https://github.com/apps/allcontributors))
-- docs: add larouxn as a contributor [\#249](https://github.com/liyasthomas/postwoman/pull/249) ([allcontributors[bot]](https://github.com/apps/allcontributors))
-- docs: add NBTX as a contributor [\#248](https://github.com/liyasthomas/postwoman/pull/248) ([allcontributors[bot]](https://github.com/apps/allcontributors))
-- docs: add liyasthomas as a contributor [\#247](https://github.com/liyasthomas/postwoman/pull/247) ([allcontributors[bot]](https://github.com/apps/allcontributors))
-- Make page changes more fluid [\#246](https://github.com/liyasthomas/postwoman/pull/246) ([NBTX](https://github.com/NBTX))
-- Minor tweaks [\#245](https://github.com/liyasthomas/postwoman/pull/245) ([liyasthomas](https://github.com/liyasthomas))
-- Add brand new logo to the project [\#244](https://github.com/liyasthomas/postwoman/pull/244) ([caneco](https://github.com/caneco))
-- ⬆️ Bump @nuxtjs/google-tag-manager from 2.3.0 to 2.3.1 [\#243](https://github.com/liyasthomas/postwoman/pull/243) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- ⬆️ Bump yargs-parser from 15.0.0 to 16.1.0 [\#242](https://github.com/liyasthomas/postwoman/pull/242) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- ⬆️ Bump @nuxtjs/toast from 3.2.1 to 3.3.0 [\#241](https://github.com/liyasthomas/postwoman/pull/241) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- ⬆️ Bump highlight.js from 9.15.10 to 9.16.2 [\#240](https://github.com/liyasthomas/postwoman/pull/240) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- ⬆️ Bump cypress from 3.5.0 to 3.6.0 [\#239](https://github.com/liyasthomas/postwoman/pull/239) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Fix legend labels in Firefox, fix colored labels slider [\#238](https://github.com/liyasthomas/postwoman/pull/238) ([NBTX](https://github.com/NBTX))
-- Feature/pre request script [\#231](https://github.com/liyasthomas/postwoman/pull/231) ([nickpalenchar](https://github.com/nickpalenchar))
-- Documentation Cleanup [\#230](https://github.com/liyasthomas/postwoman/pull/230) ([amitdash291](https://github.com/amitdash291))
-- Fix \#227 Exclude credentials from permalink [\#228](https://github.com/liyasthomas/postwoman/pull/228) ([reefqi037](https://github.com/reefqi037))
-- ⬆️ Bump cypress from 3.4.1 to 3.5.0 [\#224](https://github.com/liyasthomas/postwoman/pull/224) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- ⬆️ Bump @nuxtjs/axios from 5.6.0 to 5.8.0 [\#223](https://github.com/liyasthomas/postwoman/pull/223) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- ⬆️ Bump node-sass from 4.12.0 to 4.13.0 [\#222](https://github.com/liyasthomas/postwoman/pull/222) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- ⬆️ Bump nuxt from 2.10.1 to 2.10.2 [\#221](https://github.com/liyasthomas/postwoman/pull/221) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- ⬆️ Bump @nuxtjs/google-analytics from 2.2.0 to 2.2.1 [\#220](https://github.com/liyasthomas/postwoman/pull/220) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- ⬆️ Bump vuex-persist from 2.1.0 to 2.1.1 [\#219](https://github.com/liyasthomas/postwoman/pull/219) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Add the ApolloTV proxy server [\#217](https://github.com/liyasthomas/postwoman/pull/217) ([NBTX](https://github.com/NBTX))
-- Fixed frame colors toggle [\#216](https://github.com/liyasthomas/postwoman/pull/216) ([mateusppereira](https://github.com/mateusppereira))
-- Re-order sections and add toggle for including authentication in URL [\#215](https://github.com/liyasthomas/postwoman/pull/215) ([NBTX](https://github.com/NBTX))
-- chore: minor code refactor [\#214](https://github.com/liyasthomas/postwoman/pull/214) ([jamesgeorge007](https://github.com/jamesgeorge007))
-- Fix \#212 Clear bearer token value [\#213](https://github.com/liyasthomas/postwoman/pull/213) ([reefqi037](https://github.com/reefqi037))
-- bug: keeping information on page change [\#211](https://github.com/liyasthomas/postwoman/pull/211) ([breno-pereira](https://github.com/breno-pereira))
-- Work in Progress: feature/allow-collections-importing [\#209](https://github.com/liyasthomas/postwoman/pull/209) ([vlad0337187](https://github.com/vlad0337187))
-- fix: don't display 'Collection is empty' label if collection has any … [\#208](https://github.com/liyasthomas/postwoman/pull/208) ([vlad0337187](https://github.com/vlad0337187))
-- Feature/log errors [\#207](https://github.com/liyasthomas/postwoman/pull/207) ([nickpalenchar](https://github.com/nickpalenchar))
-- Use returned value from toggle component on change event [\#205](https://github.com/liyasthomas/postwoman/pull/205) ([hosseinnedaee](https://github.com/hosseinnedaee))
-- Fix proxy URL [\#201](https://github.com/liyasthomas/postwoman/pull/201) ([NBTX](https://github.com/NBTX))
-- Fix CORS and Mixed-Content issue & Bug Fixes [\#200](https://github.com/liyasthomas/postwoman/pull/200) ([NBTX](https://github.com/NBTX))
-- Fix CORS and mixed content issue [\#199](https://github.com/liyasthomas/postwoman/pull/199) ([hosseinnedaee](https://github.com/hosseinnedaee))
-- ⬆️ Bump start-server-and-test from 1.10.5 to 1.10.6 [\#198](https://github.com/liyasthomas/postwoman/pull/198) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Added Tooltips [\#197](https://github.com/liyasthomas/postwoman/pull/197) ([AndrewBastin](https://github.com/AndrewBastin))
-- ⬆️ Bump start-server-and-test from 1.10.3 to 1.10.5 [\#194](https://github.com/liyasthomas/postwoman/pull/194) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- ⬆️ Bump @nuxtjs/google-tag-manager from 2.2.1 to 2.3.0 [\#193](https://github.com/liyasthomas/postwoman/pull/193) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- ⬆️ Bump nuxt from 2.10.0 to 2.10.1 [\#192](https://github.com/liyasthomas/postwoman/pull/192) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- ⬆️ Bump yargs-parser from 14.0.0 to 15.0.0 [\#191](https://github.com/liyasthomas/postwoman/pull/191) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- Add quotation marks for generated code [\#187](https://github.com/liyasthomas/postwoman/pull/187) ([johnhenry](https://github.com/johnhenry))
-- Added auto theme [\#185](https://github.com/liyasthomas/postwoman/pull/185) ([AndrewBastin](https://github.com/AndrewBastin))
-- Add Request name label for every requests [\#184](https://github.com/liyasthomas/postwoman/pull/184) ([sharath2106](https://github.com/sharath2106))
-- updated threshold and rootMargin for IntersectionObserver [\#182](https://github.com/liyasthomas/postwoman/pull/182) ([edisonaugusthy](https://github.com/edisonaugusthy))
-- Add basic e2e tests [\#181](https://github.com/liyasthomas/postwoman/pull/181) ([yubathom](https://github.com/yubathom))
-- ⬆️ Bump nuxt from 2.9.2 to 2.10.0 [\#179](https://github.com/liyasthomas/postwoman/pull/179) ([dependabot-preview[bot]](https://github.com/apps/dependabot-preview))
-- 🐛 Fixed sitemap configuration [\#177](https://github.com/liyasthomas/postwoman/pull/177) ([NicoPennec](https://github.com/NicoPennec))
-- Collections [\#176](https://github.com/liyasthomas/postwoman/pull/176) ([TheHollidayInn](https://github.com/TheHollidayInn))
-- Code Refactoring [\#173](https://github.com/liyasthomas/postwoman/pull/173) ([edisonaugusthy](https://github.com/edisonaugusthy))
-- Added Black Theme [\#172](https://github.com/liyasthomas/postwoman/pull/172) ([AndrewBastin](https://github.com/AndrewBastin))
-
-## [v0.1.0](https://github.com/liyasthomas/postwoman/tree/v0.1.0) (2019-08-22)
-
-[Full Changelog](https://github.com/liyasthomas/postwoman/compare/91c08a5e6305cc95a0df46a33fdd0013bf7339b4...v0.1.0)
-
-\* _This Changelog was automatically generated by [github_changelog_generator](https://github.com/github-changelog-generator/github-changelog-generator)_
+Visit [releases](https://github.com/hoppscotch/hoppscotch/releases) for full changelog.

CODEOWNERS

@@ -0,0 +1,21 @@
+# CODEOWNERS is prioritized from bottom to top
+
+# Packages
+/packages/codemirror-lang-graphql/                      @AndrewBastin
+/packages/hoppscotch-cli/                               @jamesgeorge007
+/packages/hoppscotch-data/                              @AndrewBastin
+/packages/hoppscotch-js-sandbox/                        @jamesgeorge007
+/packages/hoppscotch-selfhost-web/                      @jamesgeorge007
+/packages/hoppscotch-selfhost-desktop/                  @AndrewBastin
+/packages/hoppscotch-sh-admin/                          @JoelJacobStephen
+/packages/hoppscotch-backend/                           @balub
+
+# READMEs and other documentation files
+*.md                                                    @liyasthomas
+
+# Self Host deployment related files
+*.Dockerfile                                            @balub
+docker-compose.yml                                      @balub
+docker-compose.deploy.yml                               @balub
+*.Caddyfile                                             @balub
+.dockerignore                                           @balub

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, caste, color, 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.
@@ -17,23 +17,23 @@ diverse, inclusive, and healthy community.
 Examples of behavior that contributes to a positive environment for our
 community include:
 
-- Demonstrating empathy and kindness toward other people
-- Being respectful of differing opinions, viewpoints, and experiences
-- Giving and gracefully accepting constructive feedback
-- Accepting responsibility and apologizing to those affected by our mistakes,
+* Demonstrating empathy and kindness toward other people
+* Being respectful of differing opinions, viewpoints, and experiences
+* 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
-- 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
-- Other conduct which could reasonably be considered inappropriate in a
+* 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
+* Other conduct which could reasonably be considered inappropriate in a
   professional setting
 
 ## Enforcement Responsibilities
@@ -60,7 +60,7 @@ representative at an online or offline event.
 
 Instances of abusive, harassing, or otherwise unacceptable behavior may be
 reported to the community leaders responsible for enforcement at
-[INSERT CONTACT METHOD].
+support@hoppscotch.io.
 All complaints will be reviewed and investigated promptly and fairly.
 
 All community leaders are obligated to respect the privacy and security of the
@@ -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
 
@@ -109,24 +109,24 @@ Violating these terms may lead to a permanent ban.
 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][v2.0].
+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][mozilla coc].
+[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][faq]. Translations are available
-at [https://www.contributor-covenant.org/translations][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.0]: https://www.contributor-covenant.org/version/2/0/code_of_conduct.html
-[mozilla coc]: https://github.com/mozilla/diversity
-[faq]: https://www.contributor-covenant.org/faq
+[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

CONTRIBUTING.md

@@ -11,7 +11,4 @@ Please note we have a code of conduct, please follow it in all your interactions
    build.
 2. Update the README.md with details of changes to the interface, this includes new environment
    variables, exposed ports, useful file locations and container parameters.
-3. Increase the version numbers in any examples files and the README.md to the new version that this
-   Pull Request would represent. The versioning scheme we use is [SemVer](https://semver.org).
-4. You may merge the Pull Request once you have the sign-off of two other developers, or if you
-   do not have permission to do that, you may request the second reviewer merge it for you.
+3. Make sure you do not expose environment variables or other sensitive information in your PR.

Dockerfile

@@ -1,25 +0,0 @@
-FROM node:12-alpine
-
-LABEL maintainer="Hoppscotch (support@hoppscotch.io)"
-
-# Add git as the prebuild target requires it to parse version information
-RUN apk add --update --no-cache \
-  git
-
-# Create app directory
-WORKDIR /app
-
-COPY package*.json ./
-
-RUN npm install
-
-ADD . /app/
-
-COPY . .
-
-ENV HOST 0.0.0.0
-EXPOSE 3000
-
-RUN mv .env.example .env
-
-CMD ["npm", "run", "dev"]

LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2020
+Copyright (c) 2022
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -1,24 +1,19 @@
 <div align="center">
   <a href="https://hoppscotch.io">
     <img
-      src="https://raw.githubusercontent.com/hoppscotch/hoppscotch/main/static/logo.png"
-      alt="Hoppscotch Logo"
+      src="https://avatars.githubusercontent.com/u/56705483"
+      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)
@@ -35,48 +30,28 @@
   <br />
   <p>
     <a href="https://hoppscotch.io">
-      <img
-        src="https://raw.githubusercontent.com/hoppscotch/hoppscotch/main/static/images/screenshots/light_rest.png"
-        alt="Screenshot"
-        width="100%"
-      />
+      <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)
-
-<details open>
-  <summary><b>Table of contents</b></summary>
-
----
-
-- [Features](#features)
-- [Demo](#demo)
-- [Usage](#usage)
-- [Built with](#built-with)
-- [Developing](#developing)
-- [Docker](#docker)
-- [Releasing](#releasing)
-- [Contributing](#contributing)
-- [Continuous Integration](#continuous-integration)
-- [Changelog](#changelog)
-- [Authors](#authors)
-- [License](#license)
-
----
-
-</details>
+[![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)
 
 ### **Features**
 
 ❤️ **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
@@ -89,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 preference, Light, Dark, and Black
+- Choose accent colors: Green, Teal, Blue, Indigo, Purple, Yellow, Orange, Red, and Pink
+- Distraction-free Zen mode
 
-- Choose theme: System (default), Light, Dark and Black
-- Choose accent color: Green (default), Teal, Blue, Indigo, Purple, Yellow, Orange, Red and Pink
-- Distraction free Zen mode
+_Customized themes are synced with your cloud/local session._
 
-_Customized themes are synced with cloud / local session_
-
-🔥 **PWA:** Install as a [PWA](https://developers.google.com/web/progressive-web-apps) 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
@@ -120,11 +93,11 @@ _Customized themes are synced with cloud / local session_
 
 🔌 **WebSocket:** Establish full-duplex communication channels over a single TCP connection.
 
-📡 **Server Sent Events:** Receive a stream of updates from a server over a HTTP connection without resorting to polling.
+📡 **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 a MQTT Broker.
+🦟 **MQTT:** Subscribe and Publish to topics of an MQTT Broker.
 
 🔮 **GraphQL:** GraphQL is a query language for APIs and a runtime for fulfilling those queries with your existing data.
 
@@ -134,7 +107,7 @@ _Customized themes are synced with cloud / local session_
 - Query schema
 - Get query response
 
-🔐 **Authorization:** Allows to identify the end user.
+🔐 **Authorization:** Allows to identify the end-user.
 
 - None
 - Basic
@@ -142,101 +115,101 @@ _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.
 
 📃 **Request Body:** Used to send and receive data via the REST API.
 
 - Set `Content Type`
-- FormData, JSON and many more
+- 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.
 
-- Unlimited collections, folders and requests
+- Unlimited collections, folders, and requests
 - Nested folders
-- Export and import as file or GitHub gist
+- 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._
 
-🌐 **Proxy:** Enable Proxy Mode from Settings to access blocked APIs.
-
-- Hide your IP address
-- Fixes [`CORS`](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS) (Cross Origin Resource Sharing) issues
-- Access APIs served in non-HTTPS `[http://]` endpoints
-- Use your own Proxy URL
-
-_Official proxy server is hosted by Hoppscotch - **[GitHub](https://github.com/hoppscotch/proxyscotch)** - **[Privacy Policy](https://docs.hoppscotch.io/privacy)**_
-
-📜 **Pre-Request Scripts β:** Snippets of code associated with a request that are executed before the request is sent.
+📜 **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.
+👨‍👩‍👧‍👦 **Teams:** Helps you collaborate across your teams to design, develop, and test APIs faster.
 
-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
+- 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/features/shortcuts)**
+> **[Read our documentation on Keyboard Shortcuts](https://docs.hoppscotch.io/documentation/features/shortcuts)**
 
-🌎 **i18n:** Experience the app in your own language.
+🌐 **Proxy:** Enable Proxy Mode from Settings to access blocked APIs.
 
-📦 **Add-ons:** Official add-ons for hoppscotch.
+- Hide your IP address
+- Fixes [`CORS`](https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS) (Cross-Origin Resource Sharing) issues
+- Access APIs served in non-HTTPS (`http://`) endpoints
+- Use your Proxy URL
 
-- **[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
+_Official proxy server is hosted by Hoppscotch - **[GitHub](https://github.com/hoppscotch/proxyscotch)** - **[Privacy Policy](https://docs.hoppscotch.io/support/privacy)**._
 
-  [![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)
+🌎 **i18n:** Experience the app in your language.
 
-  > **Extensions fixes `CORS` issues.**
+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.
 
-- **[Hopp-Doc-Gen](https://github.com/hoppscotch/hopp-doc-gen)** - An API doc generator CLI for Hoppscotch
+☁️ **Auth + Sync:** Sign in and sync your data in real-time across all your devices.
 
-_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 are executed after the request 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
 - Parse the response data
-- Any JavaScript functions
+- 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 pre-request script
+- Initialize through the pre-request script
 - Export as / import from GitHub gist
 
 <details>
@@ -252,13 +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.
+🚚 **Bulk Edit:** Edit key-value pairs in bulk.
 
-- Unlimited team collections and shared requests
-- Unlimited team members
-- User roles
+- 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/hoppscotch/tree/main/packages/hoppscotch-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**
 
@@ -266,58 +257,13 @@ _Add-ons are developed and maintained under **[Hoppscotch Organization](https://
 
 ## **Usage**
 
-1. Choose `method`
-2. Enter `URL`
-3. Send request
-4. Get 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)
-- [Nuxt](https://nuxtjs.org)
+1. Provide your API endpoint in the URL field
+2. Click "Send" to simulate the request
+3. View the response
 
 ## **Developing**
 
-0. Update [`.env.example`](https://github.com/hoppscotch/hoppscotch/blob/main/.env.example) file found in repository's root directory with your own keys and rename it to `.env`.
-
-_Sample keys only works with the [production build](https://hoppscotch.io)._
-
-### Browser based development environment
-
-- [GitHub codespace](https://docs.github.com/en/codespaces/developing-in-codespaces/creating-a-codespace)
-- [Gitpod](https://gitpod.io/#https://github.com/hoppscotch/hoppscotch)
-
-### Local development environment
-
-1. [Clone this repo](https://help.github.com/en/articles/cloning-a-repository) with git.
-2. Install dependencies by running `npm install` within the directory that you cloned (probably `hoppscotch`).
-3. Start the development server with `npm run dev`.
-4. Open development site by going to [`http://localhost:3000`](http://localhost:3000) in your browser.
-
-### Docker compose
-
-1. [Clone this repo](https://help.github.com/en/articles/cloning-a-repository) with git.
-2. Run `docker-compose up`
-3. Open development site by going to [`http://localhost:3000`](http://localhost:3000) in your browser.
-
-## **Docker**
-
-**Official container** &nbsp; [![hoppscotch/hoppscotch](https://img.shields.io/docker/pulls/hoppscotch/hoppscotch?style=social)](https://hub.docker.com/r/hoppscotch/hoppscotch)
-
-```bash
-docker run --rm --name hoppscotch -p 3000:3000 hoppscotch/hoppscotch:latest
-```
-
-## **Releasing**
-
-1. [Clone this repo](https://help.github.com/en/articles/cloning-a-repository) with git.
-2. Install dependencies by running `npm install` within the directory that you cloned (probably `hoppscotch`).
-3. Build the release files with `npm run generate`.
-4. Find the built project in `./dist`.
+Follow our [self-hosting documentation](https://docs.hoppscotch.io/documentation/self-host/getting-started) to get started with the development environment.
 
 ## **Contributing**
 
@@ -335,7 +281,7 @@ See the [`CHANGELOG`](CHANGELOG.md) file for details.
 
 ## **Authors**
 
-This project exists thanks to all the people who contribute — [make a contribution](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">
@@ -347,4 +293,6 @@ This project exists thanks to all the people who contribute — [make a contribu
 
 ## **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).

SECURITY.md

@@ -0,0 +1,44 @@
+# Security Policy
+
+This document outlines security procedures and general policies for the Hoppscotch project.
+
+- [Security Policy](#security-policy)
+  - [Reporting a security vulnerability](#reporting-a-security-vulnerability)
+  - [What is not a valid vulnerability](#what-is-not-a-valid-vulnerability)
+  - [Incident response process](#incident-response-process)
+
+## Reporting a security vulnerability
+
+We use [Github Security Advisories](https://github.com/hoppscotch/hoppscotch/security/advisories) to manage vulnerability reports and collaboration.
+Someone from the Hoppscotch team shall report to you within 48 hours of the disclosure of the vulnerability in GHSA. If no response was received, please reach out to
+Hoppscotch Support at support@hoppscotch.io along with the GHSA advisory link.
+
+> NOTE: Since we have multiple open source components, Advisories may move into the relevant repo (for example, an XSS in a UI component might be part of [`@hoppscotch/ui`](https://github.com/hoppscotch/ui)).
+> If in doubt, open your report in `hoppscotch/hoppscotch` GHSA.
+
+**Do not create a GitHub issue ticket to report a security vulnerability!**
+
+The Hoppscotch team takes all security vulnerability reports in Hoppscotch seriously. We appreciate your efforts and responsible disclosure and will make every effort to acknowledge your contributions.
+
+## What is not a valid vulnerability
+We receive many reports about different sections of the Hoppscotch platform. Hence, we have a fine line we have drawn defining what is considered valid vulnerability.
+Please refrain from opening an advisory if it describes the following:
+
+- A vulnerability in a dependency of Hoppscotch (unless you have practical attack with it on the Hoppscotch codebase)
+- Reports of vulnerabilities related to old runtimes (like NodeJS) or container images used by the codebase
+- Vulnerabilities present when using Hoppscotch in anything other than the defined minimum requirements that Hoppscotch supports.
+
+Hoppscotch Team ensures security support for:
+- Modern Browsers (Chrome/Firefox/Safari/Edge) with versions up to 1 year old.
+- Windows versions on or above Windows 10 on Intel and ARM.
+- macOS versions dating back up to 2 years on Intel and Apple Silicon.
+- Popular Linux distributions with up-to-date packages with preference to x86/64 CPUs.
+- Docker/OCI Runtimes (preference to Docker and Podman) dating back up to 1 year.
+
+## Incident response process
+
+In case an incident is discovered or reported, we will follow the following  process to contain, respond, and remediate:
+
+1. Confirm the problem and determine the affected versions.
+2. Audit code to find any potential similar problems.
+3. Prepare fixes for all releases still under maintenance. These fixes will be deployed as fast as possible to production.

TRANSLATIONS.md

@@ -9,13 +9,14 @@ 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. **Create a new branch for your translation.**
-3. **Create target language file in the [`locales`](https://github.com/hoppscotch/hoppscotch/tree/main/locales) directory.**
-4. **Copy the contents of the source file [`locales/en.json`](https://github.com/hoppscotch/hoppscotch/blob/main/locales/en.json) to the target language file.**
-5. **Translate the strings in the target language file.**
-6. **Add your language entry to [`languages.json`](https://github.com/hoppscotch/hoppscotch/blob/main/languages.json).**
-7. **Save & commit changes.**
-8. **Send a pull request.**
+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 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._
 
@@ -25,7 +26,7 @@ Completing an initial translation of the whole site is a fairly large task. One
 
 ### 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
 

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
+}

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} /
+	}
+}

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)
+})

assets/README.md

@@ -1,5 +0,0 @@
-# ASSETS
-
-This directory contains your un-compiled assets such as LESS, SASS, or JavaScript.
-
-More information about the usage of this directory in [the documentation](https://nuxtjs.org/guide/assets#webpacked).

assets/icons/chrome.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient x1="49.998%" y1=".706%" x2="49.998%" y2="96.99%" id="IconifyId-17b2bfeca9d-d6badc-3320"><stop stop-color="#86BBE5" offset="0%"></stop><stop stop-color="#1072BA" offset="100%"></stop></linearGradient></defs><path d="M127.789.035s75.32-3.38 115.253 72.328H121.38s-22.96-.74-42.573 27.114c-5.634 11.691-11.69 23.734-4.894 47.468c-9.79-16.586-51.975-90.04-51.975-90.04S51.693 3.028 127.788.035z" fill="#EF3F36"></path><path d="M239.133 192.229s-34.756 66.94-120.253 63.63c10.564-18.276 60.848-105.358 60.848-105.358s12.149-19.508-2.183-50.425c-7.29-10.74-14.72-21.973-38.664-27.96c19.262-.175 103.95 0 103.95 0s31.726 52.715-3.698 120.113z" fill="#FCD900"></path><path d="M16.973 192.757s-40.601-63.56 5.035-135.958c10.529 18.276 60.813 105.358 60.813 105.358s10.846 20.283 44.756 23.31c12.924-.95 26.375-1.76 43.56-19.472C161.663 182.757 119.16 256 119.16 256s-61.552 1.127-102.188-63.243z" fill="#61BC5B"></path><path d="M118.845 256.493l17.113-71.412s18.804-1.48 34.58-18.769c-9.79 17.22-51.693 90.181-51.693 90.181z" fill="#5AB055"></path><path d="M70.462 129.056c0-31.48 25.53-57.01 57.01-57.01c31.48 0 57.01 25.53 57.01 57.01c0 31.481-25.53 57.01-57.01 57.01c-31.48-.035-57.01-25.529-57.01-57.01z" fill="#FFF"></path><path d="M80.004 129.056c0-26.198 21.234-47.467 47.468-47.467c26.198 0 47.467 21.234 47.467 47.467c0 26.199-21.233 47.468-47.467 47.468c-26.199 0-47.468-21.269-47.468-47.468z" fill="url(#IconifyId-17b2bfeca9d-d6badc-3320)"></path><path d="M242.795 72.152l-70.462 20.67s-10.634-15.6-33.487-20.67c19.825-.106 103.949 0 103.949 0z" fill="#EACA05"></path><path d="M72.54 144.339c-9.896-17.149-50.602-87.434-50.602-87.434l52.186 51.622s-5.353 11.022-3.345 26.797l1.76 9.015z" fill="#DF3A32"></path></svg>

assets/icons/discord.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="41.17" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 199"><path d="M216.856 16.597A208.502 208.502 0 0 0 164.042 0c-2.275 4.113-4.933 9.645-6.766 14.046c-19.692-2.961-39.203-2.961-58.533 0c-1.832-4.4-4.55-9.933-6.846-14.046a207.809 207.809 0 0 0-52.855 16.638C5.618 67.147-3.443 116.4 1.087 164.956c22.169 16.555 43.653 26.612 64.775 33.193A161.094 161.094 0 0 0 79.735 175.3a136.413 136.413 0 0 1-21.846-10.632a108.636 108.636 0 0 0 5.356-4.237c42.122 19.702 87.89 19.702 129.51 0a131.66 131.66 0 0 0 5.355 4.237a136.07 136.07 0 0 1-21.886 10.653c4.006 8.02 8.638 15.67 13.873 22.848c21.142-6.58 42.646-16.637 64.815-33.213c5.316-56.288-9.08-105.09-38.056-148.36zM85.474 135.095c-12.645 0-23.015-11.805-23.015-26.18s10.149-26.2 23.015-26.2c12.867 0 23.236 11.804 23.015 26.2c.02 14.375-10.148 26.18-23.015 26.18zm85.051 0c-12.645 0-23.014-11.805-23.014-26.18s10.148-26.2 23.014-26.2c12.867 0 23.236 11.804 23.015 26.2c0 14.375-10.148 26.18-23.015 26.18z" fill="#5865F2"></path></svg>

assets/icons/email.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--simple-icons" width="32" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 24 24"><path d="M15.61 12c0 1.99-1.62 3.61-3.61 3.61c-1.99 0-3.61-1.62-3.61-3.61c0-1.99 1.62-3.61 3.61-3.61c1.99 0 3.61 1.62 3.61 3.61M12 0C5.383 0 0 5.383 0 12s5.383 12 12 12c2.424 0 4.761-.722 6.76-2.087l.034-.024l-1.617-1.879l-.027.017A9.494 9.494 0 0 1 12 21.54c-5.26 0-9.54-4.28-9.54-9.54c0-5.26 4.28-9.54 9.54-9.54c5.26 0 9.54 4.28 9.54 9.54a9.63 9.63 0 0 1-.225 2.05c-.301 1.239-1.169 1.618-1.82 1.568c-.654-.053-1.42-.52-1.426-1.661V12A6.076 6.076 0 0 0 12 5.93A6.076 6.076 0 0 0 5.93 12A6.076 6.076 0 0 0 12 18.07a6.02 6.02 0 0 0 4.3-1.792a3.9 3.9 0 0 0 3.32 1.805c.874 0 1.74-.292 2.437-.821c.719-.547 1.256-1.336 1.553-2.285c.047-.154.135-.504.135-.507l.002-.013c.175-.76.253-1.52.253-2.457c0-6.617-5.383-12-12-12" fill="currentColor"></path></svg>

assets/icons/facebook.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="32" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M241.871 256.001c7.802 0 14.129-6.326 14.129-14.129V14.129C256 6.325 249.673 0 241.871 0H14.129C6.324 0 0 6.325 0 14.129v227.743c0 7.803 6.324 14.129 14.129 14.129h227.742" fill="#395185"></path><path d="M176.635 256.001v-99.137h33.277l4.982-38.635h-38.259V93.561c0-11.186 3.107-18.809 19.148-18.809l20.459-.009V40.188c-3.54-.471-15.684-1.523-29.812-1.523c-29.498 0-49.692 18.005-49.692 51.071v28.493h-33.362v38.635h33.362v99.137h39.897" fill="#FFF"></path></svg>

assets/icons/github.svg

@@ -1 +0,0 @@
-<svg width="2500" height="2432" viewBox="0 0 256 249" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMinYMin meet"><g fill="currentColor"><path d="M127.505 0C57.095 0 0 57.085 0 127.505c0 56.336 36.534 104.13 87.196 120.99 6.372 1.18 8.712-2.766 8.712-6.134 0-3.04-.119-13.085-.173-23.739-35.473 7.713-42.958-15.044-42.958-15.044-5.8-14.738-14.157-18.656-14.157-18.656-11.568-7.914.872-7.752.872-7.752 12.804.9 19.546 13.14 19.546 13.14 11.372 19.493 29.828 13.857 37.104 10.6 1.144-8.242 4.449-13.866 8.095-17.05-28.32-3.225-58.092-14.158-58.092-63.014 0-13.92 4.981-25.295 13.138-34.224-1.324-3.212-5.688-16.18 1.235-33.743 0 0 10.707-3.427 35.073 13.07 10.17-2.826 21.078-4.242 31.914-4.29 10.836.048 21.752 1.464 31.942 4.29 24.337-16.497 35.029-13.07 35.029-13.07 6.94 17.563 2.574 30.531 1.25 33.743 8.175 8.929 13.122 20.303 13.122 34.224 0 48.972-29.828 59.756-58.22 62.912 4.573 3.957 8.648 11.717 8.648 23.612 0 17.06-.148 30.791-.148 34.991 0 3.393 2.295 7.369 8.759 6.117 50.634-16.879 87.122-64.656 87.122-120.973C255.009 57.085 197.922 0 127.505 0"/><path d="M47.755 181.634c-.28.633-1.278.823-2.185.389-.925-.416-1.445-1.28-1.145-1.916.275-.652 1.273-.834 2.196-.396.927.415 1.455 1.287 1.134 1.923M54.027 187.23c-.608.564-1.797.302-2.604-.589-.834-.889-.99-2.077-.373-2.65.627-.563 1.78-.3 2.616.59.834.899.996 2.08.36 2.65M58.33 194.39c-.782.543-2.06.034-2.849-1.1-.781-1.133-.781-2.493.017-3.038.792-.545 2.05-.055 2.85 1.07.78 1.153.78 2.513-.019 3.069M65.606 202.683c-.699.77-2.187.564-3.277-.488-1.114-1.028-1.425-2.487-.724-3.258.707-.772 2.204-.555 3.302.488 1.107 1.026 1.445 2.496.7 3.258M75.01 205.483c-.307.998-1.741 1.452-3.185 1.028-1.442-.437-2.386-1.607-2.095-2.616.3-1.005 1.74-1.478 3.195-1.024 1.44.435 2.386 1.596 2.086 2.612M85.714 206.67c.036 1.052-1.189 1.924-2.705 1.943-1.525.033-2.758-.818-2.774-1.852 0-1.062 1.197-1.926 2.721-1.951 1.516-.03 2.758.815 2.758 1.86M96.228 206.267c.182 1.026-.872 2.08-2.377 2.36-1.48.27-2.85-.363-3.039-1.38-.184-1.052.89-2.105 2.367-2.378 1.508-.262 2.857.355 3.049 1.398"/></g></svg>

assets/icons/google.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M118.2 208.3c19.9-60.3 76.5-103.6 143.7-103.6 36.1 0 68.6 12.8 94.3 33.7L430.5 64C385.2 24.4 327 0 261.8 0 160.9 0 74 57.6 32.3 141.9l85.9 66.4z" fill="currentColor"/><path d="M348 384.3c-23.3 15-52.8 23-86.2 23-66.9 0-123.3-43-143.4-102.9l-86.2 65.4C73.9 454.3 160.8 512 261.8 512c62.6 0 122.4-22.2 167.1-64L348 384.3z" fill="currentColor"/><path d="M428.9 448c46.8-43.7 77.2-108.7 77.2-192 0-15.1-2.3-31.4-5.8-46.5H261.8v98.9h137.3c-6.8 33.3-25 59-51.1 75.9l80.9 63.7z" fill="currentColor"/><path d="M118.4 304.4c-5.1-15.2-7.9-31.4-7.9-48.4 0-16.7 2.7-32.7 7.6-47.7l-85.9-66.4C15.1 176.2 5.8 214.9 5.8 256c0 40.9 9.5 79.6 26.4 113.8l86.2-65.4z" fill="currentColor"/></svg>

assets/icons/graphql.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--fontisto" width="28" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 21 24"><path d="M12.731 2.751L17.666 5.6a2.138 2.138 0 1 1 2.07 3.548l-.015.003v5.7a2.14 2.14 0 1 1-2.098 3.502l-.002-.002l-4.905 2.832a2.14 2.14 0 1 1-4.079.054l-.004.015l-4.941-2.844a2.14 2.14 0 1 1-2.067-3.556l.015-.003V9.15a2.14 2.14 0 1 1 1.58-3.926l-.01-.005c.184.106.342.231.479.376l.001.001l4.938-2.85a2.14 2.14 0 1 1 4.096.021l.004-.015zm-.515.877a.766.766 0 0 1-.057.057l-.001.001l6.461 11.19c.026-.009.056-.016.082-.023V9.146a2.14 2.14 0 0 1-1.555-2.603l-.003.015l.019-.072zm-3.015.059l-.06-.06l-4.946 2.852A2.137 2.137 0 0 1 2.749 9.12l-.015.004l-.076.021v5.708l.084.023l6.461-11.19zm2.076.507a2.164 2.164 0 0 1-1.207-.004l.015.004l-6.46 11.189c.286.276.496.629.597 1.026l.003.015h12.911c.102-.413.313-.768.599-1.043l.001-.001L11.28 4.194zm.986 16.227l4.917-2.838a1.748 1.748 0 0 1-.038-.142H4.222l-.021.083l4.939 2.852c.39-.403.936-.653 1.54-.653c.626 0 1.189.268 1.581.696l.001.002z" fill="currentColor"></path></svg>

assets/icons/linkedin.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="32" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><path d="M218.123 218.127h-37.931v-59.403c0-14.165-.253-32.4-19.728-32.4c-19.756 0-22.779 15.434-22.779 31.369v60.43h-37.93V95.967h36.413v16.694h.51a39.907 39.907 0 0 1 35.928-19.733c38.445 0 45.533 25.288 45.533 58.186l-.016 67.013zM56.955 79.27c-12.157.002-22.014-9.852-22.016-22.009c-.002-12.157 9.851-22.014 22.008-22.016c12.157-.003 22.014 9.851 22.016 22.008A22.013 22.013 0 0 1 56.955 79.27m18.966 138.858H37.95V95.967h37.97v122.16zM237.033.018H18.89C8.58-.098.125 8.161-.001 18.471v219.053c.122 10.315 8.576 18.582 18.89 18.474h218.144c10.336.128 18.823-8.139 18.966-18.474V18.454c-.147-10.33-8.635-18.588-18.966-18.453" fill="#0A66C2"></path></svg>

assets/icons/reddit.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="32" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 256"><circle fill="#FF4500" cx="128" cy="128" r="128"></circle><path d="M213.15 129.22c0-10.376-8.391-18.617-18.617-18.617a18.74 18.74 0 0 0-12.97 5.189c-12.818-9.157-30.368-15.107-49.9-15.87l8.544-39.981l27.773 5.95c.307 7.02 6.104 12.667 13.278 12.667c7.324 0 13.275-5.95 13.275-13.278c0-7.324-5.95-13.275-13.275-13.275c-5.188 0-9.768 3.052-11.904 7.478l-30.976-6.562c-.916-.154-1.832 0-2.443.458c-.763.458-1.22 1.22-1.371 2.136l-9.464 44.558c-19.837.612-37.692 6.562-50.662 15.872a18.74 18.74 0 0 0-12.971-5.188c-10.377 0-18.617 8.391-18.617 18.617c0 7.629 4.577 14.037 10.988 16.939a33.598 33.598 0 0 0-.458 5.646c0 28.686 33.42 52.036 74.621 52.036c41.202 0 74.622-23.196 74.622-52.036a35.29 35.29 0 0 0-.458-5.646c6.408-2.902 10.985-9.464 10.985-17.093zM85.272 142.495c0-7.324 5.95-13.275 13.278-13.275c7.324 0 13.275 5.95 13.275 13.275s-5.95 13.278-13.275 13.278c-7.327.15-13.278-5.953-13.278-13.278zm74.317 35.251c-9.156 9.157-26.553 9.768-31.588 9.768c-5.188 0-22.584-.765-31.59-9.768c-1.371-1.373-1.371-3.51 0-4.883c1.374-1.371 3.51-1.371 4.884 0c5.8 5.8 18.008 7.782 26.706 7.782c8.699 0 21.058-1.983 26.704-7.782c1.374-1.371 3.51-1.371 4.884 0c1.22 1.373 1.22 3.51 0 4.883zm-2.443-21.822c-7.325 0-13.275-5.95-13.275-13.275s5.95-13.275 13.275-13.275c7.327 0 13.277 5.95 13.277 13.275c0 7.17-5.95 13.275-13.277 13.275z" fill="#FFF"></path></svg>

assets/icons/twitter.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="39.2" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 209"><path d="M256 25.45c-9.42 4.177-19.542 7-30.166 8.27c10.845-6.5 19.172-16.793 23.093-29.057a105.183 105.183 0 0 1-33.351 12.745C205.995 7.201 192.346.822 177.239.822c-29.006 0-52.523 23.516-52.523 52.52c0 4.117.465 8.125 1.36 11.97c-43.65-2.191-82.35-23.1-108.255-54.876c-4.52 7.757-7.11 16.78-7.11 26.404c0 18.222 9.273 34.297 23.365 43.716a52.312 52.312 0 0 1-23.79-6.57c-.003.22-.003.44-.003.661c0 25.447 18.104 46.675 42.13 51.5a52.592 52.592 0 0 1-23.718.9c6.683 20.866 26.08 36.05 49.062 36.475c-17.975 14.086-40.622 22.483-65.228 22.483c-4.24 0-8.42-.249-12.529-.734c23.243 14.902 50.85 23.597 80.51 23.597c96.607 0 149.434-80.031 149.434-149.435c0-2.278-.05-4.543-.152-6.795A106.748 106.748 0 0 0 256 25.45" fill="#55acee"></path></svg>

assets/js/getLinkTag.js

@@ -1,18 +0,0 @@
-const DEFAULT_TAG = "button"
-const ANCHOR_TAG = "a"
-const FRAMEWORK_LINK = "NuxtLink" // or "router-link", "g-link"...
-
-const getLinkTag = ({ to, blank }) => {
-  if (!to) {
-    return DEFAULT_TAG
-  } else if (blank) {
-    return ANCHOR_TAG
-  } else if (/^\/(?!\/).*$/.test(to)) {
-    // regex101.com/r/LU1iFL/1
-    return FRAMEWORK_LINK
-  } else {
-    return ANCHOR_TAG
-  }
-}
-
-export { getLinkTag as default, ANCHOR_TAG, FRAMEWORK_LINK }

assets/md/docs.md

@@ -1,15 +0,0 @@
-**Table of Contents**
-
-{{#collections}}
-{{>folderContents}}
-{{/collections}}
-
-{{#collections}}
-
-{{>folderBody}}
-
-{{/collections}}
-
----
-
-Made with [Hoppscotch](https://github.com/hoppscotch/hoppscotch)

assets/md/folderBody.md

@@ -1,113 +0,0 @@
-{{nestingLevel}} {{name}}
-
-{{#requests}}
-
-{{nestingLevel}} Request: {{name}}
-
-**Method**: {{method}}
-
-**Request URL**:
-
-```
-{{{url}}}{{{path}}}
-```
-
-{{#isHeaders}}
-**Headers**:
-
-<table>
-<tr>
-<th>Key</th>
-<th>Value</th>
-</tr>
-{{#headers}}
-<tr>
-<td>{{{key}}}</td>
-<td>`{{{value}}}`</td>
-</tr>
-{{/headers}}
-</table>
-{{/isHeaders}}
-
-{{#isParams}}
-**Parameters**:
-
-<table>
-<tr>
-<th>type</th>
-<th>Key</th>
-<th>Value</th>
-</tr>
-{{#params}}
-<tr>
-<td>{{type}}</td>
-<td>{{{key}}}</td>
-<td>{{{value}}}</td>
-</tr>
-{{/params}}
-</table>
-{{/isParams}}
-
-{{#isAuth}}
-**Authentication Type**: {{{auth}}}
-{{/isAuth}}
-
-{{#bearerToken}}
-**Bearer Token**: `{{{.}}}`
-{{/bearerToken}}
-
-{{#isAuthBasic}}
-Username: `{{{httpUser}}}`
-Password: `{{{httpPassword}}}`
-{{/isAuthBasic}}
-
-{{#isRawParams}}
-**Raw Parameters**:
-
-```json
-{{{rawParams}}}
-```
-
-{{/isRawParams}}
-
-{{#contentType}}
-**Content Type**: `{{{contentType}}}`
-{{/contentType}}
-
-{{#isPreRequestScript}}
-**Pre Request Script**:
-
-```js
-{
-  {
-    {
-      preRequestScript
-    }
-  }
-}
-```
-
-{{/isPreRequestScript}}
-
-{{#isTestScript}}
-**Test Script**:
-
-```js
-{
-  {
-    {
-      testScript
-    }
-  }
-}
-```
-
-{{/isTestScript}}
-
-{{/requests}}
-
-{{#folders}}
-
-{{> folderBody }}
-
-{{/folders}}

assets/md/folderContents.md

@@ -1,4 +0,0 @@
-{{{id}}} <a href="#{{ref}}"> {{name}} </a> <br>
-{{#folders}}
-{{> folderContents}}
-{{/folders}}

assets/scss/styles.scss

@@ -1,485 +0,0 @@
-*,
-*::before,
-*::after {
-  @apply backface-hidden;
-}
-
-:root {
-  @apply antialiased;
-
-  font-variant-ligatures: common-ligatures;
-}
-
-::-webkit-scrollbar-track {
-  @apply bg-transparent;
-}
-
-::-webkit-scrollbar-thumb {
-  @apply bg-divider bg-clip-content;
-  @apply rounded-full;
-  @apply border-solid border-4 border-transparent;
-  @apply hover:(bg-dividerDark bg-clip-content);
-}
-
-::-webkit-scrollbar {
-  @apply w-4;
-  @apply h-4;
-}
-
-.hide-scrollbar::-webkit-scrollbar {
-  @apply hidden;
-}
-
-::selection {
-  @apply bg-accent;
-  @apply text-accentContrast;
-}
-
-input::placeholder {
-  @apply text-secondaryDark;
-  @apply opacity-25;
-}
-
-input {
-  @apply text-secondaryDark;
-  @apply font-medium;
-}
-
-html {
-  scroll-behavior: smooth;
-}
-
-body {
-  @apply bg-primary;
-  @apply text-secondary;
-  @apply font-medium;
-  @apply select-none;
-  @apply overflow-x-hidden;
-
-  animation: fade 300ms forwards;
-  font-size: var(--body-font-size);
-  line-height: var(--body-line-height);
-  overflow: overlay;
-  -webkit-tap-highlight-color: transparent;
-  -webkit-touch-callout: none;
-}
-
-@keyframes fade {
-  0% {
-    opacity: 0;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-
-.fade-enter-active,
-.fade-leave-active,
-.page-enter-active,
-.page-leave-active,
-.layout-enter-active,
-.layout-leave-active {
-  @apply transition-opacity;
-}
-
-.fade-enter,
-.fade-leave-to,
-.page-enter,
-.page-leave-to,
-.layout-enter,
-.layout-leave-to {
-  @apply opacity-0;
-}
-
-.material-icons {
-  font-size: var(--body-line-height) !important;
-  width: var(--body-line-height);
-  overflow: hidden;
-}
-
-.svg-icons {
-  height: var(--body-line-height);
-  width: var(--body-line-height);
-}
-
-a {
-  @apply inline-flex;
-  @apply text-current;
-  @apply no-underline;
-  @apply outline-none;
-  @apply transition;
-
-  font-size: var(--body-font-size);
-  line-height: var(--body-line-height);
-
-  &.link {
-    @apply items-center;
-    @apply px-1 py-0.5;
-    @apply -mx-1 -my-0.5;
-    @apply text-accent;
-    @apply rounded;
-    @apply hover:text-accentDark;
-    @apply focus-visible:(ring ring-accent);
-  }
-}
-
-.tippy-popper {
-  .tooltip-theme {
-    @apply bg-tooltip;
-    @apply text-primary;
-    @apply font-semibold;
-    @apply py-1 px-2;
-    @apply truncate;
-    @apply shadow;
-
-    font-size: 88%;
-    line-height: var(--body-line-height);
-
-    kbd {
-      @apply inline-flex;
-      @apply font-sans;
-      @apply bg-gray-500;
-      @apply bg-opacity-45;
-      @apply text-primaryLight;
-      @apply rounded-sm;
-      @apply px-1;
-      @apply ml-1;
-      @apply truncate;
-    }
-  }
-
-  .popover-theme {
-    @apply bg-popover;
-    @apply text-secondary;
-    @apply p-2;
-    @apply shadow-lg;
-    @apply focus:outline-none;
-
-    font-size: var(--body-font-size);
-    line-height: var(--body-line-height);
-
-    .tippy-roundarrow svg {
-      @apply fill-popover;
-    }
-  }
-}
-
-[interactive] > div {
-  @apply flex;
-  @apply flex-1;
-  @apply h-full;
-}
-
-.tippy-content > div {
-  @apply flex flex-col;
-  @apply max-h-46;
-  @apply items-stretch;
-  @apply overflow-y-auto;
-
-  &::-webkit-scrollbar {
-    @apply hidden;
-  }
-}
-
-hr {
-  @apply border-b border-dividerLight;
-  @apply my-2;
-}
-
-.heading {
-  @apply font-bold;
-  @apply text-secondaryDark text-lg;
-}
-
-.input,
-.select,
-.textarea {
-  @apply flex flex-1;
-  @apply w-full;
-  @apply px-4 py-2;
-  @apply bg-transparent;
-  @apply rounded;
-  @apply text-secondaryDark;
-  @apply border border-divider;
-  @apply focus-visible:border-dividerDark;
-}
-
-input,
-select,
-textarea,
-button {
-  @apply focus:outline-none;
-  @apply truncate;
-  @apply transition;
-  @apply disabled:cursor-not-allowed;
-
-  font-size: var(--body-font-size);
-  line-height: var(--body-line-height);
-}
-
-.input[type="file"],
-.input[type="radio"],
-#installPWA {
-  @apply hidden;
-}
-
-.floating-input ~ label {
-  @apply font-medium;
-  @apply py-0.5;
-  @apply px-2;
-  @apply m-2;
-  @apply rounded;
-  @apply transition;
-  @apply absolute;
-  @apply origin-top-left;
-}
-
-.floating-input:focus-within ~ label,
-.floating-input:not(:placeholder-shown) ~ label {
-  @apply bg-transparent;
-  @apply transform;
-  @apply origin-top-left;
-  @apply scale-75;
-  @apply -translate-y-5;
-  @apply translate-x-1;
-}
-
-.floating-input:focus-within ~ label {
-  @apply text-secondaryDark;
-}
-
-pre.ace_editor {
-  @apply font-mono;
-  @apply resize-none;
-  @apply z-0;
-}
-
-.select {
-  @apply appearance-none;
-  @apply cursor-pointer;
-
-  &::-ms-expand {
-    @apply hidden;
-  }
-}
-
-.select-wrapper {
-  @apply flex flex-1;
-  @apply relative;
-
-  &::after {
-    @apply absolute;
-    @apply flex;
-    @apply inset-y-0;
-    @apply items-center;
-    @apply justify-center;
-    @apply pointer-events-none;
-    @apply font-icon;
-    @apply text-secondaryLight;
-    @apply right-3;
-
-    content: "\e313";
-  }
-}
-
-.search-wrapper {
-  @apply flex flex-1;
-  @apply relative;
-
-  &::after {
-    @apply absolute;
-    @apply flex;
-    @apply inset-y-0;
-    @apply items-center;
-    @apply justify-center;
-    @apply pointer-events-none;
-    @apply font-icon;
-    @apply text-secondaryLight;
-    @apply left-4;
-
-    content: "\e8b6";
-  }
-}
-
-input[type="checkbox"] {
-  @apply hidden;
-
-  &,
-  & + label {
-    @apply align-middle;
-    @apply cursor-pointer;
-
-    &::before {
-      @apply border-2 border-divider;
-      @apply rounded;
-      @apply inline-flex;
-      @apply items-center;
-      @apply justify-center;
-      @apply text-transparent;
-      @apply h-4;
-      @apply w-4;
-      @apply font-icon;
-
-      content: "\e876";
-      margin: 8px 8px 8px 0;
-    }
-  }
-
-  &:checked + label::before {
-    @apply bg-accent;
-    @apply border-accent;
-    @apply text-primary;
-  }
-}
-
-.info-response {
-  @apply text-pink-500;
-}
-
-.success-response {
-  @apply text-green-500;
-}
-
-.redir-response {
-  @apply text-yellow-500;
-}
-
-.cl-error-response {
-  @apply text-red-500;
-}
-
-.sv-error-response {
-  @apply text-red-600;
-}
-
-.missing-data-response {
-  @apply text-secondaryLight;
-}
-
-.toasted-container {
-  .toasted {
-    &.toasted-primary {
-      @apply bg-tooltip;
-      @apply text-primary;
-      @apply justify-start;
-      @apply shadow;
-      @apply font-medium;
-
-      font-size: var(--body-font-size);
-      line-height: var(--body-line-height);
-
-      .action {
-        @apply bg-gray-500;
-        @apply px-4;
-        @apply bg-opacity-10;
-        @apply ml-auto;
-        @apply last:ml-4;
-        @apply sm:ml-8;
-        @apply transition;
-        @apply rounded;
-        @apply text-current;
-        @apply normal-case;
-        @apply hover:(bg-opacity-20 no-underline);
-        @apply font-medium;
-
-        font-size: var(--body-font-size);
-        line-height: var(--body-line-height);
-      }
-    }
-
-    &.info {
-      @apply !bg-accent;
-    }
-
-    &.error {
-      @apply !bg-red-200;
-      @apply !text-red-800;
-    }
-
-    &.success {
-      @apply !bg-green-200;
-      @apply !text-green-800;
-    }
-  }
-}
-
-.smart-splitter .splitpanes__splitter {
-  @apply relative;
-  @apply bg-primaryLight;
-}
-
-.no-splitter .splitpanes__splitter {
-  @apply relative;
-  @apply bg-primaryLight;
-}
-
-.smart-splitter.splitpanes--vertical > .splitpanes__splitter {
-  @apply w-1;
-}
-
-.smart-splitter.splitpanes--horizontal > .splitpanes__splitter {
-  @apply h-1;
-}
-
-.no-splitter.splitpanes--vertical > .splitpanes__splitter {
-  @apply w-0.5;
-  @apply pointer-events-none;
-}
-
-.no-splitter.splitpanes--horizontal > .splitpanes__splitter {
-  @apply h-0.5;
-  @apply pointer-events-none;
-}
-
-.smart-splitter .splitpanes__splitter::before {
-  @apply absolute;
-  @apply inset-0;
-  @apply bg-dividerLight;
-  @apply opacity-0;
-  @apply z-30;
-  @apply transition;
-
-  content: "";
-}
-
-.smart-splitter .splitpanes__splitter::after {
-  @apply absolute;
-  @apply inset-0;
-  @apply z-30;
-  @apply transition;
-  @apply flex;
-  @apply items-center;
-  @apply justify-center;
-  @apply text-dividerDark;
-  @apply font-icon;
-}
-
-.smart-splitter.splitpanes--vertical > .splitpanes__splitter::after {
-  content: "\e5d4";
-}
-
-.smart-splitter.splitpanes--horizontal > .splitpanes__splitter::after {
-  content: "\e5d3";
-}
-
-.smart-splitter .splitpanes__splitter:hover::before {
-  @apply opacity-100;
-}
-
-.smart-splitter.splitpanes--vertical > .splitpanes__splitter::before {
-  @apply -left-0.5;
-  @apply -right-0.5;
-  @apply h-full;
-}
-
-.smart-splitter.splitpanes--horizontal > .splitpanes__splitter::before {
-  @apply -top-0.5;
-  @apply -bottom-0.5;
-  @apply w-full;
-}
-
-@media (max-width: 767px) {
-  main {
-    margin-bottom: env(safe-area-inset-bottom);
-  }
-}

assets/scss/themes.scss

@@ -1,374 +0,0 @@
-@mixin baseTheme {
-  --font-sans: "Inter", sans-serif;
-  --font-mono: "Roboto Mono", monospace;
-  --font-icon: "Material Icons";
-}
-
-@mixin darkTheme {
-  // Background color
-  --primary-color: theme("colors.true-gray.900");
-  // Light Background color
-  --primary-light-color: theme("colors.dark.600");
-  // Dark Background color
-  --primary-dark-color: theme("colors.true-gray.800");
-  // Text color
-  --secondary-color: theme("colors.true-gray.400");
-  // Light Text color
-  --secondary-light-color: theme("colors.true-gray.500");
-  // Dark Text color
-  --secondary-dark-color: theme("colors.true-gray.100");
-  // Border color
-  --divider-color: theme("colors.true-gray.800");
-  // Light Border color
-  --divider-light-color: theme("colors.dark.500");
-  // Dark Border color
-  --divider-dark-color: theme("colors.dark.300");
-  // Error color
-  --error-color: theme("colors.warm-gray.800");
-  // Tooltip color
-  --tooltip-color: theme("colors.true-gray.100");
-  // Popover color
-  --popover-color: theme("colors.dark.700");
-  // Editor theme
-  --editor-theme: "merbivore_soft";
-}
-
-@mixin lightTheme {
-  // Background color
-  --primary-color: theme("colors.white");
-  // Light Background color
-  --primary-light-color: theme("colors.true-gray.50");
-  // Dark Background color
-  --primary-dark-color: theme("colors.true-gray.100");
-  // Text color
-  --secondary-color: theme("colors.true-gray.500");
-  // Light Text color
-  --secondary-light-color: theme("colors.true-gray.400");
-  // Dark Text color
-  --secondary-dark-color: theme("colors.true-gray.900");
-  // Border color
-  --divider-color: theme("colors.true-gray.200");
-  // Light Border color
-  --divider-light-color: theme("colors.true-gray.100");
-  // Dark Border color
-  --divider-dark-color: theme("colors.true-gray.300");
-  // Error color
-  --error-color: theme("colors.yellow.100");
-  // Tooltip color
-  --tooltip-color: theme("colors.true-gray.800");
-  // Popover color
-  --popover-color: theme("colors.white");
-  // Editor theme
-  --editor-theme: "textmate";
-}
-
-@mixin blackTheme {
-  // Background color
-  --primary-color: theme("colors.dark.900");
-  // Light Background color
-  --primary-light-color: theme("colors.true-gray.900");
-  // Dark Background color
-  --primary-dark-color: theme("colors.dark.800");
-  // Text color
-  --secondary-color: theme("colors.true-gray.400");
-  // Light Text color
-  --secondary-light-color: theme("colors.true-gray.500");
-  // Dark Text color
-  --secondary-dark-color: theme("colors.true-gray.100");
-  // Border color
-  --divider-color: theme("colors.true-gray.800");
-  // Light Border color
-  --divider-light-color: theme("colors.dark.700");
-  // Dark Border color
-  --divider-dark-color: theme("colors.dark.300");
-  // Error color
-  --error-color: theme("colors.warm-gray.900");
-  // Tooltip color
-  --tooltip-color: theme("colors.true-gray.100");
-  // Popover color
-  --popover-color: theme("colors.dark.700");
-  // Editor theme
-  --editor-theme: "twilight";
-}
-
-@mixin greenTheme {
-  // Accent color
-  --accent-color: theme("colors.green.500");
-  // Light Accent color
-  --accent-light-color: theme("colors.green.400");
-  // Dark Accent color
-  --accent-dark-color: theme("colors.green.600");
-  // Light Contrast color
-  --accent-contrast-color: theme("colors.white");
-  // Gradient from
-  --gradient-from-color: theme("colors.green.200");
-  // Gradient via
-  --gradient-via-color: theme("colors.green.400");
-  // Gradient to
-  --gradient-to-color: theme("colors.green.600");
-}
-
-@mixin tealTheme {
-  // Accent color
-  --accent-color: theme("colors.teal.500");
-  // Light Accent color
-  --accent-light-color: theme("colors.teal.400");
-  // Dark Accent color
-  --accent-dark-color: theme("colors.teal.600");
-  // Light Contrast color
-  --accent-contrast-color: theme("colors.white");
-  // Gradient from
-  --gradient-from-color: theme("colors.teal.200");
-  // Gradient via
-  --gradient-via-color: theme("colors.teal.400");
-  // Gradient to
-  --gradient-to-color: theme("colors.teal.600");
-}
-
-@mixin blueTheme {
-  // Accent color
-  --accent-color: theme("colors.blue.500");
-  // Light Accent color
-  --accent-light-color: theme("colors.blue.400");
-  // Dark Accent color
-  --accent-dark-color: theme("colors.blue.600");
-  // Light Contrast color
-  --accent-contrast-color: theme("colors.white");
-  // Gradient from
-  --gradient-from-color: theme("colors.blue.200");
-  // Gradient via
-  --gradient-via-color: theme("colors.blue.400");
-  // Gradient to
-  --gradient-to-color: theme("colors.blue.600");
-}
-
-@mixin indigoTheme {
-  // Accent color
-  --accent-color: theme("colors.indigo.500");
-  // Light Accent color
-  --accent-light-color: theme("colors.indigo.400");
-  // Dark Accent color
-  --accent-dark-color: theme("colors.indigo.600");
-  // Light Contrast color
-  --accent-contrast-color: theme("colors.white");
-  // Gradient from
-  --gradient-from-color: theme("colors.indigo.200");
-  // Gradient via
-  --gradient-via-color: theme("colors.indigo.400");
-  // Gradient to
-  --gradient-to-color: theme("colors.indigo.600");
-}
-
-@mixin purpleTheme {
-  // Accent color
-  --accent-color: theme("colors.purple.500");
-  // Light Accent color
-  --accent-light-color: theme("colors.purple.400");
-  // Dark Accent color
-  --accent-dark-color: theme("colors.purple.600");
-  // Light Contrast color
-  --accent-contrast-color: theme("colors.white");
-  // Gradient from
-  --gradient-from-color: theme("colors.purple.200");
-  // Gradient via
-  --gradient-via-color: theme("colors.purple.400");
-  // Gradient to
-  --gradient-to-color: theme("colors.purple.600");
-}
-
-@mixin yellowTheme {
-  // Accent color
-  --accent-color: theme("colors.yellow.500");
-  // Light Accent color
-  --accent-light-color: theme("colors.yellow.400");
-  // Dark Accent color
-  --accent-dark-color: theme("colors.yellow.600");
-  // Light Contrast color
-  --accent-contrast-color: theme("colors.white");
-  // Gradient from
-  --gradient-from-color: theme("colors.yellow.200");
-  // Gradient via
-  --gradient-via-color: theme("colors.yellow.400");
-  // Gradient to
-  --gradient-to-color: theme("colors.yellow.600");
-}
-
-@mixin orangeTheme {
-  // Accent color
-  --accent-color: theme("colors.orange.500");
-  // Light Accent color
-  --accent-light-color: theme("colors.orange.400");
-  // Dark Accent color
-  --accent-dark-color: theme("colors.orange.600");
-  // Light Contrast color
-  --accent-contrast-color: theme("colors.white");
-  // Gradient from
-  --gradient-from-color: theme("colors.orange.200");
-  // Gradient via
-  --gradient-via-color: theme("colors.orange.400");
-  // Gradient to
-  --gradient-to-color: theme("colors.orange.600");
-}
-
-@mixin redTheme {
-  // Accent color
-  --accent-color: theme("colors.red.500");
-  // Light Accent color
-  --accent-light-color: theme("colors.red.400");
-  // Dark Accent color
-  --accent-dark-color: theme("colors.red.600");
-  // Light Contrast color
-  --accent-contrast-color: theme("colors.white");
-  // Gradient from
-  --gradient-from-color: theme("colors.red.200");
-  // Gradient via
-  --gradient-via-color: theme("colors.red.400");
-  // Gradient to
-  --gradient-to-color: theme("colors.red.600");
-}
-
-@mixin pinkTheme {
-  // Accent color
-  --accent-color: theme("colors.pink.500");
-  // Light Accent color
-  --accent-light-color: theme("colors.pink.400");
-  // Dark Accent color
-  --accent-dark-color: theme("colors.pink.600");
-  // Light Contrast color
-  --accent-contrast-color: theme("colors.white");
-  // Gradient from
-  --gradient-from-color: theme("colors.pink.200");
-  // Gradient via
-  --gradient-via-color: theme("colors.pink.400");
-  // Gradient to
-  --gradient-to-color: theme("colors.pink.600");
-}
-
-:root {
-  @include baseTheme;
-  @include darkTheme;
-  @include greenTheme;
-}
-
-:root.light {
-  @include lightTheme;
-}
-
-:root.dark {
-  @include darkTheme;
-}
-
-:root.black {
-  @include blackTheme;
-}
-
-:root[data-accent="blue"] {
-  @include blueTheme;
-}
-
-:root[data-accent="green"] {
-  @include greenTheme;
-}
-
-:root[data-accent="teal"] {
-  @include tealTheme;
-}
-
-:root[data-accent="indigo"] {
-  @include indigoTheme;
-}
-
-:root[data-accent="purple"] {
-  @include purpleTheme;
-}
-
-:root[data-accent="orange"] {
-  @include orangeTheme;
-}
-
-:root[data-accent="pink"] {
-  @include pinkTheme;
-}
-
-:root[data-accent="red"] {
-  @include redTheme;
-}
-
-:root[data-accent="yellow"] {
-  @include yellowTheme;
-}
-
-@mixin fontSmall {
-  // Font size
-  --body-font-size: 0.75rem;
-  // Line height
-  --body-line-height: 1rem;
-  // Upper primary sticky fold
-  --upper-primary-sticky-fold: 4.125rem;
-  // Upper secondary sticky fold
-  --upper-secondary-sticky-fold: 6.125rem;
-  // Upper tertiary sticky fold
-  --upper-tertiary-sticky-fold: 8.188rem;
-  // Lower primary sticky fold
-  --lower-primary-sticky-fold: 3rem;
-  // Lower secondary sticky fold
-  --lower-secondary-sticky-fold: 5rem;
-  // Sidebar primary sticky fold
-  --sidebar-primary-sticky-fold: 2rem;
-  // Sidebar secondary sticky fold
-  --sidebar-secondary-sticky-fold: 4rem;
-}
-
-@mixin fontMedium {
-  // Font size
-  --body-font-size: 0.875rem;
-  // Line height
-  --body-line-height: 1.25rem;
-  // Upper primary sticky fold
-  --upper-primary-sticky-fold: 4.375rem;
-  // Upper secondary sticky fold
-  --upper-secondary-sticky-fold: 6.625rem;
-  // Upper tertiary sticky fold
-  --upper-tertiary-sticky-fold: 8.813rem;
-  // Lower primary sticky fold
-  --lower-primary-sticky-fold: 3.25rem;
-  // Lower secondary sticky fold
-  --lower-secondary-sticky-fold: 5.5rem;
-  // Sidebar primary sticky fold
-  --sidebar-primary-sticky-fold: 2.25rem;
-  // Sidebar secondary sticky fold
-  --sidebar-secondary-sticky-fold: 4.5rem;
-}
-
-@mixin fontLarge {
-  // Font size
-  --body-font-size: 1rem;
-  // Line height
-  --body-line-height: 1.5rem;
-  // Upper primary sticky fold
-  --upper-primary-sticky-fold: 4.625rem;
-  // Upper secondary sticky fold
-  --upper-secondary-sticky-fold: 7.125rem;
-  // Upper tertiary sticky fold
-  --upper-tertiary-sticky-fold: 9.5rem;
-  // Lower primary sticky fold
-  --lower-primary-sticky-fold: 3.5rem;
-  // Lower secondary sticky fold
-  --lower-secondary-sticky-fold: 6rem;
-  // Sidebar primary sticky fold
-  --sidebar-primary-sticky-fold: 2.5rem;
-  // Sidebar secondary sticky fold
-  --sidebar-secondary-sticky-fold: 5rem;
-}
-
-:root[data-font-size="small"] {
-  @include fontSmall;
-}
-
-:root[data-font-size="medium"] {
-  @include fontMedium;
-}
-
-:root[data-font-size="large"] {
-  @include fontLarge;
-}

babel.config.js

@@ -1,26 +0,0 @@
-function isBabelLoader(caller) {
-  return caller && caller.name === "babel-loader"
-}
-
-module.exports = function (api) {
-  if (api.env("test") && !api.caller(isBabelLoader)) {
-    return {
-      plugins: [
-        "@babel/plugin-proposal-class-properties",
-        "@babel/plugin-proposal-nullish-coalescing-operator",
-        "@babel/plugin-proposal-optional-chaining",
-      ],
-      presets: [
-        [
-          "@babel/preset-env",
-          {
-            targets: {
-              node: "current",
-            },
-          },
-        ],
-      ],
-    }
-  }
-  return {}
-}

components/README.md

@@ -1,5 +0,0 @@
-# COMPONENTS
-
-The components directory contains your Vue.js Components.
-
-_Nuxt.js doesn't supercharge these components._

components/app/Announcement.vue

@@ -1,26 +0,0 @@
-<template>
-  <div class="bg-error flex justify-between">
-    <span
-      class="
-        flex
-        py-2
-        px-4
-        transition
-        relative
-        items-center
-        justify-center
-        group
-      "
-    >
-      <i class="mr-2 material-icons">info_outline</i>
-      <span class="text-secondaryDark">
-        <span class="md:hidden">
-          {{ $t("helpers.offline_short") }}
-        </span>
-        <span class="hidden md:inline">
-          {{ $t("helpers.offline") }}
-        </span>
-      </span>
-    </span>
-  </div>
-</template>

components/app/Footer.vue

@@ -1,164 +0,0 @@
-<template>
-  <div>
-    <div class="flex justify-between">
-      <div class="flex">
-        <ButtonSecondary
-          v-tippy="{ theme: 'tooltip' }"
-          :title="LEFT_SIDEBAR ? $t('hide.sidebar') : $t('show.sidebar')"
-          icon="menu_open"
-          :class="{ 'transform -rotate-180': !LEFT_SIDEBAR }"
-          @click.native="LEFT_SIDEBAR = !LEFT_SIDEBAR"
-        />
-        <ButtonSecondary
-          v-tippy="{ theme: 'tooltip' }"
-          :title="`${
-            ZEN_MODE ? $t('action.turn_off') : $t('action.turn_on')
-          } ${$t('layout.zen_mode')}`"
-          :icon="ZEN_MODE ? 'fullscreen_exit' : 'fullscreen'"
-          :class="{
-            '!text-accent !focus-visible:text-accentDark !hover:text-accentDark':
-              ZEN_MODE,
-          }"
-          @click.native="ZEN_MODE = !ZEN_MODE"
-        />
-      </div>
-      <div class="flex">
-        <span>
-          <tippy
-            ref="options"
-            interactive
-            trigger="click"
-            theme="popover"
-            arrow
-          >
-            <template #trigger>
-              <ButtonSecondary
-                icon="help_center"
-                class="rounded-none"
-                :label="$t('app.help')"
-              />
-            </template>
-            <div class="flex flex-col">
-              <SmartItem
-                :label="$t('app.documentation')"
-                to="https://docs.hoppscotch.io"
-                blank
-                @click.native="$refs.options.tippy().hide()"
-              />
-              <SmartItem
-                :label="$t('app.keyboard_shortcuts')"
-                @click.native="
-                  showShortcuts = true
-                  $refs.options.tippy().hide()
-                "
-              />
-              <SmartItem
-                :label="$t('app.whats_new')"
-                to="https://docs.hoppscotch.io/changelog"
-                blank
-                @click.native="$refs.options.tippy().hide()"
-              />
-              <SmartItem
-                :label="$t('app.chat_with_us')"
-                @click.native="
-                  chatWithUs()
-                  $refs.options.tippy().hide()
-                "
-              />
-              <hr />
-              <SmartItem
-                :label="$t('app.twitter')"
-                to="https://twitter.com/hoppscotch_io"
-                blank
-                @click.native="$refs.options.tippy().hide()"
-              />
-              <SmartItem
-                :label="$t('app.terms_and_privacy')"
-                to="https://docs.hoppscotch.io/privacy"
-                blank
-                @click.native="$refs.options.tippy().hide()"
-              />
-              <!-- <SmartItem :label="$t('app.status')" /> -->
-              <div class="flex opacity-50 py-2 px-4">
-                {{ `${$t("app.name")} ${$t("app.version")}` }}
-              </div>
-            </div>
-          </tippy>
-        </span>
-        <ButtonSecondary
-          v-tippy="{ theme: 'tooltip' }"
-          icon="keyboard"
-          :title="$t('app.shortcuts')"
-          @click.native="showShortcuts = true"
-        />
-        <ButtonSecondary
-          v-if="navigatorShare"
-          v-tippy="{ theme: 'tooltip' }"
-          icon="share"
-          :title="$t('request.share')"
-          @click.native="nativeShare()"
-        />
-        <ButtonSecondary
-          v-tippy="{ theme: 'tooltip' }"
-          :title="RIGHT_SIDEBAR ? $t('hide.sidebar') : $t('show.sidebar')"
-          icon="menu_open"
-          class="transform rotate-180"
-          :class="{ 'rotate-360': !RIGHT_SIDEBAR }"
-          @click.native="RIGHT_SIDEBAR = !RIGHT_SIDEBAR"
-        />
-      </div>
-    </div>
-    <AppShortcuts :show="showShortcuts" @close="showShortcuts = false" />
-  </div>
-</template>
-
-<script lang="ts">
-import { defineComponent, ref } from "@nuxtjs/composition-api"
-import { defineActionHandler } from "~/helpers/actions"
-import { showChat } from "~/helpers/support"
-import { useSetting } from "~/newstore/settings"
-
-export default defineComponent({
-  setup() {
-    const showShortcuts = ref(false)
-
-    defineActionHandler("flyouts.keybinds.toggle", () => {
-      showShortcuts.value = !showShortcuts.value
-    })
-
-    return {
-      LEFT_SIDEBAR: useSetting("LEFT_SIDEBAR"),
-      RIGHT_SIDEBAR: useSetting("RIGHT_SIDEBAR"),
-      ZEN_MODE: useSetting("ZEN_MODE"),
-
-      navigatorShare: !!navigator.share,
-
-      showShortcuts,
-    }
-  },
-  watch: {
-    ZEN_MODE() {
-      this.LEFT_SIDEBAR = !this.ZEN_MODE
-    },
-  },
-  methods: {
-    nativeShare() {
-      if (navigator.share) {
-        navigator
-          .share({
-            title: "Hoppscotch",
-            text: "Hoppscotch • Open source API development ecosystem - Helps you create requests faster, saving precious time on development.",
-            url: "https://hoppscotch.io",
-          })
-          .then(() => {})
-          .catch(console.error)
-      } else {
-        // fallback
-      }
-    },
-    chatWithUs() {
-      showChat()
-    },
-  },
-})
-</script>

components/app/GitHubStarButton.vue

@@ -1,36 +0,0 @@
-<template>
-  <transition name="fade" appear>
-    <GithubButton
-      title="Star Hoppscotch"
-      href="https://github.com/hoppscotch/hoppscotch"
-      :data-color-scheme="
-        $colorMode.value != 'light'
-          ? $colorMode.value == 'black'
-            ? 'dark'
-            : 'dark_dimmed'
-          : 'light'
-      "
-      :data-show-count="true"
-      data-text="Star"
-      aria-label="Star Hoppscotch on GitHub"
-      :data-size="size"
-    />
-  </transition>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-import GithubButton from "vue-github-button"
-
-export default defineComponent({
-  components: {
-    GithubButton,
-  },
-  props: {
-    size: {
-      type: String,
-      default: undefined,
-    },
-  },
-})
-</script>

components/app/Header.vue

@@ -1,137 +0,0 @@
-<template>
-  <div>
-    <header
-      class="flex space-x-2 flex-1 py-2 px-2 items-center justify-between"
-    >
-      <div class="space-x-2 inline-flex items-center">
-        <ButtonSecondary
-          class="tracking-wide !font-bold !text-secondaryDark"
-          label="HOPPSCOTCH"
-          to="/"
-        />
-        <AppGitHubStarButton class="mt-1.5 transition" />
-      </div>
-      <div class="space-x-2 inline-flex items-center">
-        <ButtonSecondary
-          id="installPWA"
-          v-tippy="{ theme: 'tooltip' }"
-          :title="$t('header.install_pwa')"
-          icon="download_for_offline"
-          class="rounded"
-          @click.native="showInstallPrompt()"
-        />
-        <ButtonSecondary
-          v-if="currentUser === null"
-          icon="filter_drama"
-          :label="$t('header.save_workspace')"
-          filled
-          class="hidden !font-semibold md:flex"
-          @click.native="showLogin = true"
-        />
-        <ButtonPrimary
-          v-if="currentUser === null"
-          :label="$t('header.login')"
-          @click.native="showLogin = true"
-        />
-        <span v-else class="pr-2">
-          <tippy ref="user" interactive trigger="click" theme="popover" arrow>
-            <template #trigger>
-              <ProfilePicture
-                v-if="currentUser.photoURL"
-                v-tippy="{
-                  theme: 'tooltip',
-                }"
-                :url="currentUser.photoURL"
-                :alt="currentUser.displayName"
-                :title="currentUser.displayName"
-                indicator
-                :indicator-styles="isOnLine ? 'bg-green-500' : 'bg-red-500'"
-              />
-              <ButtonSecondary
-                v-else
-                v-tippy="{ theme: 'tooltip' }"
-                :title="$t('header.account')"
-                class="rounded"
-                icon="account_circle"
-              />
-            </template>
-            <SmartItem
-              to="/settings"
-              icon="settings"
-              :label="$t('navigation.settings')"
-              @click.native="$refs.user.tippy().hide()"
-            />
-            <FirebaseLogout @confirm-logout="$refs.user.tippy().hide()" />
-          </tippy>
-        </span>
-      </div>
-    </header>
-    <AppAnnouncement v-if="!isOnLine" />
-    <FirebaseLogin :show="showLogin" @hide-modal="showLogin = false" />
-  </div>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-import intializePwa from "~/helpers/pwa"
-import { currentUser$ } from "~/helpers/fb/auth"
-import { getLocalConfig, setLocalConfig } from "~/newstore/localpersistence"
-import { useReadonlyStream } from "~/helpers/utils/composables"
-
-export default defineComponent({
-  setup() {
-    return {
-      currentUser: useReadonlyStream(currentUser$, null),
-    }
-  },
-  data() {
-    return {
-      // Once the PWA code is initialized, this holds a method
-      // that can be called to show the user the installation
-      // prompt.
-      showInstallPrompt: null,
-      showLogin: false,
-      isOnLine: navigator.onLine,
-    }
-  },
-  async mounted() {
-    window.addEventListener("online", () => {
-      this.isOnLine = true
-    })
-    window.addEventListener("offline", () => {
-      this.isOnLine = false
-    })
-
-    // Initializes the PWA code - checks if the app is installed,
-    // etc.
-    this.showInstallPrompt = await intializePwa()
-
-    const cookiesAllowed = getLocalConfig("cookiesAllowed") === "yes"
-    if (!cookiesAllowed) {
-      this.$toast.show(this.$t("app.we_use_cookies").toString(), {
-        icon: "cookie",
-        duration: 0,
-        action: [
-          {
-            text: this.$t("action.learn_more").toString(),
-            onClick: (_, toastObject) => {
-              setLocalConfig("cookiesAllowed", "yes")
-              toastObject.goAway(0)
-              window
-                .open("https://docs.hoppscotch.io/privacy", "_blank")
-                .focus()
-            },
-          },
-          {
-            text: this.$t("action.dismiss").toString(),
-            onClick: (_, toastObject) => {
-              setLocalConfig("cookiesAllowed", "yes")
-              toastObject.goAway(0)
-            },
-          },
-        ],
-      })
-    }
-  },
-})
-</script>

components/app/Logo.vue

@@ -1,33 +0,0 @@
-<template>
-  <svg
-    class="logo"
-    xmlns="http://www.w3.org/2000/svg"
-    xmlns:xlink="http://www.w3.org/1999/xlink"
-    aria-hidden="true"
-    role="img"
-    width="24"
-    height="24"
-    preserveAspectRatio="xMidYMid meet"
-    viewBox="0 0 24 24"
-  >
-    <path
-      d="M17 10.54C16.78 7.44 14.63 5 12 5s-4.78 2.44-5 5.54C4 11.23 2 12.5 2 14c0 2.21 4.5 4 10 4s10-1.79 10-4c0-1.5-2-2.77-5-3.46m-2.07 1.3c-1.9.21-3.96.21-5.86 0c-.04-.28-.07-.56-.07-.84c0-2.2 1.35-4 3-4s3 1.8 3 4c0 .28 0 .56-.07.84z"
-      fill="currentColor"
-    />
-  </svg>
-</template>
-
-<style scoped lang="scss">
-.logo {
-  animation: 200ms appear;
-}
-
-@keyframes appear {
-  0% {
-    @apply opacity-0;
-  }
-  100% {
-    @apply opacity-100;
-  }
-}
-</style>

components/app/Search.vue

@@ -1,123 +0,0 @@
-<template>
-  <SmartModal v-if="show" @close="$emit('hide-modal')">
-    <template #body>
-      <input
-        id="command"
-        v-model="search"
-        v-focus
-        type="text"
-        name="command"
-        :placeholder="$t('app.type_a_command_search')"
-        class="
-          bg-transparent
-          border-b border-dividerLight
-          text-secondaryDark text-base
-          leading-normal
-          px-4
-          pt-2
-          pb-6
-        "
-      />
-      <div
-        class="
-          divide-y divide-dividerLight
-          flex flex-col
-          space-y-4
-          flex-1
-          overflow-auto
-          hide-scrollbar
-        "
-      >
-        <div
-          v-for="(map, mapIndex) in filteredMappings"
-          :key="`map-${mapIndex}`"
-        >
-          <h5 class="my-2 text-secondaryLight py-2 px-4">
-            {{ $t(map.section) }}
-          </h5>
-          <div
-            v-for="(shortcut, shortcutIndex) in map.shortcuts"
-            :key="`map-${mapIndex}-shortcut-${shortcutIndex}`"
-            class="
-              rounded
-              cursor-pointer
-              flex
-              py-2
-              px-4
-              transition
-              items-center
-              group
-              hover:bg-primaryLight
-            "
-            @click="
-              runAction(shortcut.action)
-              hideModal()
-            "
-          >
-            <i class="mr-4 opacity-75 material-icons group-hover:opacity-100">
-              {{ shortcut.icon }}
-            </i>
-            <span class="flex flex-1 mr-4 group-hover:text-secondaryDark">
-              {{ $t(shortcut.label) }}
-            </span>
-            <span
-              v-for="(key, keyIndex) in shortcut.keys"
-              :key="`map-${mapIndex}-shortcut-${shortcutIndex}-key-${keyIndex}`"
-              class="shortcut-key"
-            >
-              {{ key }}
-            </span>
-          </div>
-        </div>
-      </div>
-    </template>
-  </SmartModal>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-import { invokeAction } from "~/helpers/actions"
-import { spotlight } from "~/helpers/shortcuts"
-
-export default defineComponent({
-  props: {
-    show: Boolean,
-  },
-  data() {
-    return {
-      search: "",
-      mappings: spotlight,
-    }
-  },
-  computed: {
-    filteredMappings() {
-      return this.mappings.filter((mapping) =>
-        mapping.shortcuts.some((shortcut) =>
-          shortcut.keywords.some((keyword) =>
-            keyword.toLowerCase().includes(this.search.toLowerCase())
-          )
-        )
-      )
-    },
-  },
-  methods: {
-    hideModal() {
-      this.$emit("hide-modal")
-    },
-    runAction(command) {
-      invokeAction(command, "path_from_invokeAction")
-    },
-  },
-})
-</script>
-
-<style lang="scss" scoped>
-.shortcut-key {
-  @apply bg-dividerLight;
-  @apply rounded;
-  @apply ml-2;
-  @apply py-1;
-  @apply px-2;
-  @apply inline-flex;
-}
-</style>

components/app/Section.vue

@@ -1,18 +0,0 @@
-<template>
-  <section :id="label.toLowerCase()" class="flex flex-col flex-1 relative">
-    <slot></slot>
-  </section>
-</template>
-
-<script lang="ts">
-import { defineComponent } from "@nuxtjs/composition-api"
-
-export default defineComponent({
-  props: {
-    label: {
-      type: String,
-      default: "Section",
-    },
-  },
-})
-</script>

components/app/Share.vue

@@ -1,125 +0,0 @@
-<template>
-  <SmartModal
-    v-if="show"
-    :title="$t('app.invite_your_friends')"
-    @close="$emit('hide-modal')"
-  >
-    <template #body>
-      <p class="text-secondaryLight mb-8 px-2">
-        {{ $t("app.invite_description") }}
-      </p>
-      <div class="flex flex-col space-y-2 px-2">
-        <div class="grid gap-4 grid-cols-3">
-          <a
-            v-for="(platform, index) in platforms"
-            :key="`platform-${index}`"
-            :href="platform.link"
-            target="_blank"
-            class="share-link"
-          >
-            <SmartIcon :name="platform.icon" class="h-6 w-6" />
-            <span class="mt-3">
-              {{ platform.name }}
-            </span>
-          </a>
-          <button class="share-link" @click="copyAppLink">
-            <span class="font-icon h-6 text-xl w-6">{{ copyIcon }}</span>
-            <span class="mt-3">
-              {{ $t("app.copy") }}
-            </span>
-          </button>
-        </div>
-      </div>
-    </template>
-  </SmartModal>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-import { copyToClipboard } from "~/helpers/utils/clipboard"
-
-export default defineComponent({
-  props: {
-    show: Boolean,
-  },
-  data() {
-    const url = "https://hoppscotch.io"
-    const text = "Hoppscotch - Open source API development ecosystem."
-    const description =
-      "Helps you create requests faster, saving precious time on development."
-    const subject =
-      "Checkout Hoppscotch - an open source API development ecosystem"
-    const summary = `Hi there!%0D%0A%0D%0AI thought you’ll like this new platform that I joined called Hoppscotch - https://hoppscotch.io.%0D%0AIt is a simple and intuitive interface for creating and managing your APIs. You can build, test, document, and share your APIs.%0D%0A%0D%0AThe best part about Hoppscotch is that it is open source and free to get started.%0D%0A%0D%0A`
-    const twitter = "hoppscotch_io"
-
-    return {
-      url: "https://hoppscotch.io",
-      copyIcon: "content_copy",
-      platforms: [
-        {
-          name: "Email",
-          icon: "email",
-          link: `mailto:?subject=${subject}&body=${summary}`,
-        },
-        {
-          name: "Twitter",
-          icon: "twitter",
-          link: `https://twitter.com/intent/tweet?text=${text} ${description}&url=${url}&via=${twitter}`,
-        },
-        {
-          name: "Facebook",
-          icon: "facebook",
-          link: `https://www.facebook.com/sharer/sharer.php?u=${url}`,
-        },
-        {
-          name: "Reddit",
-          icon: "reddit",
-          link: `https://www.reddit.com/submit?url=${url}&title=${text}`,
-        },
-        {
-          name: "LinkedIn",
-          icon: "linkedin",
-          link: `https://www.linkedin.com/sharing/share-offsite/?url=${url}`,
-        },
-      ],
-    }
-  },
-  methods: {
-    copyAppLink() {
-      copyToClipboard(this.url)
-      this.copyIcon = "done"
-      this.$toast.success(this.$t("state.copied_to_clipboard").toString(), {
-        icon: "content_paste",
-      })
-      setTimeout(() => (this.copyIcon = "content_copy"), 1000)
-    },
-    hideModal() {
-      this.$emit("hide-modal")
-    },
-  },
-})
-</script>
-
-<style lang="scss" scoped>
-.share-link {
-  @apply border border-dividerLight;
-  @apply rounded;
-  @apply flex-col flex;
-  @apply p-4;
-  @apply items-center;
-  @apply justify-center;
-  @apply hover:(bg-primaryLight text-secondaryDark);
-  @apply focus:outline-none;
-  @apply focus-visible:border-divider;
-
-  svg {
-    @apply opacity-80;
-  }
-
-  &:hover {
-    svg {
-      @apply opacity-100;
-    }
-  }
-}
-</style>

components/app/Shortcuts.vue

@@ -1,120 +0,0 @@
-<template>
-  <AppSlideOver :show="show" @close="close()">
-    <template #content>
-      <div
-        class="
-          bg-primary
-          border-b border-dividerLight
-          flex
-          p-2
-          top-0
-          z-10
-          items-center
-          sticky
-          justify-between
-        "
-      >
-        <h3 class="ml-4 heading">{{ $t("app.shortcuts") }}</h3>
-        <div class="flex">
-          <ButtonSecondary
-            icon="close"
-            class="rounded"
-            @click.native="close()"
-          />
-        </div>
-      </div>
-      <div class="bg-primary border-b border-dividerLight">
-        <div class="flex flex-col my-4 mx-6 search-wrapper">
-          <input
-            v-model="filterText"
-            type="search"
-            class="
-              bg-primaryLight
-              border border-dividerLight
-              rounded
-              flex
-              w-full
-              py-2
-              pr-2
-              pl-8
-              focus-visible:border-divider
-            "
-            :placeholder="$t('action.search')"
-          />
-        </div>
-      </div>
-      <div
-        class="
-          divide-y divide-dividerLight
-          flex flex-col flex-1
-          overflow-auto
-          hide-scrollbar
-        "
-      >
-        <div
-          v-for="(map, mapIndex) in mappings"
-          :key="`map-${mapIndex}`"
-          class="space-y-4 py-4 px-6"
-        >
-          <h1 class="font-semibold text-secondaryDark">
-            {{ $t(map.section) }}
-          </h1>
-          <div
-            v-for="(shortcut, shortcutIndex) in map.shortcuts"
-            :key="`map-${mapIndex}-shortcut-${shortcutIndex}`"
-            class="flex items-center"
-          >
-            <span class="flex flex-1 mr-4">
-              {{ $t(shortcut.label) }}
-            </span>
-            <span
-              v-for="(key, keyIndex) in shortcut.keys"
-              :key="`map-${mapIndex}-shortcut-${shortcutIndex}-key-${keyIndex}`"
-              class="shortcut-key"
-            >
-              {{ key }}
-            </span>
-          </div>
-        </div>
-      </div>
-    </template>
-  </AppSlideOver>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-import shortcuts from "~/helpers/shortcuts"
-
-export default defineComponent({
-  props: {
-    show: Boolean,
-  },
-  data() {
-    return {
-      filterText: "",
-      mappings: shortcuts,
-    }
-  },
-  watch: {
-    $route() {
-      this.$emit("close")
-    },
-  },
-  methods: {
-    close() {
-      this.$emit("close")
-    },
-  },
-})
-</script>
-
-<style lang="scss" scoped>
-.shortcut-key {
-  @apply bg-dividerLight;
-  @apply rounded;
-  @apply ml-2;
-  @apply py-1;
-  @apply px-2;
-  @apply inline-flex;
-}
-</style>

components/app/Sidenav.vue

@@ -1,178 +0,0 @@
-<template>
-  <aside class="flex h-full justify-between md:flex-col">
-    <nav class="flex flex-nowrap md:flex-col">
-      <NuxtLink
-        v-for="(navigation, index) in primaryNavigation"
-        :key="`navigation-${index}`"
-        :to="localePath(navigation.target)"
-        class="nav-link"
-        tabindex="0"
-      >
-        <i v-if="navigation.icon" class="material-icons">
-          {{ navigation.icon }}
-        </i>
-        <div v-if="navigation.svg" class="h-4 w-4">
-          <SmartIcon :name="navigation.svg" class="svg-icons" />
-        </div>
-        <span v-if="LEFT_SIDEBAR">{{ navigation.title }}</span>
-      </NuxtLink>
-    </nav>
-    <!-- <nav
-      class="
-        flex flex-nowrap
-        p-4
-        items-center
-        justify-center
-        md:(flex-col
-        space-x-0 space-y-2)
-        "
-    >
-      <ButtonSecondary
-        v-tippy="{ theme: 'tooltip', placement: 'top' }"
-        :title="`${$t('app.search')} <kbd>/</kbd>`"
-        icon="search"
-        class="rounded"
-        @click.native="showSearch = true"
-      />
-      <ButtonSecondary
-        v-tippy="{ theme: 'tooltip', placement: 'top' }"
-        :title="$t('app.invite')"
-        icon="person_add_alt"
-        class="rounded"
-        @click.native="showShare = true"
-      />
-      <ButtonSecondary
-        v-tippy="{ theme: 'tooltip', placement: 'top' }"
-        :title="`${$t('support.title')} <kbd>?</kbd>`"
-        icon="support"
-        class="rounded"
-        @click.native="showSupport = true"
-      />
-    </nav> -->
-    <!-- <AppSearch :show="showSearch" @hide-modal="showSearch = false" />
-    <AppSupport :show="showSupport" @hide-modal="showSupport = false" />
-    <AppShare :show="showShare" @hide-modal="showShare = false" /> -->
-  </aside>
-</template>
-
-<script lang="ts">
-import { defineComponent } from "@nuxtjs/composition-api"
-import { useSetting } from "~/newstore/settings"
-// import { defineActionHandler } from "~/helpers/actions"
-
-export default defineComponent({
-  setup() {
-    // const showSearch = ref(false)
-    // const showSupport = ref(false)
-    // const showShare = ref(false)
-
-    // defineActionHandler("modals.search.toggle", () => {
-    //   showSearch.value = !showSearch.value
-    // })
-
-    // defineActionHandler("modals.support.toggle", () => {
-    //   showSupport.value = !showSupport.value
-    // })
-
-    // defineActionHandler("modals.share.toggle", () => {
-    //   showShare.value = !showShare.value
-    // })
-
-    return {
-      //     showSearch,
-      //     showSupport,
-      //     showShare,
-      LEFT_SIDEBAR: useSetting("LEFT_SIDEBAR"),
-    }
-  },
-  data() {
-    return {
-      primaryNavigation: [
-        {
-          target: "index",
-          icon: "settings_ethernet",
-          title: this.$t("navigation.rest"),
-        },
-        {
-          target: "graphql",
-          svg: "graphql",
-          title: this.$t("navigation.graphql"),
-        },
-        {
-          target: "realtime",
-          icon: "language",
-          title: this.$t("navigation.realtime"),
-        },
-        {
-          target: "documentation",
-          icon: "book",
-          title: this.$t("navigation.doc"),
-        },
-        {
-          target: "settings",
-          icon: "settings",
-          title: this.$t("navigation.settings"),
-        },
-      ],
-    }
-  },
-})
-</script>
-
-<style scoped lang="scss">
-.nav-link {
-  @apply relative;
-  @apply p-4;
-  @apply flex flex-col flex-1;
-  @apply items-center;
-  @apply justify-center;
-  @apply hover:(bg-primaryDark text-secondaryDark);
-  @apply focus-visible:text-secondaryDark;
-
-  &::after {
-    @apply absolute;
-    @apply inset-x-0;
-    @apply md:inset-x-auto;
-    @apply md:inset-y-0;
-    @apply bottom-0;
-    @apply md:bottom-auto;
-    @apply md:left-0;
-    @apply z-2;
-    @apply h-0.5;
-    @apply md:h-full;
-    @apply w-full;
-    @apply md:w-0.5;
-
-    content: "";
-  }
-
-  &:focus::after {
-    @apply bg-divider;
-  }
-
-  .material-icons,
-  .svg-icons {
-    @apply opacity-75;
-  }
-
-  span {
-    @apply mt-2;
-    @apply font-font-medium;
-  }
-
-  &.exact-active-link {
-    @apply text-secondaryDark;
-    @apply bg-primaryLight;
-    @apply hover:text-secondaryDark;
-
-    .material-icons,
-    .svg-icons {
-      @apply opacity-100;
-    }
-
-    &::after {
-      @apply bg-accent;
-    }
-  }
-}
-</style>

components/app/SlideOver.vue

@@ -1,69 +0,0 @@
-<template>
-  <div>
-    <transition v-if="show" name="fade" appear>
-      <div class="inset-0 transition-opacity z-20 fixed" @keydown.esc="close()">
-        <div
-          class="bg-primaryDark opacity-90 inset-0 absolute"
-          tabindex="0"
-          @click="close()"
-        ></div>
-      </div>
-    </transition>
-    <aside
-      class="
-        bg-primary
-        flex flex-col
-        h-full
-        max-w-full
-        transform
-        transition
-        top-0
-        ease-in-out
-        right-0
-        w-96
-        z-30
-        duration-300
-        fixed
-        overflow-auto
-      "
-      :class="show ? 'shadow-xl translate-x-0' : 'translate-x-full'"
-    >
-      <slot name="content"></slot>
-    </aside>
-  </div>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-
-export default defineComponent({
-  props: {
-    show: {
-      type: Boolean,
-      required: true,
-      default: false,
-    },
-  },
-  watch: {
-    show: {
-      immediate: true,
-      handler(show) {
-        if (process.client) {
-          if (show) document.body.style.setProperty("overflow", "hidden")
-          else document.body.style.removeProperty("overflow")
-        }
-      },
-    },
-  },
-  mounted() {
-    document.addEventListener("keydown", (e) => {
-      if (e.keyCode === 27 && this.show) this.close()
-    })
-  },
-  methods: {
-    close() {
-      this.$emit("close")
-    },
-  },
-})
-</script>

components/app/Support.vue

@@ -1,97 +0,0 @@
-<template>
-  <SmartModal
-    v-if="show"
-    :title="$t('support.title')"
-    @close="$emit('hide-modal')"
-  >
-    <template #body>
-      <div class="flex flex-col space-y-2">
-        <SmartItem
-          icon="menu_book"
-          :label="$t('app.documentation')"
-          to="https://docs.hoppscotch.io"
-          :description="$t('support.documentation')"
-          info-icon="chevron_right"
-          active
-          blank
-          @click.native="hideModal()"
-        />
-        <SmartItem
-          icon="keyboard"
-          :label="$t('app.keyboard_shortcuts')"
-          :description="$t('support.shortcuts')"
-          info-icon="chevron_right"
-          active
-          @click.native="
-            showShortcuts()
-            hideModal()
-          "
-        />
-        <SmartItem
-          icon="auto_awesome"
-          :label="$t('app.whats_new')"
-          to="https://docs.hoppscotch.io/changelog"
-          :description="$t('support.changelog')"
-          info-icon="chevron_right"
-          active
-          blank
-          @click.native="hideModal()"
-        />
-        <SmartItem
-          icon="contact_support"
-          :label="$t('app.chat_with_us')"
-          :description="$t('support.chat')"
-          info-icon="chevron_right"
-          active
-          @click.native="
-            chatWithUs()
-            hideModal()
-          "
-        />
-        <SmartItem
-          svg="discord"
-          :label="$t('app.join_discord_community')"
-          to="https://hoppscotch.io/discord"
-          blank
-          :description="$t('support.community')"
-          info-icon="chevron_right"
-          active
-          @click.native="hideModal()"
-        />
-        <SmartItem
-          svg="twitter"
-          :label="$t('app.twitter')"
-          to="https://twitter.com/hoppscotch_io"
-          blank
-          :description="$t('support.twitter')"
-          info-icon="chevron_right"
-          active
-          @click.native="hideModal()"
-        />
-      </div>
-    </template>
-  </SmartModal>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-import { invokeAction } from "~/helpers/actions"
-import { showChat } from "~/helpers/support"
-
-export default defineComponent({
-  props: {
-    show: Boolean,
-  },
-  methods: {
-    chatWithUs() {
-      showChat()
-    },
-    showShortcuts() {
-      invokeAction("flyouts.keybinds.toggle")
-    },
-    hideModal() {
-      this.$emit("hide-modal")
-    },
-  },
-})
-</script>

components/button/Primary.vue

@@ -1,147 +0,0 @@
-<template>
-  <SmartLink
-    :to="`${/^\/(?!\/).*$/.test(to) ? localePath(to) : to}`"
-    :exact="exact"
-    :blank="blank"
-    class="
-      font-bold
-      py-2
-      inline-flex
-      items-center
-      justify-center
-      focus:outline-none
-      focus-visible:bg-accentDark
-    "
-    :class="[
-      color
-        ? `text-${color}-800 bg-${color}-200 hover:(text-${color}-900 bg-${color}-300) focus-visible:(text-${color}-900 bg-${color}-300)`
-        : `text-accentContrast bg-accent hover:bg-accentDark focus-visible:bg-accentDark`,
-      label ? 'px-4' : 'px-2',
-      rounded ? 'rounded-full' : 'rounded',
-      { 'opacity-75 cursor-not-allowed': disabled },
-      { 'pointer-events-none': loading },
-      { 'px-6 py-4 text-lg': large },
-      { 'shadow-lg hover:shadow-xl': shadow },
-      {
-        'text-white bg-gradient-to-tr from-gradientFrom via-gradientVia to-gradientTo':
-          gradient,
-      },
-      {
-        'border border-accent hover:border-accentDark focus-visible:border-accentDark':
-          outline,
-      },
-    ]"
-    :disabled="disabled"
-    :tabindex="loading ? '-1' : '0'"
-  >
-    <span
-      v-if="!loading"
-      class="inline-flex items-center justify-center whitespace-nowrap"
-      :class="{ 'flex-row-reverse': reverse }"
-    >
-      <i
-        v-if="icon"
-        class="material-icons"
-        :class="[
-          { '!text-2xl': large },
-          label ? (reverse ? 'ml-2' : 'mr-2') : '',
-        ]"
-      >
-        {{ icon }}
-      </i>
-      <SmartIcon
-        v-if="svg"
-        :name="svg"
-        class="svg-icons"
-        :class="[
-          { '!h-6 !w-6': large },
-          label ? (reverse ? 'ml-2' : 'mr-2') : '',
-        ]"
-      />
-      {{ label }}
-      <div v-if="shortcut.length" class="ml-2">
-        <kbd
-          v-for="(key, index) in shortcut"
-          :key="`key-${index}`"
-          class="bg-accentLight rounded ml-1 px-1 inline-flex"
-        >
-          {{ key }}
-        </kbd>
-      </div>
-    </span>
-    <SmartSpinner v-else />
-  </SmartLink>
-</template>
-
-<script lang="ts">
-import { defineComponent } from "@nuxtjs/composition-api"
-
-export default defineComponent({
-  props: {
-    to: {
-      type: String,
-      default: "",
-    },
-    exact: {
-      type: Boolean,
-      default: true,
-    },
-    blank: {
-      type: Boolean,
-      default: false,
-    },
-    label: {
-      type: String,
-      default: "",
-    },
-    icon: {
-      type: String,
-      default: "",
-    },
-    svg: {
-      type: String,
-      default: "",
-    },
-    color: {
-      type: String,
-      default: "",
-    },
-    disabled: {
-      type: Boolean,
-      default: false,
-    },
-    loading: {
-      type: Boolean,
-      default: false,
-    },
-    large: {
-      type: Boolean,
-      default: false,
-    },
-    shadow: {
-      type: Boolean,
-      default: false,
-    },
-    reverse: {
-      type: Boolean,
-      default: false,
-    },
-    rounded: {
-      type: Boolean,
-      default: false,
-    },
-    gradient: {
-      type: Boolean,
-      default: false,
-    },
-    outline: {
-      type: Boolean,
-      default: false,
-    },
-    shortcut: {
-      type: Array,
-      default: () => [],
-    },
-  },
-})
-</script>

components/button/Secondary.vue

@@ -1,137 +0,0 @@
-<template>
-  <SmartLink
-    :to="`${/^\/(?!\/).*$/.test(to) ? localePath(to) : to}`"
-    :exact="exact"
-    :blank="blank"
-    class="
-      font-medium
-      py-2
-      inline-flex
-      items-center
-      justify-center
-      whitespace-nowrap
-      hover:bg-primaryDark
-      focus:outline-none
-      focus-visible:bg-primaryDark
-    "
-    :class="[
-      color
-        ? `text-${color}-500 hover:(text-${color}-600 text-${color}-600)`
-        : 'text-secondary hover:text-secondaryDark focus-visible:text-secondaryDark',
-      label ? 'rounded px-4' : 'px-2',
-      { 'rounded-full': rounded },
-      { 'opacity-75 cursor-not-allowed': disabled },
-      { 'flex-row-reverse': reverse },
-      { 'px-6 py-4 text-lg': large },
-      {
-        'border border-divider hover:border-dividerDark focus-visible:border-dividerDark':
-          outline,
-      },
-      { 'bg-primaryDark': filled },
-    ]"
-    :disabled="disabled"
-    tabindex="0"
-  >
-    <i
-      v-if="icon"
-      class="material-icons"
-      :class="[
-        { '!text-2xl': large },
-        label ? (reverse ? 'ml-2' : 'mr-2') : '',
-      ]"
-    >
-      {{ icon }}
-    </i>
-    <SmartIcon
-      v-if="svg"
-      :name="svg"
-      class="svg-icons"
-      :class="[
-        { '!h-6 !w-6': large },
-        label ? (reverse ? 'ml-2' : 'mr-2') : '',
-      ]"
-    />
-    {{ label }}
-    <div v-if="shortcut.length" class="ml-2">
-      <kbd
-        v-for="(key, index) in shortcut"
-        :key="`key-${index}`"
-        class="
-          bg-dividerLight
-          rounded
-          text-secondaryLight
-          ml-1
-          px-1
-          inline-flex
-        "
-      >
-        {{ key }}
-      </kbd>
-    </div>
-  </SmartLink>
-</template>
-
-<script lang="ts">
-import { defineComponent } from "@nuxtjs/composition-api"
-
-export default defineComponent({
-  props: {
-    to: {
-      type: String,
-      default: "",
-    },
-    exact: {
-      type: Boolean,
-      default: true,
-    },
-    blank: {
-      type: Boolean,
-      default: false,
-    },
-    label: {
-      type: String,
-      default: "",
-    },
-    icon: {
-      type: String,
-      default: "",
-    },
-    svg: {
-      type: String,
-      default: "",
-    },
-    color: {
-      type: String,
-      default: "",
-    },
-    disabled: {
-      type: Boolean,
-      default: false,
-    },
-    reverse: {
-      type: Boolean,
-      default: false,
-    },
-    rounded: {
-      type: Boolean,
-      default: false,
-    },
-    large: {
-      type: Boolean,
-      default: false,
-    },
-    outline: {
-      type: Boolean,
-      default: false,
-    },
-    shortcut: {
-      type: Array,
-      default: () => [],
-    },
-    filled: {
-      type: Boolean,
-      default: false,
-    },
-  },
-})
-</script>

components/collections/Add.vue

@@ -1,63 +0,0 @@
-<template>
-  <SmartModal v-if="show" :title="$t('collection.new')" @close="hideModal">
-    <template #body>
-      <div class="flex flex-col px-2">
-        <input
-          id="selectLabelAdd"
-          v-model="name"
-          v-focus
-          class="input floating-input"
-          placeholder=" "
-          type="text"
-          @keyup.enter="addNewCollection"
-        />
-        <label for="selectLabelAdd">
-          {{ $t("action.label") }}
-        </label>
-      </div>
-    </template>
-    <template #footer>
-      <span>
-        <ButtonPrimary
-          :label="$t('action.save')"
-          @click.native="addNewCollection"
-        />
-        <ButtonSecondary
-          :label="$t('action.cancel')"
-          @click.native="hideModal"
-        />
-      </span>
-    </template>
-  </SmartModal>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-
-export default defineComponent({
-  props: {
-    show: Boolean,
-  },
-  data() {
-    return {
-      name: null,
-    }
-  },
-  methods: {
-    addNewCollection() {
-      if (!this.name) {
-        this.$toast.error(this.$t("collection.invalid_name"), {
-          icon: "error_outline",
-        })
-        return
-      }
-      this.$emit("submit", this.name)
-      this.hideModal()
-    },
-    hideModal() {
-      this.name = null
-      this.$emit("hide-modal")
-    },
-  },
-})
-</script>

components/collections/AddFolder.vue

@@ -1,71 +0,0 @@
-<template>
-  <SmartModal
-    v-if="show"
-    :title="$t('folder.new')"
-    @close="$emit('hide-modal')"
-  >
-    <template #body>
-      <div class="flex flex-col px-2">
-        <input
-          id="selectLabelAddFolder"
-          v-model="name"
-          v-focus
-          class="input floating-input"
-          placeholder=" "
-          type="text"
-          @keyup.enter="addFolder"
-        />
-        <label for="selectLabelAddFolder">
-          {{ $t("action.label") }}
-        </label>
-      </div>
-    </template>
-    <template #footer>
-      <span>
-        <ButtonPrimary :label="$t('action.save')" @click.native="addFolder" />
-        <ButtonSecondary
-          :label="$t('action.cancel')"
-          @click.native="hideModal"
-        />
-      </span>
-    </template>
-  </SmartModal>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-
-export default defineComponent({
-  props: {
-    show: Boolean,
-    folder: { type: Object, default: () => {} },
-    folderPath: { type: String, default: null },
-    collectionIndex: { type: Number, default: null },
-  },
-  data() {
-    return {
-      name: null,
-    }
-  },
-  methods: {
-    addFolder() {
-      if (!this.name) {
-        this.$toast.error(this.$t("folder.invalid_name"), {
-          icon: "error_outline",
-        })
-        return
-      }
-      this.$emit("add-folder", {
-        name: this.name,
-        folder: this.folder,
-        path: this.folderPath || `${this.collectionIndex}`,
-      })
-      this.hideModal()
-    },
-    hideModal() {
-      this.name = null
-      this.$emit("hide-modal")
-    },
-  },
-})
-</script>

components/collections/ChooseType.vue

@@ -1,110 +0,0 @@
-<template>
-  <div v-if="show">
-    <SmartTabs :id="'collections_tab'" @tab-changed="updateCollectionsType">
-      <SmartTab
-        :id="'my-collections'"
-        :label="$t('collection.my_collections')"
-        :selected="true"
-      />
-      <SmartTab
-        v-if="currentUser && currentUser.eaInvited && !doc"
-        :id="'team-collections'"
-        :label="$t('collection.team_collections')"
-      >
-        <SmartIntersection @intersecting="onTeamSelectIntersect">
-          <div class="select-wrapper">
-            <select
-              id="team"
-              type="text"
-              autofocus
-              class="
-                bg-transparent
-                border-b border-transparent
-                cursor-pointer
-                flex
-                font-medium
-                w-full
-                py-2
-                px-4
-                appearance-none
-                hover:bg-primaryDark
-              "
-              @change="updateSelectedTeam(myTeams[$event.target.value])"
-            >
-              <option
-                :key="undefined"
-                :value="undefined"
-                hidden
-                disabled
-                selected
-              >
-                {{ $t("collection.select_team") }}
-              </option>
-              <option
-                v-for="(team, index) in myTeams"
-                :key="`team-${index}`"
-                :value="index"
-              >
-                {{ team.name }}
-              </option>
-            </select>
-          </div>
-        </SmartIntersection>
-      </SmartTab>
-    </SmartTabs>
-  </div>
-</template>
-
-<script lang="ts">
-import { defineComponent } from "@nuxtjs/composition-api"
-import gql from "graphql-tag"
-import { currentUserInfo$ } from "~/helpers/teams/BackendUserInfo"
-import { useReadonlyStream } from "~/helpers/utils/composables"
-
-export default defineComponent({
-  props: {
-    doc: Boolean,
-    show: Boolean,
-  },
-  setup() {
-    return {
-      currentUser: useReadonlyStream(currentUserInfo$, null),
-    }
-  },
-  data() {
-    return {
-      skipTeamsFetching: true,
-    }
-  },
-  apollo: {
-    myTeams: {
-      query: gql`
-        query GetMyTeams {
-          myTeams {
-            id
-            name
-            myRole
-          }
-        }
-      `,
-      pollInterval: 10000,
-      skip() {
-        return this.skipTeamsFetching
-      },
-    },
-  },
-  methods: {
-    onTeamSelectIntersect() {
-      // Load team data as soon as intersection
-      this.$apollo.queries.myTeams.refetch()
-      this.skipTeamsFetching = false
-    },
-    updateCollectionsType(tabID: string) {
-      this.$emit("update-collection-type", tabID)
-    },
-    updateSelectedTeam(team: any) {
-      this.$emit("update-selected-team", team)
-    },
-  },
-})
-</script>

components/collections/Edit.vue

@@ -1,64 +0,0 @@
-<template>
-  <SmartModal v-if="show" :title="$t('collection.edit')" @close="hideModal">
-    <template #body>
-      <div class="flex flex-col px-2">
-        <input
-          id="selectLabelEdit"
-          v-model="name"
-          v-focus
-          class="input floating-input"
-          placeholder=" "
-          type="text"
-          @keyup.enter="saveCollection"
-        />
-        <label for="selectLabelEdit">
-          {{ $t("action.label") }}
-        </label>
-      </div>
-    </template>
-    <template #footer>
-      <span>
-        <ButtonPrimary
-          :label="$t('action.save')"
-          @click.native="saveCollection"
-        />
-        <ButtonSecondary
-          :label="$t('action.cancel')"
-          @click.native="hideModal"
-        />
-      </span>
-    </template>
-  </SmartModal>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-
-export default defineComponent({
-  props: {
-    show: Boolean,
-    placeholderCollName: { type: String, default: null },
-  },
-  data() {
-    return {
-      name: null,
-    }
-  },
-  methods: {
-    saveCollection() {
-      if (!this.name) {
-        this.$toast.error(this.$t("collection.invalid_name"), {
-          icon: "error_outline",
-        })
-        return
-      }
-      this.$emit("submit", this.name)
-      this.hideModal()
-    },
-    hideModal() {
-      this.name = null
-      this.$emit("hide-modal")
-    },
-  },
-})
-</script>

components/collections/EditFolder.vue

@@ -1,64 +0,0 @@
-<template>
-  <SmartModal
-    v-if="show"
-    :title="$t('folder.edit')"
-    @close="$emit('hide-modal')"
-  >
-    <template #body>
-      <div class="flex flex-col px-2">
-        <input
-          id="selectLabelEditFolder"
-          v-model="name"
-          v-focus
-          class="input floating-input"
-          placeholder=" "
-          type="text"
-          @keyup.enter="editFolder"
-        />
-        <label for="selectLabelEditFolder">
-          {{ $t("action.label") }}
-        </label>
-      </div>
-    </template>
-    <template #footer>
-      <span>
-        <ButtonPrimary :label="$t('action.save')" @click.native="editFolder" />
-        <ButtonSecondary
-          :label="$t('action.cancel')"
-          @click.native="hideModal"
-        />
-      </span>
-    </template>
-  </SmartModal>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-
-export default defineComponent({
-  props: {
-    show: Boolean,
-  },
-  data() {
-    return {
-      name: null,
-    }
-  },
-  methods: {
-    editFolder() {
-      if (!this.name) {
-        this.$toast.error(this.$t("folder.invalid_name"), {
-          icon: "error_outline",
-        })
-        return
-      }
-      this.$emit("submit", this.name)
-      this.hideModal()
-    },
-    hideModal() {
-      this.name = null
-      this.$emit("hide-modal")
-    },
-  },
-})
-</script>

components/collections/EditRequest.vue

@@ -1,63 +0,0 @@
-<template>
-  <SmartModal v-if="show" :title="$t('modal.edit_request')" @close="hideModal">
-    <template #body>
-      <div class="flex flex-col px-2">
-        <input
-          id="selectLabelEditReq"
-          v-model="requestUpdateData.name"
-          v-focus
-          class="input floating-input"
-          placeholder=" "
-          type="text"
-          @keyup.enter="saveRequest"
-        />
-        <label for="selectLabelEditReq">
-          {{ $t("action.label") }}
-        </label>
-      </div>
-    </template>
-    <template #footer>
-      <span>
-        <ButtonPrimary :label="$t('action.save')" @click.native="saveRequest" />
-        <ButtonSecondary
-          :label="$t('action.cancel')"
-          @click.native="hideModal"
-        />
-      </span>
-    </template>
-  </SmartModal>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-
-export default defineComponent({
-  props: {
-    show: Boolean,
-    placeholderReqName: { type: String, default: null },
-  },
-  data() {
-    return {
-      requestUpdateData: {
-        name: null,
-      },
-    }
-  },
-  methods: {
-    saveRequest() {
-      if (!this.requestUpdateData.name) {
-        this.$toast.error(this.$t("request.invalid_name"), {
-          icon: "error_outline",
-        })
-        return
-      }
-      this.$emit("submit", this.requestUpdateData)
-      this.hideModal()
-    },
-    hideModal() {
-      this.requestUpdateData = { name: null }
-      this.$emit("hide-modal")
-    },
-  },
-})
-</script>

components/collections/ImportExport.vue

@@ -1,558 +0,0 @@
-<template>
-  <SmartModal
-    v-if="show"
-    :title="`${$t('modal.import_export')} ${$t('modal.collections')}`"
-    @close="hideModal"
-  >
-    <template #actions>
-      <ButtonSecondary
-        v-if="mode == 'import_from_my_collections'"
-        v-tippy="{ theme: 'tooltip' }"
-        :title="$t('action.go_back')"
-        class="rounded"
-        icon="arrow_back"
-        @click.native="
-          mode = 'import_export'
-          mySelectedCollectionID = undefined
-        "
-      />
-      <span>
-        <tippy
-          v-if="
-            mode == 'import_export' && collectionsType.type == 'my-collections'
-          "
-          ref="options"
-          interactive
-          trigger="click"
-          theme="popover"
-          arrow
-        >
-          <template #trigger>
-            <ButtonSecondary
-              v-tippy="{ theme: 'tooltip' }"
-              :title="$t('action.more')"
-              class="rounded"
-              icon="more_vert"
-            />
-          </template>
-          <SmartItem
-            icon="assignment_returned"
-            :label="$t('import.from_gist')"
-            @click.native="
-              readCollectionGist
-              $refs.options.tippy().hide()
-            "
-          />
-          <span
-            v-tippy="{ theme: 'tooltip' }"
-            :title="
-              !currentUser
-                ? $t('export.require_github')
-                : currentUser.provider !== 'github.com'
-                ? $t('export.require_github')
-                : null
-            "
-          >
-            <SmartItem
-              :disabled="
-                !currentUser
-                  ? true
-                  : currentUser.provider !== 'github.com'
-                  ? true
-                  : false
-              "
-              icon="assignment_turned_in"
-              :label="$t('export.create_secret_gist')"
-              @click.native="
-                createCollectionGist()
-                $refs.options.tippy().hide()
-              "
-            />
-          </span>
-        </tippy>
-      </span>
-    </template>
-    <template #body>
-      <div v-if="mode == 'import_export'" class="flex flex-col space-y-2">
-        <SmartItem
-          v-tippy="{ theme: 'tooltip' }"
-          :title="$t('action.replace_current')"
-          icon="folder_special"
-          :label="$t('action.replace_json')"
-          @click.native="openDialogChooseFileToReplaceWith"
-        />
-        <input
-          ref="inputChooseFileToReplaceWith"
-          class="input"
-          type="file"
-          style="display: none"
-          accept="application/json"
-          @change="replaceWithJSON"
-        />
-        <SmartItem
-          v-tippy="{ theme: 'tooltip' }"
-          :title="$t('action.preserve_current')"
-          icon="create_new_folder"
-          :label="$t('import.json')"
-          @click.native="openDialogChooseFileToImportFrom"
-        />
-        <input
-          ref="inputChooseFileToImportFrom"
-          class="input"
-          type="file"
-          style="display: none"
-          accept="application/json"
-          @change="importFromJSON"
-        />
-        <SmartItem
-          v-if="collectionsType.type == 'team-collections'"
-          v-tippy="{ theme: 'tooltip' }"
-          :title="$t('action.preserve_current')"
-          icon="folder_shared"
-          :label="$t('import.from_my_collections')"
-          @click.native="mode = 'import_from_my_collections'"
-        />
-        <SmartItem
-          v-tippy="{ theme: 'tooltip' }"
-          :title="$t('action.download_file')"
-          icon="drive_file_move"
-          :label="$t('export.as_json')"
-          @click.native="exportJSON"
-        />
-      </div>
-      <div
-        v-if="mode == 'import_from_my_collections'"
-        class="flex flex-col px-2"
-      >
-        <div class="select-wrapper">
-          <select
-            type="text"
-            class="select"
-            autofocus
-            @change="
-              ($event) => {
-                mySelectedCollectionID = $event.target.value
-              }
-            "
-          >
-            <option
-              :key="undefined"
-              :value="undefined"
-              hidden
-              disabled
-              selected
-            >
-              Select Collection
-            </option>
-            <option
-              v-for="(collection, index) in myCollections"
-              :key="`collection-${index}`"
-              :value="index"
-            >
-              {{ collection.name }}
-            </option>
-          </select>
-        </div>
-      </div>
-    </template>
-    <template #footer>
-      <div v-if="mode == 'import_from_my_collections'">
-        <span>
-          <ButtonPrimary
-            :disabled="mySelectedCollectionID == undefined"
-            icon="create_new_folder"
-            :label="$t('import.title')"
-            @click.native="importFromMyCollections"
-          />
-        </span>
-      </div>
-    </template>
-  </SmartModal>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-import { currentUser$ } from "~/helpers/fb/auth"
-import * as teamUtils from "~/helpers/teams/utils"
-import { useReadonlyStream } from "~/helpers/utils/composables"
-import {
-  restCollections$,
-  setRESTCollections,
-  appendRESTCollections,
-} from "~/newstore/collections"
-
-export default defineComponent({
-  props: {
-    show: Boolean,
-    collectionsType: { type: Object, default: () => {} },
-  },
-  setup() {
-    return {
-      myCollections: useReadonlyStream(restCollections$, []),
-      currentUser: useReadonlyStream(currentUser$, null),
-    }
-  },
-  data() {
-    return {
-      showJsonCode: false,
-      mode: "import_export",
-      mySelectedCollectionID: undefined,
-      collectionJson: "",
-    }
-  },
-  methods: {
-    async createCollectionGist() {
-      this.getJSONCollection()
-      await this.$axios
-        .$post(
-          "https://api.github.com/gists",
-          {
-            files: {
-              "hoppscotch-collections.json": {
-                content: this.collectionJson,
-              },
-            },
-          },
-          {
-            headers: {
-              Authorization: `token ${this.currentUser.accessToken}`,
-              Accept: "application/vnd.github.v3+json",
-            },
-          }
-        )
-        .then((res) => {
-          this.$toast.success(this.$t("export.gist_created"), {
-            icon: "done",
-          })
-          window.open(res.html_url)
-        })
-        .catch((e) => {
-          this.$toast.error(this.$t("error.something_went_wrong"), {
-            icon: "error_outline",
-          })
-          console.error(e)
-        })
-    },
-    async readCollectionGist() {
-      const gist = prompt(this.$t("import.gist_url"))
-      if (!gist) return
-      await this.$axios
-        .$get(`https://api.github.com/gists/${gist.split("/").pop()}`, {
-          headers: {
-            Accept: "application/vnd.github.v3+json",
-          },
-        })
-        .then(({ files }) => {
-          const collections = JSON.parse(Object.values(files)[0].content)
-          setRESTCollections(collections)
-          this.fileImported()
-        })
-        .catch((e) => {
-          this.failedImport()
-          console.error(e)
-        })
-    },
-    hideModal() {
-      this.mode = "import_export"
-      this.mySelectedCollectionID = undefined
-      this.$emit("hide-modal")
-    },
-    openDialogChooseFileToReplaceWith() {
-      this.$refs.inputChooseFileToReplaceWith.click()
-    },
-    openDialogChooseFileToImportFrom() {
-      this.$refs.inputChooseFileToImportFrom.click()
-    },
-    replaceWithJSON() {
-      const reader = new FileReader()
-      reader.onload = ({ target }) => {
-        const content = target.result
-        let collections = JSON.parse(content)
-        if (collections[0]) {
-          const [name, folders, requests] = Object.keys(collections[0])
-          if (
-            name === "name" &&
-            folders === "folders" &&
-            requests === "requests"
-          ) {
-            // Do nothing
-          }
-        } else if (
-          collections.info &&
-          collections.info.schema.includes("v2.1.0")
-        ) {
-          collections = [this.parsePostmanCollection(collections)]
-        } else {
-          this.failedImport()
-        }
-        if (this.collectionsType.type === "team-collections") {
-          teamUtils
-            .replaceWithJSON(
-              this.$apollo,
-              collections,
-              this.collectionsType.selectedTeam.id
-            )
-            .then((status) => {
-              if (status) {
-                this.fileImported()
-              } else {
-                this.failedImport()
-              }
-            })
-            .catch((e) => {
-              console.error(e)
-              this.failedImport()
-            })
-        } else {
-          setRESTCollections(collections)
-          this.fileImported()
-        }
-      }
-      reader.readAsText(this.$refs.inputChooseFileToReplaceWith.files[0])
-      this.$refs.inputChooseFileToReplaceWith.value = ""
-    },
-    importFromJSON() {
-      const reader = new FileReader()
-      reader.onload = ({ target }) => {
-        const content = target.result
-        let collections = JSON.parse(content)
-        if (collections[0]) {
-          const [name, folders, requests] = Object.keys(collections[0])
-          if (
-            name === "name" &&
-            folders === "folders" &&
-            requests === "requests"
-          ) {
-            // Do nothing
-          }
-        } else if (
-          collections.info &&
-          collections.info.schema.includes("v2.1.0")
-        ) {
-          // replace the variables, postman uses {{var}}, Hoppscotch uses <<var>>
-          collections = JSON.parse(
-            content.replaceAll(/{{([a-z]+)}}/gi, "<<$1>>")
-          )
-          collections = [this.parsePostmanCollection(collections)]
-        } else {
-          this.failedImport()
-          return
-        }
-        if (this.collectionsType.type === "team-collections") {
-          teamUtils
-            .importFromJSON(
-              this.$apollo,
-              collections,
-              this.collectionsType.selectedTeam.id
-            )
-            .then((status) => {
-              if (status) {
-                this.$emit("update-team-collections")
-                this.fileImported()
-              } else {
-                this.failedImport()
-              }
-            })
-            .catch((e) => {
-              console.error(e)
-              this.failedImport()
-            })
-        } else {
-          appendRESTCollections(collections)
-          this.fileImported()
-        }
-      }
-      reader.readAsText(this.$refs.inputChooseFileToImportFrom.files[0])
-      this.$refs.inputChooseFileToImportFrom.value = ""
-    },
-    importFromMyCollections() {
-      teamUtils
-        .importFromMyCollections(
-          this.$apollo,
-          this.mySelectedCollectionID,
-          this.collectionsType.selectedTeam.id
-        )
-        .then((success) => {
-          if (success) {
-            this.fileImported()
-            this.$emit("update-team-collections")
-          } else {
-            this.failedImport()
-          }
-        })
-        .catch((e) => {
-          console.error(e)
-          this.failedImport()
-        })
-    },
-    async getJSONCollection() {
-      if (this.collectionsType.type === "my-collections") {
-        this.collectionJson = JSON.stringify(this.myCollections, null, 2)
-      } else {
-        this.collectionJson = await teamUtils.exportAsJSON(
-          this.$apollo,
-          this.collectionsType.selectedTeam.id
-        )
-      }
-      return this.collectionJson
-    },
-    exportJSON() {
-      this.getJSONCollection()
-      const dataToWrite = this.collectionJson
-      const file = new Blob([dataToWrite], { type: "application/json" })
-      const a = document.createElement("a")
-      const url = URL.createObjectURL(file)
-      a.href = url
-      // TODO get uri from meta
-      a.download = `${url.split("/").pop().split("#")[0].split("?")[0]}`
-      document.body.appendChild(a)
-      a.click()
-      this.$toast.success(this.$t("state.download_started"), {
-        icon: "downloading",
-      })
-      setTimeout(() => {
-        document.body.removeChild(a)
-        URL.revokeObjectURL(url)
-      }, 1000)
-    },
-    fileImported() {
-      this.$toast.success(this.$t("state.file_imported"), {
-        icon: "folder_shared",
-      })
-    },
-    failedImport() {
-      this.$toast.error(this.$t("import.failed"), {
-        icon: "error_outline",
-      })
-    },
-    parsePostmanCollection({ info, name, item }) {
-      const hoppscotchCollection = {
-        name: "",
-        folders: [],
-        requests: [],
-      }
-
-      hoppscotchCollection.name = info ? info.name : name
-
-      if (item && item.length > 0) {
-        for (const collectionItem of item) {
-          if (collectionItem.request) {
-            if (
-              Object.prototype.hasOwnProperty.call(
-                hoppscotchCollection,
-                "folders"
-              )
-            ) {
-              hoppscotchCollection.name = info ? info.name : name
-              hoppscotchCollection.requests.push(
-                this.parsePostmanRequest(collectionItem)
-              )
-            } else {
-              hoppscotchCollection.name = name || ""
-              hoppscotchCollection.requests.push(
-                this.parsePostmanRequest(collectionItem)
-              )
-            }
-          } else if (this.hasFolder(collectionItem)) {
-            hoppscotchCollection.folders.push(
-              this.parsePostmanCollection(collectionItem)
-            )
-          } else {
-            hoppscotchCollection.requests.push(
-              this.parsePostmanRequest(collectionItem)
-            )
-          }
-        }
-      }
-      return hoppscotchCollection
-    },
-    parsePostmanRequest({ name, request }) {
-      const pwRequest = {
-        url: "",
-        path: "",
-        method: "",
-        auth: "",
-        httpUser: "",
-        httpPassword: "",
-        passwordFieldType: "password",
-        bearerToken: "",
-        headers: [],
-        params: [],
-        bodyParams: [],
-        rawParams: "",
-        rawInput: false,
-        contentType: "",
-        requestType: "",
-        name: "",
-      }
-
-      pwRequest.name = name
-      if (request.url) {
-        const requestObjectUrl = request.url.raw.match(
-          /^(.+:\/\/[^/]+|{[^/]+})(\/[^?]+|).*$/
-        )
-        if (requestObjectUrl) {
-          pwRequest.url = requestObjectUrl[1]
-          pwRequest.path = requestObjectUrl[2] ? requestObjectUrl[2] : ""
-        }
-      }
-      pwRequest.method = request.method
-      const itemAuth = request.auth ? request.auth : ""
-      const authType = itemAuth ? itemAuth.type : ""
-      if (authType === "basic") {
-        pwRequest.auth = "Basic Auth"
-        pwRequest.httpUser =
-          itemAuth.basic[0].key === "username"
-            ? itemAuth.basic[0].value
-            : itemAuth.basic[1].value
-        pwRequest.httpPassword =
-          itemAuth.basic[0].key === "password"
-            ? itemAuth.basic[0].value
-            : itemAuth.basic[1].value
-      } else if (authType === "oauth2") {
-        pwRequest.auth = "OAuth 2.0"
-        pwRequest.bearerToken =
-          itemAuth.oauth2[0].key === "accessToken"
-            ? itemAuth.oauth2[0].value
-            : itemAuth.oauth2[1].value
-      } else if (authType === "bearer") {
-        pwRequest.auth = "Bearer Token"
-        pwRequest.bearerToken = itemAuth.bearer[0].value
-      }
-      const requestObjectHeaders = request.header
-      if (requestObjectHeaders) {
-        pwRequest.headers = requestObjectHeaders
-        for (const header of pwRequest.headers) {
-          delete header.name
-          delete header.type
-        }
-      }
-      if (request.url) {
-        const requestObjectParams = request.url.query
-        if (requestObjectParams) {
-          pwRequest.params = requestObjectParams
-          for (const param of pwRequest.params) {
-            delete param.disabled
-          }
-        }
-      }
-      if (request.body) {
-        if (request.body.mode === "urlencoded") {
-          const params = request.body.urlencoded
-          pwRequest.bodyParams = params || []
-          for (const param of pwRequest.bodyParams) {
-            delete param.type
-          }
-        } else if (request.body.mode === "raw") {
-          pwRequest.rawInput = true
-          pwRequest.rawParams = request.body.raw
-        }
-      }
-      return pwRequest
-    },
-    hasFolder(item) {
-      return Object.prototype.hasOwnProperty.call(item, "item")
-    },
-  },
-})
-</script>

components/collections/SaveRequest.vue

@@ -1,242 +0,0 @@
-<template>
-  <SmartModal v-if="show" :title="$t('collection.save_as')" @close="hideModal">
-    <template #body>
-      <div class="flex flex-col px-2">
-        <div class="flex relative">
-          <input
-            id="selectLabelSaveReq"
-            v-model="requestName"
-            v-focus
-            class="input floating-input"
-            placeholder=" "
-            type="text"
-            @keyup.enter="saveRequestAs"
-          />
-          <label for="selectLabelSaveReq">
-            {{ $t("request.name") }}
-          </label>
-        </div>
-        <label class="px-4 pt-4 pb-4">
-          {{ $t("collection.select_location") }}
-        </label>
-        <CollectionsGraphql
-          v-if="mode === 'graphql'"
-          :doc="false"
-          :show-coll-actions="false"
-          :picked="picked"
-          :saving-mode="true"
-          @select="onSelect"
-        />
-        <Collections
-          v-else
-          :picked="picked"
-          :save-request="true"
-          @select="onSelect"
-          @update-collection="collectionsType.type = $event"
-          @update-coll-type="onUpdateCollType"
-        />
-      </div>
-    </template>
-    <template #footer>
-      <span>
-        <ButtonPrimary
-          :label="$t('action.save')"
-          @click.native="saveRequestAs"
-        />
-        <ButtonSecondary
-          :label="$t('action.cancel')"
-          @click.native="hideModal"
-        />
-      </span>
-    </template>
-  </SmartModal>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-import * as teamUtils from "~/helpers/teams/utils"
-import {
-  saveRESTRequestAs,
-  editRESTRequest,
-  editGraphqlRequest,
-  saveGraphqlRequestAs,
-} from "~/newstore/collections"
-import { getGQLSession, useGQLRequestName } from "~/newstore/GQLSession"
-import {
-  getRESTRequest,
-  useRESTRequestName,
-  setRESTSaveContext,
-} from "~/newstore/RESTSession"
-
-export default defineComponent({
-  props: {
-    // mode can be either "graphql" or "rest"
-    mode: { type: String, default: "rest" },
-    show: Boolean,
-  },
-  setup(props) {
-    return {
-      requestName:
-        props.mode === "rest" ? useRESTRequestName() : useGQLRequestName(),
-    }
-  },
-  data() {
-    return {
-      requestData: {
-        name: this.requestName,
-        collectionIndex: undefined,
-        folderName: undefined,
-        requestIndex: undefined,
-      },
-      collectionsType: {
-        type: "my-collections",
-        selectedTeam: undefined,
-      },
-      picked: null,
-    }
-  },
-  watch: {
-    "requestData.collectionIndex": function resetFolderAndRequestIndex() {
-      // if user has chosen some folder, than selected other collection, which doesn't have any folders
-      // than `requestUpdateData.folderName` won't be reseted
-      this.$data.requestData.folderName = undefined
-      this.$data.requestData.requestIndex = undefined
-    },
-    "requestData.folderName": function resetRequestIndex() {
-      this.$data.requestData.requestIndex = undefined
-    },
-    editingRequest({ name }) {
-      this.$data.requestData.name = name || this.$data.defaultRequestName
-    },
-  },
-  methods: {
-    onUpdateCollType(newCollType) {
-      this.collectionsType = newCollType
-    },
-    onSelect({ picked }) {
-      this.picked = picked
-    },
-    async saveRequestAs() {
-      if (!this.requestName) {
-        this.$toast.error(this.$t("error.empty_req_name"), {
-          icon: "error_outline",
-        })
-        return
-      }
-      if (this.picked == null) {
-        this.$toast.error(this.$t("collection.select"), {
-          icon: "error_outline",
-        })
-        return
-      }
-
-      const requestUpdated =
-        this.mode === "rest" ? getRESTRequest() : getGQLSession()
-
-      // Filter out all REST file inputs
-      if (this.mode === "rest" && requestUpdated.bodyParams) {
-        requestUpdated.bodyParams = requestUpdated.bodyParams.map((param) =>
-          param?.value?.[0] instanceof File ? { ...param, value: "" } : param
-        )
-      }
-
-      if (this.picked.pickedType === "my-request") {
-        editRESTRequest(
-          this.picked.folderPath,
-          this.picked.requestIndex,
-          requestUpdated
-        )
-        setRESTSaveContext({
-          originLocation: "user-collection",
-          folderPath: this.picked.folderPath,
-          requestIndex: this.picked.requestIndex,
-        })
-      } else if (this.picked.pickedType === "my-folder") {
-        const insertionIndex = saveRESTRequestAs(
-          this.picked.folderPath,
-          requestUpdated
-        )
-        setRESTSaveContext({
-          originLocation: "user-collection",
-          folderPath: this.picked.folderPath,
-          requestIndex: insertionIndex,
-        })
-      } else if (this.picked.pickedType === "my-collection") {
-        const insertionIndex = saveRESTRequestAs(
-          `${this.picked.collectionIndex}`,
-          requestUpdated
-        )
-        setRESTSaveContext({
-          originLocation: "user-collection",
-          folderPath: `${this.picked.collectionIndex}`,
-          requestIndex: insertionIndex,
-        })
-      } else if (this.picked.pickedType === "teams-request") {
-        teamUtils.overwriteRequestTeams(
-          this.$apollo,
-          JSON.stringify(requestUpdated),
-          requestUpdated.name,
-          this.picked.requestID
-        )
-        setRESTSaveContext({
-          originLocation: "team-collection",
-          requestID: this.picked.requestID,
-        })
-      } else if (this.picked.pickedType === "teams-folder") {
-        const req = await teamUtils.saveRequestAsTeams(
-          this.$apollo,
-          JSON.stringify(requestUpdated),
-          requestUpdated.name,
-          this.collectionsType.selectedTeam.id,
-          this.picked.folderID
-        )
-
-        if (req && req.id) {
-          setRESTSaveContext({
-            originLocation: "team-collection",
-            requestID: req.id,
-            teamID: this.collectionsType.selectedTeam.id,
-            collectionID: this.picked.folderID,
-          })
-        }
-      } else if (this.picked.pickedType === "teams-collection") {
-        const req = await teamUtils.saveRequestAsTeams(
-          this.$apollo,
-          JSON.stringify(requestUpdated),
-          requestUpdated.name,
-          this.collectionsType.selectedTeam.id,
-          this.picked.collectionID
-        )
-
-        if (req && req.id) {
-          setRESTSaveContext({
-            originLocation: "team-collection",
-            requestID: req.id,
-            teamID: this.collectionsType.selectedTeam.id,
-            collectionID: this.picked.collectionID,
-          })
-        }
-      } else if (this.picked.pickedType === "gql-my-request") {
-        editGraphqlRequest(
-          this.picked.folderPath,
-          this.picked.requestIndex,
-          requestUpdated
-        )
-      } else if (this.picked.pickedType === "gql-my-folder") {
-        saveGraphqlRequestAs(this.picked.folderPath, requestUpdated)
-      } else if (this.picked.pickedType === "gql-my-collection") {
-        saveGraphqlRequestAs(`${this.picked.collectionIndex}`, requestUpdated)
-      }
-      this.$toast.success(this.$t("request.added"), {
-        icon: "post_add",
-      })
-
-      this.hideModal()
-    },
-    hideModal() {
-      this.picked = null
-      this.$emit("hide-modal")
-    },
-  },
-})
-</script>

components/collections/graphql/Add.vue

@@ -1,73 +0,0 @@
-<template>
-  <SmartModal v-if="show" :title="$t('collection.new')" @close="hideModal">
-    <template #body>
-      <div class="flex flex-col px-2">
-        <input
-          id="selectLabelGqlAdd"
-          v-model="name"
-          v-focus
-          class="input floating-input"
-          placeholder=" "
-          type="text"
-          @keyup.enter="addNewCollection"
-        />
-        <label for="selectLabelGqlAdd">
-          {{ $t("action.label") }}
-        </label>
-      </div>
-    </template>
-    <template #footer>
-      <span>
-        <ButtonPrimary
-          :label="$t('action.save')"
-          @click.native="addNewCollection"
-        />
-        <ButtonSecondary
-          :label="$t('action.cancel')"
-          @click.native="hideModal"
-        />
-      </span>
-    </template>
-  </SmartModal>
-</template>
-
-<script lang="ts">
-import { defineComponent } from "@nuxtjs/composition-api"
-import { HoppGQLRequest } from "~/helpers/types/HoppGQLRequest"
-import { addGraphqlCollection, makeCollection } from "~/newstore/collections"
-
-export default defineComponent({
-  props: {
-    show: Boolean,
-  },
-  data() {
-    return {
-      name: null as string | null,
-    }
-  },
-  methods: {
-    addNewCollection() {
-      if (!this.name) {
-        this.$toast.error(this.$t("collection.invalid_name").toString(), {
-          icon: "error_outline",
-        })
-        return
-      }
-
-      addGraphqlCollection(
-        makeCollection<HoppGQLRequest>({
-          name: this.name,
-          folders: [],
-          requests: [],
-        })
-      )
-
-      this.hideModal()
-    },
-    hideModal() {
-      this.name = null
-      this.$emit("hide-modal")
-    },
-  },
-})
-</script>

components/collections/graphql/AddFolder.vue

@@ -1,65 +0,0 @@
-<template>
-  <SmartModal
-    v-if="show"
-    :title="$t('folder.new')"
-    @close="$emit('hide-modal')"
-  >
-    <template #body>
-      <div class="flex flex-col px-2">
-        <input
-          id="selectLabelGqlAddFolder"
-          v-model="name"
-          v-focus
-          class="input floating-input"
-          placeholder=" "
-          type="text"
-          @keyup.enter="addFolder"
-        />
-        <label for="selectLabelGqlAddFolder">
-          {{ $t("action.label") }}
-        </label>
-      </div>
-    </template>
-    <template #footer>
-      <span>
-        <ButtonPrimary :label="$t('action.save')" @click.native="addFolder" />
-        <ButtonSecondary
-          :label="$t('action.cancel')"
-          @click.native="hideModal"
-        />
-      </span>
-    </template>
-  </SmartModal>
-</template>
-
-<script lang="ts">
-import { defineComponent } from "@nuxtjs/composition-api"
-
-export default defineComponent({
-  props: {
-    show: Boolean,
-    folderPath: { type: String, default: null },
-    collectionIndex: { type: Number, default: null },
-  },
-  data() {
-    return {
-      name: null,
-    }
-  },
-  methods: {
-    addFolder() {
-      // TODO: Blocking when name is null ?
-
-      this.$emit("add-folder", {
-        name: this.name,
-        path: this.folderPath || `${this.collectionIndex}`,
-      })
-      this.hideModal()
-    },
-    hideModal() {
-      this.name = null
-      this.$emit("hide-modal")
-    },
-  },
-})
-</script>

components/collections/graphql/Collection.vue

@@ -1,235 +0,0 @@
-<template>
-  <div class="flex flex-col" :class="[{ 'bg-primaryLight': dragging }]">
-    <div
-      class="flex items-center group"
-      @dragover.prevent
-      @drop.prevent="dropEvent"
-      @dragover="dragging = true"
-      @drop="dragging = false"
-      @dragleave="dragging = false"
-      @dragend="dragging = false"
-    >
-      <span
-        class="cursor-pointer flex px-4 justify-center items-center"
-        @click="toggleShowChildren()"
-      >
-        <i class="material-icons" :class="{ 'text-green-500': isSelected }">
-          {{ getCollectionIcon }}
-        </i>
-      </span>
-      <span
-        class="
-          cursor-pointer
-          flex flex-1
-          min-w-0
-          py-2
-          pr-2
-          transition
-          group-hover:text-secondaryDark
-        "
-        @click="toggleShowChildren()"
-      >
-        <span class="truncate"> {{ collection.name }} </span>
-      </span>
-      <div class="flex">
-        <ButtonSecondary
-          v-tippy="{ theme: 'tooltip' }"
-          icon="create_new_folder"
-          :title="$t('folder.new')"
-          class="hidden group-hover:inline-flex"
-          @click.native="
-            $emit('add-folder', {
-              path: `${collectionIndex}`,
-            })
-          "
-        />
-        <span>
-          <tippy
-            ref="options"
-            interactive
-            trigger="click"
-            theme="popover"
-            arrow
-          >
-            <template #trigger>
-              <ButtonSecondary
-                v-tippy="{ theme: 'tooltip' }"
-                :title="$t('action.more')"
-                icon="more_vert"
-              />
-            </template>
-            <SmartItem
-              icon="create_new_folder"
-              :label="$t('folder.new')"
-              @click.native="
-                $emit('add-folder', {
-                  path: `${collectionIndex}`,
-                })
-                $refs.options.tippy().hide()
-              "
-            />
-            <SmartItem
-              icon="create"
-              :label="$t('action.edit')"
-              @click.native="
-                $emit('edit-collection')
-                $refs.options.tippy().hide()
-              "
-            />
-            <SmartItem
-              icon="delete"
-              color="red"
-              :label="$t('action.delete')"
-              @click.native="
-                confirmRemove = true
-                $refs.options.tippy().hide()
-              "
-            />
-          </tippy>
-        </span>
-      </div>
-    </div>
-    <div v-if="showChildren || isFiltered">
-      <CollectionsGraphqlFolder
-        v-for="(folder, index) in collection.folders"
-        :key="`folder-${index}`"
-        class="border-l border-dividerLight ml-6"
-        :picked="picked"
-        :saving-mode="savingMode"
-        :folder="folder"
-        :folder-index="index"
-        :folder-path="`${collectionIndex}/${index}`"
-        :collection-index="collectionIndex"
-        :doc="doc"
-        :is-filtered="isFiltered"
-        @add-folder="$emit('add-folder', $event)"
-        @edit-folder="$emit('edit-folder', $event)"
-        @edit-request="$emit('edit-request', $event)"
-        @select="$emit('select', $event)"
-      />
-      <CollectionsGraphqlRequest
-        v-for="(request, index) in collection.requests"
-        :key="`request-${index}`"
-        class="border-l border-dividerLight ml-6"
-        :picked="picked"
-        :saving-mode="savingMode"
-        :request="request"
-        :collection-index="collectionIndex"
-        :folder-index="-1"
-        :folder-name="collection.name"
-        :folder-path="`${collectionIndex}`"
-        :request-index="index"
-        :doc="doc"
-        @edit-request="$emit('edit-request', $event)"
-        @select="$emit('select', $event)"
-      />
-      <div
-        v-if="
-          collection.folders.length === 0 && collection.requests.length === 0
-        "
-        class="
-          border-l border-dividerLight
-          flex flex-col
-          text-secondaryLight
-          ml-6
-          p-4
-          items-center
-          justify-center
-        "
-      >
-        <i class="opacity-75 pb-2 material-icons">folder_open</i>
-        <span class="text-center">
-          {{ $t("empty.collection") }}
-        </span>
-      </div>
-    </div>
-    <SmartConfirmModal
-      :show="confirmRemove"
-      :title="$t('confirm.remove_collection')"
-      @hide-modal="confirmRemove = false"
-      @resolve="removeCollection"
-    />
-  </div>
-</template>
-
-<script lang="ts">
-import { defineComponent } from "@nuxtjs/composition-api"
-import {
-  removeGraphqlCollection,
-  moveGraphqlRequest,
-} from "~/newstore/collections"
-
-export default defineComponent({
-  props: {
-    picked: { type: Object, default: null },
-    // Whether the viewing context is related to picking (activates 'select' events)
-    savingMode: { type: Boolean, default: false },
-    collectionIndex: { type: Number, default: null },
-    collection: { type: Object, default: () => {} },
-    doc: Boolean,
-    isFiltered: Boolean,
-  },
-  data() {
-    return {
-      showChildren: false,
-      dragging: false,
-      selectedFolder: {},
-      confirmRemove: false,
-    }
-  },
-  computed: {
-    isSelected(): boolean {
-      return (
-        this.picked &&
-        this.picked.pickedType === "gql-my-collection" &&
-        this.picked.collectionIndex === this.collectionIndex
-      )
-    },
-    getCollectionIcon() {
-      if (this.isSelected) return "check_circle_outline"
-      else if (!this.showChildren && !this.isFiltered) return "folder"
-      else if (this.showChildren || this.isFiltered) return "folder_open"
-      else return "folder"
-    },
-  },
-  methods: {
-    pick() {
-      this.$emit("select", {
-        picked: {
-          pickedType: "gql-my-collection",
-          collectionIndex: this.collectionIndex,
-        },
-      })
-    },
-    toggleShowChildren() {
-      if (this.savingMode) {
-        this.pick()
-      }
-
-      this.showChildren = !this.showChildren
-    },
-    removeCollection() {
-      // Cancel pick if picked collection is deleted
-      if (
-        this.picked &&
-        this.picked.pickedType === "gql-my-collection" &&
-        this.picked.collectionIndex === this.collectionIndex
-      ) {
-        this.$emit("select", { picked: null })
-      }
-      removeGraphqlCollection(this.collectionIndex)
-      this.$toast.success(this.$t("state.deleted").toString(), {
-        icon: "delete",
-      })
-    },
-    dropEvent({ dataTransfer }: any) {
-      this.dragging = !this.dragging
-
-      const folderPath = dataTransfer.getData("folderPath")
-      const requestIndex = dataTransfer.getData("requestIndex")
-
-      moveGraphqlRequest(folderPath, requestIndex, `${this.collectionIndex}`)
-    },
-  },
-})
-</script>

components/collections/graphql/Edit.vue

@@ -1,71 +0,0 @@
-<template>
-  <SmartModal v-if="show" :title="$t('collection.edit')" @close="hideModal">
-    <template #body>
-      <div class="flex flex-col px-2">
-        <input
-          id="selectLabelGqlEdit"
-          v-model="name"
-          v-focus
-          class="input floating-input"
-          placeholder=" "
-          type="text"
-          @keyup.enter="saveCollection"
-        />
-        <label for="selectLabelGqlEdit">
-          {{ $t("action.label") }}
-        </label>
-      </div>
-    </template>
-    <template #footer>
-      <span>
-        <ButtonPrimary
-          :label="$t('action.save')"
-          @click.native="saveCollection"
-        />
-        <ButtonSecondary
-          :label="$t('action.cancel')"
-          @click.native="hideModal"
-        />
-      </span>
-    </template>
-  </SmartModal>
-</template>
-
-<script lang="ts">
-import { defineComponent } from "@nuxtjs/composition-api"
-import { editGraphqlCollection } from "~/newstore/collections"
-
-export default defineComponent({
-  props: {
-    show: Boolean,
-    editingCollection: { type: Object, default: () => {} },
-    editingCollectionIndex: { type: Number, default: null },
-  },
-  data() {
-    return {
-      name: null as string | null,
-    }
-  },
-  methods: {
-    saveCollection() {
-      if (!this.name) {
-        this.$toast.error(this.$t("collection.invalid_name").toString(), {
-          icon: "error_outline",
-        })
-        return
-      }
-      const collectionUpdated = {
-        ...(this.editingCollection as any),
-        name: this.name,
-      }
-
-      editGraphqlCollection(this.editingCollectionIndex, collectionUpdated)
-      this.hideModal()
-    },
-    hideModal() {
-      this.name = null
-      this.$emit("hide-modal")
-    },
-  },
-})
-</script>

components/collections/graphql/EditFolder.vue

@@ -1,70 +0,0 @@
-<template>
-  <SmartModal
-    v-if="show"
-    :title="$t('folder.edit')"
-    @close="$emit('hide-modal')"
-  >
-    <template #body>
-      <div class="flex flex-col px-2">
-        <input
-          id="selectLabelGqlEditFolder"
-          v-model="name"
-          v-focus
-          class="input floating-input"
-          placeholder=" "
-          type="text"
-          @keyup.enter="editFolder"
-        />
-        <label for="selectLabelGqlEditFolder">
-          {{ $t("action.label") }}
-        </label>
-      </div>
-    </template>
-    <template #footer>
-      <span>
-        <ButtonPrimary :label="$t('action.save')" @click.native="editFolder" />
-        <ButtonSecondary
-          :label="$t('action.cancel')"
-          @click.native="hideModal"
-        />
-      </span>
-    </template>
-  </SmartModal>
-</template>
-
-<script lang="ts">
-import { defineComponent } from "@nuxtjs/composition-api"
-import { editGraphqlFolder } from "~/newstore/collections"
-
-export default defineComponent({
-  props: {
-    show: Boolean,
-    folder: { type: Object, default: () => {} },
-    folderPath: { type: String, default: null },
-  },
-  data() {
-    return {
-      name: "",
-    }
-  },
-  methods: {
-    editFolder() {
-      if (!this.name) {
-        this.$toast.error(this.$t("collection.invalid_name").toString(), {
-          icon: "error_outline",
-        })
-        return
-      }
-      editGraphqlFolder(this.folderPath, {
-        ...(this.folder as any),
-        name: this.name,
-      })
-      this.hideModal()
-    },
-    hideModal() {
-      this.name = ""
-      this.$emit("hide-modal")
-    },
-  },
-})
-</script>

components/collections/graphql/EditRequest.vue

@@ -1,73 +0,0 @@
-<template>
-  <SmartModal v-if="show" :title="$t('modal.edit_request')" @close="hideModal">
-    <template #body>
-      <div class="flex flex-col px-2">
-        <input
-          id="selectLabelGqlEditReq"
-          v-model="requestUpdateData.name"
-          v-focus
-          class="input floating-input"
-          placeholder=" "
-          type="text"
-          @keyup.enter="saveRequest"
-        />
-        <label for="selectLabelGqlEditReq">
-          {{ $t("action.label") }}
-        </label>
-      </div>
-    </template>
-    <template #footer>
-      <span>
-        <ButtonPrimary :label="$t('action.save')" @click.native="saveRequest" />
-        <ButtonSecondary
-          :label="$t('action.cancel')"
-          @click.native="hideModal"
-        />
-      </span>
-    </template>
-  </SmartModal>
-</template>
-
-<script lang="ts">
-import { defineComponent, PropType } from "@nuxtjs/composition-api"
-import { HoppGQLRequest } from "~/helpers/types/HoppGQLRequest"
-import { editGraphqlRequest } from "~/newstore/collections"
-
-export default defineComponent({
-  props: {
-    show: Boolean,
-    folderPath: { type: String, default: null },
-    request: { type: Object as PropType<HoppGQLRequest>, default: () => {} },
-    requestIndex: { type: Number, default: null },
-  },
-  data() {
-    return {
-      requestUpdateData: {
-        name: null as any | null,
-      },
-    }
-  },
-  methods: {
-    saveRequest() {
-      if (!this.requestUpdateData.name) {
-        this.$toast.error(this.$t("collection.invalid_name").toString(), {
-          icon: "error_outline",
-        })
-        return
-      }
-      const requestUpdated = {
-        ...this.$props.request,
-        name: this.$data.requestUpdateData.name || this.$props.request.name,
-      }
-
-      editGraphqlRequest(this.folderPath, this.requestIndex, requestUpdated)
-
-      this.hideModal()
-    },
-    hideModal() {
-      this.requestUpdateData = { name: null }
-      this.$emit("hide-modal")
-    },
-  },
-})
-</script>

components/collections/graphql/Folder.vue

@@ -1,233 +0,0 @@
-<template>
-  <div class="flex flex-col" :class="[{ 'bg-primaryLight': dragging }]">
-    <div
-      class="flex items-center group"
-      @dragover.prevent
-      @drop.prevent="dropEvent"
-      @dragover="dragging = true"
-      @drop="dragging = false"
-      @dragleave="dragging = false"
-      @dragend="dragging = false"
-    >
-      <span
-        class="cursor-pointer flex px-4 justify-center items-center"
-        @click="toggleShowChildren()"
-      >
-        <i class="material-icons" :class="{ 'text-green-500': isSelected }">
-          {{ getCollectionIcon }}
-        </i>
-      </span>
-      <span
-        class="
-          cursor-pointer
-          flex flex-1
-          min-w-0
-          py-2
-          pr-2
-          transition
-          group-hover:text-secondaryDark
-        "
-        @click="toggleShowChildren()"
-      >
-        <span class="truncate">
-          {{ folder.name ? folder.name : folder.title }}
-        </span>
-      </span>
-      <div class="flex">
-        <ButtonSecondary
-          v-tippy="{ theme: 'tooltip' }"
-          icon="create_new_folder"
-          :title="$t('folder.new')"
-          class="hidden group-hover:inline-flex"
-          @click.native="$emit('add-folder', { folder, path: folderPath })"
-        />
-        <span>
-          <tippy
-            ref="options"
-            interactive
-            trigger="click"
-            theme="popover"
-            arrow
-          >
-            <template #trigger>
-              <ButtonSecondary
-                v-tippy="{ theme: 'tooltip' }"
-                :title="$t('action.more')"
-                icon="more_vert"
-              />
-            </template>
-            <SmartItem
-              icon="create_new_folder"
-              :label="$t('folder.new')"
-              @click.native="
-                $emit('add-folder', { folder, path: folderPath })
-                $refs.options.tippy().hide()
-              "
-            />
-            <SmartItem
-              icon="edit"
-              :label="$t('action.edit')"
-              @click.native="
-                $emit('edit-folder', { folder, folderPath })
-                $refs.options.tippy().hide()
-              "
-            />
-            <SmartItem
-              icon="delete"
-              color="red"
-              :label="$t('action.delete')"
-              @click.native="
-                confirmRemove = true
-                $refs.options.tippy().hide()
-              "
-            />
-          </tippy>
-        </span>
-      </div>
-    </div>
-    <div v-if="showChildren || isFiltered">
-      <CollectionsGraphqlFolder
-        v-for="(subFolder, subFolderIndex) in folder.folders"
-        :key="`subFolder-${subFolderIndex}`"
-        class="border-l border-dividerLight ml-6"
-        :picked="picked"
-        :saving-mode="savingMode"
-        :folder="subFolder"
-        :folder-index="subFolderIndex"
-        :folder-path="`${folderPath}/${subFolderIndex}`"
-        :collection-index="collectionIndex"
-        :doc="doc"
-        :is-filtered="isFiltered"
-        @add-folder="$emit('add-folder', $event)"
-        @edit-folder="$emit('edit-folder', $event)"
-        @edit-request="$emit('edit-request', $event)"
-        @select="$emit('select', $event)"
-      />
-      <CollectionsGraphqlRequest
-        v-for="(request, index) in folder.requests"
-        :key="`request-${index}`"
-        class="border-l border-dividerLight ml-6"
-        :picked="picked"
-        :saving-mode="savingMode"
-        :request="request"
-        :collection-index="collectionIndex"
-        :folder-index="folderIndex"
-        :folder-path="folderPath"
-        :folder-name="folder.name"
-        :request-index="index"
-        :doc="doc"
-        @edit-request="$emit('edit-request', $event)"
-        @select="$emit('select', $event)"
-      />
-      <div
-        v-if="
-          folder.folders &&
-          folder.folders.length === 0 &&
-          folder.requests &&
-          folder.requests.length === 0
-        "
-        class="
-          border-l border-dividerLight
-          flex flex-col
-          text-secondaryLight
-          ml-6
-          p-4
-          items-center
-          justify-center
-        "
-      >
-        <i class="opacity-75 pb-2 material-icons">folder_open</i>
-        <span class="text-center">
-          {{ $t("empty.folder") }}
-        </span>
-      </div>
-    </div>
-    <SmartConfirmModal
-      :show="confirmRemove"
-      :title="$t('confirm.remove_folder')"
-      @hide-modal="confirmRemove = false"
-      @resolve="removeFolder"
-    />
-  </div>
-</template>
-
-<script lang="ts">
-import { defineComponent } from "@nuxtjs/composition-api"
-import { removeGraphqlFolder, moveGraphqlRequest } from "~/newstore/collections"
-
-export default defineComponent({
-  name: "Folder",
-  props: {
-    picked: { type: Object, default: null },
-    // Whether the request is in a selectable mode (activates 'select' event)
-    savingMode: { type: Boolean, default: false },
-    folder: { type: Object, default: () => {} },
-    folderIndex: { type: Number, default: null },
-    collectionIndex: { type: Number, default: null },
-    folderPath: { type: String, default: null },
-    doc: Boolean,
-    isFiltered: Boolean,
-  },
-  data() {
-    return {
-      showChildren: false,
-      dragging: false,
-      confirmRemove: false,
-    }
-  },
-  computed: {
-    isSelected(): boolean {
-      return (
-        this.picked &&
-        this.picked.pickedType === "gql-my-folder" &&
-        this.picked.folderPath === this.folderPath
-      )
-    },
-    getCollectionIcon() {
-      if (this.isSelected) return "check_circle_outline"
-      else if (!this.showChildren && !this.isFiltered) return "folder"
-      else if (this.showChildren || this.isFiltered) return "folder_open"
-      else return "folder"
-    },
-  },
-  methods: {
-    pick() {
-      this.$emit("select", {
-        picked: {
-          pickedType: "gql-my-folder",
-          folderPath: this.folderPath,
-        },
-      })
-    },
-    toggleShowChildren() {
-      if (this.savingMode) {
-        this.pick()
-      }
-
-      this.showChildren = !this.showChildren
-    },
-    removeFolder() {
-      // Cancel pick if the picked folder is deleted
-      if (
-        this.picked &&
-        this.picked.pickedType === "gql-my-folder" &&
-        this.picked.folderPath === this.folderPath
-      ) {
-        this.$emit("select", { picked: null })
-      }
-
-      removeGraphqlFolder(this.folderPath)
-      this.$toast.success(this.$t("state.deleted").toString(), {
-        icon: "delete",
-      })
-    },
-    dropEvent({ dataTransfer }: any) {
-      this.dragging = !this.dragging
-      const folderPath = dataTransfer.getData("folderPath")
-      const requestIndex = dataTransfer.getData("requestIndex")
-
-      moveGraphqlRequest(folderPath, requestIndex, this.folderPath)
-    },
-  },
-})
-</script>

components/collections/graphql/ImportExport.vue

@@ -1,398 +0,0 @@
-<template>
-  <SmartModal
-    v-if="show"
-    :title="`${$t('modal.import_export')} ${$t('modal.collections')}`"
-    @close="hideModal"
-  >
-    <template #actions>
-      <span>
-        <tippy ref="options" interactive trigger="click" theme="popover" arrow>
-          <template #trigger>
-            <ButtonSecondary
-              v-tippy="{ theme: 'tooltip' }"
-              :title="$t('action.more')"
-              class="rounded"
-              icon="more_vert"
-            />
-          </template>
-          <SmartItem
-            icon="assignment_returned"
-            :label="$t('import.from_gist')"
-            @click.native="
-              readCollectionGist
-              $refs.options.tippy().hide()
-            "
-          />
-          <span
-            v-tippy="{ theme: 'tooltip' }"
-            :title="
-              !currentUser
-                ? $t('export.require_github')
-                : currentUser.provider !== 'github.com'
-                ? $t('export.require_github')
-                : null
-            "
-          >
-            <SmartItem
-              :disabled="
-                !currentUser
-                  ? true
-                  : currentUser.provider !== 'github.com'
-                  ? true
-                  : false
-              "
-              icon="assignment_turned_in"
-              :label="$t('export.create_secret_gist')"
-              @click.native="
-                createCollectionGist()
-                $refs.options.tippy().hide()
-              "
-            />
-          </span>
-        </tippy>
-      </span>
-    </template>
-    <template #body>
-      <div class="flex flex-col space-y-2">
-        <SmartItem
-          v-tippy="{ theme: 'tooltip' }"
-          :title="$t('action.replace_current')"
-          icon="folder_special"
-          :label="$t('action.replace_json')"
-          @click.native="openDialogChooseFileToReplaceWith"
-        />
-        <input
-          ref="inputChooseFileToReplaceWith"
-          class="input"
-          type="file"
-          accept="application/json"
-          @change="replaceWithJSON"
-        />
-        <SmartItem
-          v-tippy="{ theme: 'tooltip' }"
-          :title="$t('action.preserve_current')"
-          icon="create_new_folder"
-          :label="$t('import.json')"
-          @click.native="openDialogChooseFileToImportFrom"
-        />
-        <input
-          ref="inputChooseFileToImportFrom"
-          class="input"
-          type="file"
-          accept="application/json"
-          @change="importFromJSON"
-        />
-        <SmartItem
-          v-tippy="{ theme: 'tooltip' }"
-          :title="$t('action.download_file')"
-          icon="drive_file_move"
-          :label="$t('export.as_json')"
-          @click.native="exportJSON"
-        />
-      </div>
-    </template>
-  </SmartModal>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-import { currentUser$ } from "~/helpers/fb/auth"
-import { useReadonlyStream } from "~/helpers/utils/composables"
-import {
-  graphqlCollections$,
-  setGraphqlCollections,
-  appendGraphqlCollections,
-} from "~/newstore/collections"
-
-export default defineComponent({
-  props: {
-    show: Boolean,
-  },
-  setup() {
-    return {
-      collections: useReadonlyStream(graphqlCollections$, []),
-      currentUser: useReadonlyStream(currentUser$, null),
-    }
-  },
-  computed: {
-    collectionJson() {
-      return JSON.stringify(this.collections, null, 2)
-    },
-  },
-  methods: {
-    async createCollectionGist() {
-      await this.$axios
-        .$post(
-          "https://api.github.com/gists",
-          {
-            files: {
-              "hoppscotch-collections.json": {
-                content: this.collectionJson,
-              },
-            },
-          },
-          {
-            headers: {
-              Authorization: `token ${this.currentUser.accessToken}`,
-              Accept: "application/vnd.github.v3+json",
-            },
-          }
-        )
-        .then((res) => {
-          this.$toast.success(this.$t("export.gist_created"), {
-            icon: "done",
-          })
-          window.open(res.html_url)
-        })
-        .catch((e) => {
-          this.$toast.error(this.$t("error.something_went_wrong"), {
-            icon: "error_outline",
-          })
-          console.error(e)
-        })
-    },
-    async readCollectionGist() {
-      const gist = prompt(this.$t("import.gist_url"))
-      if (!gist) return
-      await this.$axios
-        .$get(`https://api.github.com/gists/${gist.split("/").pop()}`, {
-          headers: {
-            Accept: "application/vnd.github.v3+json",
-          },
-        })
-        .then(({ files }) => {
-          const collections = JSON.parse(Object.values(files)[0].content)
-          setGraphqlCollections(collections)
-          this.fileImported()
-        })
-        .catch((e) => {
-          this.failedImport()
-          console.error(e)
-        })
-    },
-    hideModal() {
-      this.$emit("hide-modal")
-    },
-    openDialogChooseFileToReplaceWith() {
-      this.$refs.inputChooseFileToReplaceWith.click()
-    },
-    openDialogChooseFileToImportFrom() {
-      this.$refs.inputChooseFileToImportFrom.click()
-    },
-    replaceWithJSON() {
-      const reader = new FileReader()
-      reader.onload = ({ target }) => {
-        const content = target.result
-        let collections = JSON.parse(content)
-        if (collections[0]) {
-          const [name, folders, requests] = Object.keys(collections[0])
-          if (
-            name === "name" &&
-            folders === "folders" &&
-            requests === "requests"
-          ) {
-            // Do nothing
-          }
-        } else if (
-          collections.info &&
-          collections.info.schema.includes("v2.1.0")
-        ) {
-          collections = [this.parsePostmanCollection(collections)]
-        } else {
-          this.failedImport()
-          return
-        }
-        setGraphqlCollections(collections)
-        this.fileImported()
-      }
-      reader.readAsText(this.$refs.inputChooseFileToReplaceWith.files[0])
-      this.$refs.inputChooseFileToReplaceWith.value = ""
-    },
-    importFromJSON() {
-      const reader = new FileReader()
-      reader.onload = ({ target }) => {
-        const content = target.result
-        let collections = JSON.parse(content)
-        if (collections[0]) {
-          const [name, folders, requests] = Object.keys(collections[0])
-          if (
-            name === "name" &&
-            folders === "folders" &&
-            requests === "requests"
-          ) {
-            // Do nothing
-          }
-        } else if (
-          collections.info &&
-          collections.info.schema.includes("v2.1.0")
-        ) {
-          // replace the variables, postman uses {{var}}, Hoppscotch uses <<var>>
-          collections = JSON.parse(
-            content.replaceAll(/{{([a-z]+)}}/gi, "<<$1>>")
-          )
-          collections = [this.parsePostmanCollection(collections)]
-        } else {
-          this.failedImport()
-          return
-        }
-        appendGraphqlCollections(collections)
-        this.fileImported()
-      }
-      reader.readAsText(this.$refs.inputChooseFileToImportFrom.files[0])
-      this.$refs.inputChooseFileToImportFrom.value = ""
-    },
-    exportJSON() {
-      const dataToWrite = this.collectionJson
-      const file = new Blob([dataToWrite], { type: "application/json" })
-      const a = document.createElement("a")
-      const url = URL.createObjectURL(file)
-      a.href = url
-      // TODO get uri from meta
-      a.download = `${url.split("/").pop().split("#")[0].split("?")[0]}`
-      document.body.appendChild(a)
-      a.click()
-      this.$toast.success(this.$t("state.download_started"), {
-        icon: "downloading",
-      })
-      setTimeout(() => {
-        document.body.removeChild(a)
-        URL.revokeObjectURL(url)
-      }, 1000)
-    },
-    fileImported() {
-      this.$toast.success(this.$t("state.file_imported"), {
-        icon: "folder_shared",
-      })
-    },
-    failedImport() {
-      this.$toast.error(this.$t("import.failed"), {
-        icon: "error_outline",
-      })
-    },
-    parsePostmanCollection({ info, name, item }) {
-      const hoppscotchCollection = {
-        name: "",
-        folders: [],
-        requests: [],
-      }
-
-      hoppscotchCollection.name = info ? info.name : name
-
-      if (item && item.length > 0) {
-        for (const collectionItem of item) {
-          if (collectionItem.request) {
-            if (
-              Object.prototype.hasOwnProperty.call(
-                hoppscotchCollection,
-                "folders"
-              )
-            ) {
-              hoppscotchCollection.name = info ? info.name : name
-              hoppscotchCollection.requests.push(
-                this.parsePostmanRequest(collectionItem)
-              )
-            } else {
-              hoppscotchCollection.name = name || ""
-              hoppscotchCollection.requests.push(
-                this.parsePostmanRequest(collectionItem)
-              )
-            }
-          } else if (this.hasFolder(collectionItem)) {
-            hoppscotchCollection.folders.push(
-              this.parsePostmanCollection(collectionItem)
-            )
-          } else {
-            hoppscotchCollection.requests.push(
-              this.parsePostmanRequest(collectionItem)
-            )
-          }
-        }
-      }
-      return hoppscotchCollection
-    },
-    parsePostmanRequest({ name, request }) {
-      const pwRequest = {
-        url: "",
-        path: "",
-        method: "",
-        auth: "",
-        httpUser: "",
-        httpPassword: "",
-        passwordFieldType: "password",
-        bearerToken: "",
-        headers: [],
-        params: [],
-        bodyParams: [],
-        rawParams: "",
-        rawInput: false,
-        contentType: "",
-        requestType: "",
-        name: "",
-      }
-
-      pwRequest.name = name
-      const requestObjectUrl = request.url.raw.match(
-        /^(.+:\/\/[^/]+|{[^/]+})(\/[^?]+|).*$/
-      )
-      if (requestObjectUrl) {
-        pwRequest.url = requestObjectUrl[1]
-        pwRequest.path = requestObjectUrl[2] ? requestObjectUrl[2] : ""
-      }
-      pwRequest.method = request.method
-      const itemAuth = request.auth ? request.auth : ""
-      const authType = itemAuth ? itemAuth.type : ""
-      if (authType === "basic") {
-        pwRequest.auth = "Basic Auth"
-        pwRequest.httpUser =
-          itemAuth.basic[0].key === "username"
-            ? itemAuth.basic[0].value
-            : itemAuth.basic[1].value
-        pwRequest.httpPassword =
-          itemAuth.basic[0].key === "password"
-            ? itemAuth.basic[0].value
-            : itemAuth.basic[1].value
-      } else if (authType === "oauth2") {
-        pwRequest.auth = "OAuth 2.0"
-        pwRequest.bearerToken =
-          itemAuth.oauth2[0].key === "accessToken"
-            ? itemAuth.oauth2[0].value
-            : itemAuth.oauth2[1].value
-      } else if (authType === "bearer") {
-        pwRequest.auth = "Bearer Token"
-        pwRequest.bearerToken = itemAuth.bearer[0].value
-      }
-      const requestObjectHeaders = request.header
-      if (requestObjectHeaders) {
-        pwRequest.headers = requestObjectHeaders
-        for (const header of pwRequest.headers) {
-          delete header.name
-          delete header.type
-        }
-      }
-      const requestObjectParams = request.url.query
-      if (requestObjectParams) {
-        pwRequest.params = requestObjectParams
-        for (const param of pwRequest.params) {
-          delete param.disabled
-        }
-      }
-      if (request.body) {
-        if (request.body.mode === "urlencoded") {
-          const params = request.body.urlencoded
-          pwRequest.bodyParams = params || []
-          for (const param of pwRequest.bodyParams) {
-            delete param.type
-          }
-        } else if (request.body.mode === "raw") {
-          pwRequest.rawInput = true
-          pwRequest.rawParams = request.body.raw
-        }
-      }
-      return pwRequest
-    },
-    hasFolder(item) {
-      return Object.prototype.hasOwnProperty.call(item, "item")
-    },
-  },
-})
-</script>

components/collections/graphql/Request.vue

@@ -1,183 +0,0 @@
-<template>
-  <div class="flex flex-col" :class="[{ 'bg-primaryLight': dragging }]">
-    <div
-      class="flex items-center group"
-      draggable="true"
-      @dragstart="dragStart"
-      @dragover.stop
-      @dragleave="dragging = false"
-      @dragend="dragging = false"
-    >
-      <span
-        class="
-          cursor-pointer
-          flex
-          px-2
-          w-16
-          justify-center
-          items-center
-          truncate
-        "
-        @click="!doc ? selectRequest() : {}"
-      >
-        <i class="material-icons" :class="{ 'text-green-500': isSelected }">
-          {{ isSelected ? "check_circle_outline" : "description" }}
-        </i>
-      </span>
-      <span
-        class="
-          cursor-pointer
-          flex flex-1
-          min-w-0
-          py-2
-          pr-2
-          transition
-          group-hover:text-secondaryDark
-        "
-        @click="!doc ? selectRequest() : {}"
-      >
-        <span class="truncate"> {{ request.name }} </span>
-      </span>
-      <div class="flex">
-        <ButtonSecondary
-          v-if="!savingMode"
-          v-tippy="{ theme: 'tooltip' }"
-          icon="replay"
-          :title="$t('action.restore')"
-          class="hidden group-hover:inline-flex"
-          @click.native="!doc ? selectRequest() : {}"
-        />
-        <span>
-          <tippy
-            ref="options"
-            interactive
-            trigger="click"
-            theme="popover"
-            arrow
-          >
-            <template #trigger>
-              <ButtonSecondary
-                v-tippy="{ theme: 'tooltip' }"
-                :title="$t('action.more')"
-                icon="more_vert"
-              />
-            </template>
-            <SmartItem
-              icon="edit"
-              :label="$t('action.edit')"
-              @click.native="
-                $emit('edit-request', {
-                  request,
-                  requestIndex,
-                  folderPath,
-                })
-                $refs.options.tippy().hide()
-              "
-            />
-            <SmartItem
-              icon="delete"
-              color="red"
-              :label="$t('action.delete')"
-              @click.native="
-                confirmRemove = true
-                $refs.options.tippy().hide()
-              "
-            />
-          </tippy>
-        </span>
-      </div>
-    </div>
-    <SmartConfirmModal
-      :show="confirmRemove"
-      :title="$t('confirm.remove_request')"
-      @hide-modal="confirmRemove = false"
-      @resolve="removeRequest"
-    />
-  </div>
-</template>
-
-<script lang="ts">
-import { defineComponent, PropType } from "@nuxtjs/composition-api"
-import { HoppGQLRequest, makeGQLRequest } from "~/helpers/types/HoppGQLRequest"
-import { removeGraphqlRequest } from "~/newstore/collections"
-import { setGQLSession } from "~/newstore/GQLSession"
-
-export default defineComponent({
-  props: {
-    // Whether the object is selected (show the tick mark)
-    picked: { type: Object, default: null },
-    // Whether the request is being saved (activate 'select' event)
-    savingMode: { type: Boolean, default: false },
-    request: { type: Object as PropType<HoppGQLRequest>, default: () => {} },
-    folderPath: { type: String, default: null },
-    requestIndex: { type: Number, default: null },
-    doc: Boolean,
-  },
-  data() {
-    return {
-      dragging: false,
-      confirmRemove: false,
-    }
-  },
-  computed: {
-    isSelected(): boolean {
-      return (
-        this.picked &&
-        this.picked.pickedType === "gql-my-request" &&
-        this.picked.folderPath === this.folderPath &&
-        this.picked.requestIndex === this.requestIndex
-      )
-    },
-  },
-  methods: {
-    pick() {
-      this.$emit("select", {
-        picked: {
-          pickedType: "gql-my-request",
-          folderPath: this.folderPath,
-          requestIndex: this.requestIndex,
-        },
-      })
-    },
-    selectRequest() {
-      if (this.savingMode) {
-        this.pick()
-      } else {
-        setGQLSession({
-          request: makeGQLRequest({
-            name: this.$props.request.name,
-            url: this.$props.request.url,
-            query: this.$props.request.query,
-            headers: this.$props.request.headers,
-            variables: this.$props.request.variables,
-          }),
-          schema: "",
-          response: "",
-        })
-      }
-    },
-    dragStart({ dataTransfer }: any) {
-      this.dragging = !this.dragging
-
-      dataTransfer.setData("folderPath", this.folderPath)
-      dataTransfer.setData("requestIndex", this.requestIndex)
-    },
-    removeRequest() {
-      // Cancel pick if the picked request is deleted
-      if (
-        this.picked &&
-        this.picked.pickedType === "gql-my-request" &&
-        this.picked.folderPath === this.folderPath &&
-        this.picked.requestIndex === this.requestIndex
-      ) {
-        this.$emit("select", { picked: null })
-      }
-
-      removeGraphqlRequest(this.folderPath, this.requestIndex)
-      this.$toast.success(this.$t("state.deleted").toString(), {
-        icon: "delete",
-      })
-    },
-  },
-})
-</script>

components/collections/graphql/index.vue

@@ -1,282 +0,0 @@
-<template>
-  <AppSection
-    label="collections"
-    :class="{ 'rounded border border-divider': savingMode }"
-  >
-    <div
-      class="
-        divide-y divide-dividerLight
-        border-b border-dividerLight
-        flex flex-col
-        top-sidebarPrimaryStickyFold
-        z-10
-        sticky
-      "
-      :class="{ 'bg-primary': !savingMode }"
-    >
-      <div v-if="showCollActions" class="search-wrapper">
-        <input
-          v-model="filterText"
-          type="search"
-          :placeholder="$t('action.search')"
-          class="bg-transparent flex w-full py-2 pr-2 pl-10"
-        />
-      </div>
-      <div class="flex flex-1 justify-between">
-        <ButtonSecondary
-          icon="add"
-          :label="$t('action.new')"
-          class="rounded-none"
-          @click.native="displayModalAdd(true)"
-        />
-        <div class="flex">
-          <ButtonSecondary
-            v-tippy="{ theme: 'tooltip' }"
-            to="https://docs.hoppscotch.io/features/collections"
-            blank
-            :title="$t('app.wiki')"
-            icon="help_outline"
-          />
-          <ButtonSecondary
-            v-if="showCollActions"
-            v-tippy="{ theme: 'tooltip' }"
-            :title="$t('modal.import_export')"
-            icon="import_export"
-            @click.native="displayModalImportExport(true)"
-          />
-        </div>
-      </div>
-    </div>
-    <div class="flex-col">
-      <CollectionsGraphqlCollection
-        v-for="(collection, index) in filteredCollections"
-        :key="`collection-${index}`"
-        :picked="picked"
-        :name="collection.name"
-        :collection-index="index"
-        :collection="collection"
-        :doc="doc"
-        :is-filtered="filterText.length > 0"
-        :saving-mode="savingMode"
-        @edit-collection="editCollection(collection, index)"
-        @add-folder="addFolder($event)"
-        @edit-folder="editFolder($event)"
-        @edit-request="editRequest($event)"
-        @select-collection="$emit('use-collection', collection)"
-        @select="$emit('select', $event)"
-      />
-    </div>
-    <div
-      v-if="collections.length === 0"
-      class="flex flex-col text-secondaryLight p-4 items-center justify-center"
-    >
-      <span class="text-center pb-4">
-        {{ $t("empty.collections") }}
-      </span>
-      <ButtonSecondary
-        :label="$t('add.new')"
-        filled
-        @click.native="displayModalAdd(true)"
-      />
-    </div>
-    <div
-      v-if="!(filteredCollections.length !== 0 || collections.length === 0)"
-      class="flex flex-col text-secondaryLight p-4 items-center justify-center"
-    >
-      <i class="opacity-75 pb-2 material-icons">manage_search</i>
-      <span class="text-center">
-        {{ $t("state.nothing_found") }} "{{ filterText }}"
-      </span>
-    </div>
-    <CollectionsGraphqlAdd
-      :show="showModalAdd"
-      @hide-modal="displayModalAdd(false)"
-    />
-    <CollectionsGraphqlEdit
-      :show="showModalEdit"
-      :editing-collection="editingCollection"
-      :editing-collection-index="editingCollectionIndex"
-      @hide-modal="displayModalEdit(false)"
-    />
-    <CollectionsGraphqlAddFolder
-      :show="showModalAddFolder"
-      :folder-path="editingFolderPath"
-      @add-folder="onAddFolder($event)"
-      @hide-modal="displayModalAddFolder(false)"
-    />
-    <CollectionsGraphqlEditFolder
-      :show="showModalEditFolder"
-      :collection-index="editingCollectionIndex"
-      :folder="editingFolder"
-      :folder-index="editingFolderIndex"
-      :folder-path="editingFolderPath"
-      @hide-modal="displayModalEditFolder(false)"
-    />
-    <CollectionsGraphqlEditRequest
-      :show="showModalEditRequest"
-      :folder-path="editingFolderPath"
-      :request="editingRequest"
-      :request-index="editingRequestIndex"
-      @hide-modal="displayModalEditRequest(false)"
-    />
-    <CollectionsGraphqlImportExport
-      :show="showModalImportExport"
-      @hide-modal="displayModalImportExport(false)"
-    />
-  </AppSection>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-import clone from "lodash/clone"
-import { useReadonlyStream } from "~/helpers/utils/composables"
-import { graphqlCollections$, addGraphqlFolder } from "~/newstore/collections"
-
-export default defineComponent({
-  props: {
-    // Whether to activate the ability to pick items (activates 'select' events)
-    savingMode: { type: Boolean, default: false },
-    doc: { type: Boolean, default: false },
-    picked: { type: Object, default: null },
-    // Whether to show the 'New' and 'Import/Export' actions
-    showCollActions: { type: Boolean, default: true },
-  },
-  setup() {
-    return {
-      collections: useReadonlyStream(graphqlCollections$, []),
-    }
-  },
-  data() {
-    return {
-      showModalAdd: false,
-      showModalEdit: false,
-      showModalImportExport: false,
-      showModalAddFolder: false,
-      showModalEditFolder: false,
-      showModalEditRequest: false,
-      editingCollection: undefined,
-      editingCollectionIndex: undefined,
-      editingFolder: undefined,
-      editingFolderName: undefined,
-      editingFolderIndex: undefined,
-      editingFolderPath: undefined,
-      editingRequest: undefined,
-      editingRequestIndex: undefined,
-      filterText: "",
-    }
-  },
-  computed: {
-    filteredCollections() {
-      const collections = clone(this.collections)
-
-      if (!this.filterText) return collections
-
-      const filterText = this.filterText.toLowerCase()
-      const filteredCollections = []
-
-      for (const collection of collections) {
-        const filteredRequests = []
-        const filteredFolders = []
-        for (const request of collection.requests) {
-          if (request.name.toLowerCase().includes(filterText))
-            filteredRequests.push(request)
-        }
-        for (const folder of collection.folders) {
-          const filteredFolderRequests = []
-          for (const request of folder.requests) {
-            if (request.name.toLowerCase().includes(filterText))
-              filteredFolderRequests.push(request)
-          }
-          if (filteredFolderRequests.length > 0) {
-            const filteredFolder = Object.assign({}, folder)
-            filteredFolder.requests = filteredFolderRequests
-            filteredFolders.push(filteredFolder)
-          }
-        }
-
-        if (filteredRequests.length + filteredFolders.length > 0) {
-          const filteredCollection = Object.assign({}, collection)
-          filteredCollection.requests = filteredRequests
-          filteredCollection.folders = filteredFolders
-          filteredCollections.push(filteredCollection)
-        }
-      }
-
-      return filteredCollections
-    },
-  },
-  methods: {
-    displayModalAdd(shouldDisplay) {
-      this.showModalAdd = shouldDisplay
-    },
-    displayModalEdit(shouldDisplay) {
-      this.showModalEdit = shouldDisplay
-
-      if (!shouldDisplay) this.resetSelectedData()
-    },
-    displayModalImportExport(shouldDisplay) {
-      this.showModalImportExport = shouldDisplay
-    },
-    displayModalAddFolder(shouldDisplay) {
-      this.showModalAddFolder = shouldDisplay
-
-      if (!shouldDisplay) this.resetSelectedData()
-    },
-    displayModalEditFolder(shouldDisplay) {
-      this.showModalEditFolder = shouldDisplay
-
-      if (!shouldDisplay) this.resetSelectedData()
-    },
-    displayModalEditRequest(shouldDisplay) {
-      this.showModalEditRequest = shouldDisplay
-
-      if (!shouldDisplay) this.resetSelectedData()
-    },
-    editCollection(collection, collectionIndex) {
-      this.$data.editingCollection = collection
-      this.$data.editingCollectionIndex = collectionIndex
-      this.displayModalEdit(true)
-    },
-    onAddFolder({ name, path }) {
-      addGraphqlFolder(name, path)
-      this.displayModalAddFolder(false)
-    },
-    addFolder(payload) {
-      const { path } = payload
-      this.$data.editingFolderPath = path
-      this.displayModalAddFolder(true)
-    },
-    editFolder(payload) {
-      const { folder, folderPath } = payload
-      this.editingFolder = folder
-      this.editingFolderPath = folderPath
-      this.displayModalEditFolder(true)
-    },
-    editRequest(payload) {
-      const {
-        collectionIndex,
-        folderIndex,
-        folderName,
-        request,
-        requestIndex,
-        folderPath,
-      } = payload
-      this.$data.editingFolderPath = folderPath
-      this.$data.editingCollectionIndex = collectionIndex
-      this.$data.editingFolderIndex = folderIndex
-      this.$data.editingFolderName = folderName
-      this.$data.editingRequest = request
-      this.$data.editingRequestIndex = requestIndex
-      this.displayModalEditRequest(true)
-    },
-    resetSelectedData() {
-      this.$data.editingCollection = undefined
-      this.$data.editingCollectionIndex = undefined
-      this.$data.editingFolder = undefined
-      this.$data.editingFolderIndex = undefined
-      this.$data.editingRequest = undefined
-      this.$data.editingRequestIndex = undefined
-    },
-  },
-})
-</script>

components/collections/index.vue

@@ -1,681 +0,0 @@
-<template>
-  <AppSection
-    label="collections"
-    :class="{ 'rounded border border-divider': saveRequest }"
-  >
-    <div
-      class="
-        divide-y divide-dividerLight
-        bg-primary
-        border-b border-dividerLight
-        rounded-t
-        flex flex-col
-        top-0
-        z-10
-        sticky
-      "
-      :class="{ '!top-sidebarPrimaryStickyFold': !saveRequest && !doc }"
-    >
-      <div v-if="!saveRequest" class="search-wrapper">
-        <input
-          v-model="filterText"
-          type="search"
-          :placeholder="$t('action.search')"
-          class="bg-transparent flex w-full py-2 pr-2 pl-10"
-        />
-      </div>
-      <CollectionsChooseType
-        :collections-type="collectionsType"
-        :show="showTeamCollections"
-        :doc="doc"
-        @update-collection-type="updateCollectionType"
-        @update-selected-team="updateSelectedTeam"
-      />
-      <div class="flex flex-1 justify-between">
-        <ButtonSecondary
-          v-if="
-            collectionsType.type == 'team-collections' &&
-            (collectionsType.selectedTeam == undefined ||
-              collectionsType.selectedTeam.myRole == 'VIEWER')
-          "
-          v-tippy="{ theme: 'tooltip' }"
-          disabled
-          class="rounded-none"
-          icon="add"
-          :title="$t('team.no_access')"
-          :label="$t('action.new')"
-        />
-        <ButtonSecondary
-          v-else
-          icon="add"
-          :label="$t('action.new')"
-          class="rounded-none"
-          @click.native="displayModalAdd(true)"
-        />
-        <span class="flex">
-          <ButtonSecondary
-            v-tippy="{ theme: 'tooltip' }"
-            to="https://docs.hoppscotch.io/features/collections"
-            blank
-            :title="$t('app.wiki')"
-            icon="help_outline"
-          />
-          <ButtonSecondary
-            v-if="!saveRequest"
-            v-tippy="{ theme: 'tooltip' }"
-            :disabled="
-              collectionsType.type == 'team-collections' &&
-              collectionsType.selectedTeam == undefined
-            "
-            icon="import_export"
-            :title="$t('modal.import_export')"
-            @click.native="displayModalImportExport(true)"
-          />
-        </span>
-      </div>
-    </div>
-    <div class="flex flex-col">
-      <component
-        :is="
-          collectionsType.type == 'my-collections'
-            ? 'CollectionsMyCollection'
-            : 'CollectionsTeamsCollection'
-        "
-        v-for="(collection, index) in filteredCollections"
-        :key="`collection-${index}`"
-        :collection-index="index"
-        :collection="collection"
-        :doc="doc"
-        :is-filtered="filterText.length > 0"
-        :selected="selected.some((coll) => coll == collection)"
-        :save-request="saveRequest"
-        :collections-type="collectionsType"
-        :picked="picked"
-        @edit-collection="editCollection(collection, index)"
-        @add-folder="addFolder($event)"
-        @edit-folder="editFolder($event)"
-        @edit-request="editRequest($event)"
-        @update-team-collections="updateTeamCollections"
-        @select-collection="$emit('use-collection', collection)"
-        @unselect-collection="$emit('remove-collection', collection)"
-        @select="$emit('select', $event)"
-        @expand-collection="expandCollection"
-        @remove-collection="removeCollection"
-        @remove-request="removeRequest"
-      />
-    </div>
-    <div
-      v-if="filteredCollections.length === 0 && filterText.length === 0"
-      class="flex flex-col text-secondaryLight p-4 items-center justify-center"
-    >
-      <span class="text-center pb-4">
-        {{ $t("empty.collections") }}
-      </span>
-      <ButtonSecondary
-        v-if="
-          collectionsType.type == 'team-collections' &&
-          (collectionsType.selectedTeam == undefined ||
-            collectionsType.selectedTeam.myRole == 'VIEWER')
-        "
-        v-tippy="{ theme: 'tooltip' }"
-        :title="$t('team.no_access')"
-        :label="$t('add.new')"
-        filled
-      />
-      <ButtonSecondary
-        v-else
-        :label="$t('add.new')"
-        filled
-        @click.native="displayModalAdd(true)"
-      />
-    </div>
-    <div
-      v-if="filterText.length !== 0 && filteredCollections.length === 0"
-      class="flex flex-col text-secondaryLight p-4 items-center justify-center"
-    >
-      <i class="opacity-75 pb-2 material-icons">manage_search</i>
-      <span class="text-center">
-        {{ $t("state.nothing_found") }} "{{ filterText }}"
-      </span>
-    </div>
-    <CollectionsAdd
-      :show="showModalAdd"
-      @submit="addNewRootCollection"
-      @hide-modal="displayModalAdd(false)"
-    />
-    <CollectionsEdit
-      :show="showModalEdit"
-      :editing-coll-name="editingCollection ? editingCollection.name : ''"
-      :placeholder-coll-name="editingCollection ? editingCollection.name : ''"
-      @hide-modal="displayModalEdit(false)"
-      @submit="updateEditingCollection"
-    />
-    <CollectionsAddFolder
-      :show="showModalAddFolder"
-      :folder="editingFolder"
-      :folder-path="editingFolderPath"
-      @add-folder="onAddFolder($event)"
-      @hide-modal="displayModalAddFolder(false)"
-    />
-    <CollectionsEditFolder
-      :show="showModalEditFolder"
-      @submit="updateEditingFolder"
-      @hide-modal="displayModalEditFolder(false)"
-    />
-    <CollectionsEditRequest
-      :show="showModalEditRequest"
-      :placeholder-req-name="editingRequest ? editingRequest.name : ''"
-      @submit="updateEditingRequest"
-      @hide-modal="displayModalEditRequest(false)"
-    />
-    <CollectionsImportExport
-      :show="showModalImportExport"
-      :collections-type="collectionsType"
-      @hide-modal="displayModalImportExport(false)"
-      @update-team-collections="updateTeamCollections"
-    />
-  </AppSection>
-</template>
-
-<script>
-import gql from "graphql-tag"
-import cloneDeep from "lodash/cloneDeep"
-import { defineComponent } from "@nuxtjs/composition-api"
-import CollectionsMyCollection from "./my/Collection.vue"
-import CollectionsTeamsCollection from "./teams/Collection.vue"
-import { currentUser$ } from "~/helpers/fb/auth"
-import TeamCollectionAdapter from "~/helpers/teams/TeamCollectionAdapter"
-import * as teamUtils from "~/helpers/teams/utils"
-import {
-  restCollections$,
-  addRESTCollection,
-  editRESTCollection,
-  addRESTFolder,
-  removeRESTCollection,
-  editRESTFolder,
-  removeRESTRequest,
-  editRESTRequest,
-} from "~/newstore/collections"
-import {
-  useReadonlyStream,
-  useStreamSubscriber,
-} from "~/helpers/utils/composables"
-
-export default defineComponent({
-  components: {
-    CollectionsMyCollection,
-    CollectionsTeamsCollection,
-  },
-  props: {
-    doc: Boolean,
-    selected: { type: Array, default: () => [] },
-    saveRequest: Boolean,
-    picked: { type: Object, default: () => {} },
-  },
-  setup() {
-    const { subscribeToStream } = useStreamSubscriber()
-
-    return {
-      subscribeTo: subscribeToStream,
-
-      collections: useReadonlyStream(restCollections$, []),
-      currentUser: useReadonlyStream(currentUser$, null),
-    }
-  },
-  data() {
-    return {
-      showModalAdd: false,
-      showModalEdit: false,
-      showModalImportExport: false,
-      showModalAddFolder: false,
-      showModalEditFolder: false,
-      showModalEditRequest: false,
-      editingCollection: undefined,
-      editingCollectionIndex: undefined,
-      editingFolder: undefined,
-      editingFolderName: undefined,
-      editingFolderIndex: undefined,
-      editingFolderPath: undefined,
-      editingRequest: undefined,
-      editingRequestIndex: undefined,
-      filterText: "",
-      collectionsType: {
-        type: "my-collections",
-        selectedTeam: undefined,
-      },
-      teamCollectionAdapter: new TeamCollectionAdapter(null),
-      teamCollectionsNew: [],
-    }
-  },
-  computed: {
-    showTeamCollections() {
-      if (this.currentUser == null) {
-        return false
-      }
-      return true
-    },
-    filteredCollections() {
-      const collections =
-        this.collectionsType.type === "my-collections"
-          ? this.collections
-          : this.teamCollectionsNew
-
-      if (!this.filterText) {
-        return collections
-      }
-
-      if (this.collectionsType.type === "team-collections") {
-        return []
-      }
-
-      const filterText = this.filterText.toLowerCase()
-      const filteredCollections = []
-
-      for (const collection of collections) {
-        const filteredRequests = []
-        const filteredFolders = []
-        for (const request of collection.requests) {
-          if (request.name.toLowerCase().includes(filterText))
-            filteredRequests.push(request)
-        }
-        for (const folder of this.collectionsType.type === "team-collections"
-          ? collection.children
-          : collection.folders) {
-          const filteredFolderRequests = []
-          for (const request of folder.requests) {
-            if (request.name.toLowerCase().includes(filterText))
-              filteredFolderRequests.push(request)
-          }
-          if (filteredFolderRequests.length > 0) {
-            const filteredFolder = Object.assign({}, folder)
-            filteredFolder.requests = filteredFolderRequests
-            filteredFolders.push(filteredFolder)
-          }
-        }
-
-        if (
-          filteredRequests.length + filteredFolders.length > 0 ||
-          collection.name.toLowerCase().includes(filterText)
-        ) {
-          const filteredCollection = Object.assign({}, collection)
-          filteredCollection.requests = filteredRequests
-          filteredCollection.folders = filteredFolders
-          filteredCollections.push(filteredCollection)
-        }
-      }
-
-      return filteredCollections
-    },
-  },
-  watch: {
-    "collectionsType.type": function emitstuff() {
-      this.$emit("update-collection", this.$data.collectionsType.type)
-    },
-    "collectionsType.selectedTeam"(value) {
-      if (value?.id) this.teamCollectionAdapter.changeTeamID(value.id)
-    },
-  },
-  mounted() {
-    this.subscribeTo(this.teamCollectionAdapter.collections$, (colls) => {
-      this.teamCollectionsNew = cloneDeep(colls)
-    })
-  },
-  methods: {
-    updateTeamCollections() {
-      // TODO: Remove this at some point
-    },
-    updateSelectedTeam(newSelectedTeam) {
-      this.collectionsType.selectedTeam = newSelectedTeam
-      this.$emit("update-coll-type", this.collectionsType)
-    },
-    updateCollectionType(newCollectionType) {
-      this.collectionsType.type = newCollectionType
-      this.$emit("update-coll-type", this.collectionsType)
-    },
-    // Intented to be called by the CollectionAdd modal submit event
-    addNewRootCollection(name) {
-      if (this.collectionsType.type === "my-collections") {
-        addRESTCollection({
-          name,
-          folders: [],
-          requests: [],
-        })
-      } else if (
-        this.collectionsType.type === "team-collections" &&
-        this.collectionsType.selectedTeam.myRole !== "VIEWER"
-      ) {
-        teamUtils
-          .createNewRootCollection(
-            this.$apollo,
-            name,
-            this.collectionsType.selectedTeam.id
-          )
-          .then(() => {
-            this.$toast.success(this.$t("collection.created"), {
-              icon: "done",
-            })
-          })
-          .catch((e) => {
-            this.$toast.error(this.$t("error.something_went_wrong"), {
-              icon: "error_outline",
-            })
-            console.error(e)
-          })
-      }
-      this.displayModalAdd(false)
-    },
-    // Intented to be called by CollectionEdit modal submit event
-    updateEditingCollection(newName) {
-      if (!newName) {
-        this.$toast.error(this.$t("collection.invalid_name"), {
-          icon: "error_outline",
-        })
-        return
-      }
-      if (this.collectionsType.type === "my-collections") {
-        const collectionUpdated = {
-          ...this.editingCollection,
-          name: newName,
-        }
-
-        editRESTCollection(this.editingCollectionIndex, collectionUpdated)
-      } else if (
-        this.collectionsType.type === "team-collections" &&
-        this.collectionsType.selectedTeam.myRole !== "VIEWER"
-      ) {
-        teamUtils
-          .renameCollection(this.$apollo, newName, this.editingCollection.id)
-          .then(() => {
-            this.$toast.success(this.$t("collection.renamed"), {
-              icon: "done",
-            })
-          })
-          .catch((e) => {
-            this.$toast.error(this.$t("error.something_went_wrong"), {
-              icon: "error_outline",
-            })
-            console.error(e)
-          })
-      }
-      this.displayModalEdit(false)
-    },
-    // Intended to be called by CollectionEditFolder modal submit event
-    updateEditingFolder(name) {
-      if (this.collectionsType.type === "my-collections") {
-        editRESTFolder(this.editingFolderPath, { ...this.editingFolder, name })
-      } else if (
-        this.collectionsType.type === "team-collections" &&
-        this.collectionsType.selectedTeam.myRole !== "VIEWER"
-      ) {
-        teamUtils
-          .renameCollection(this.$apollo, name, this.editingFolder.id)
-          .then(() => {
-            this.$toast.success(this.$t("folder.renamed"), {
-              icon: "done",
-            })
-          })
-          .catch((e) => {
-            this.$toast.error(this.$t("error.something_went_wrong"), {
-              icon: "error_outline",
-            })
-            console.error(e)
-          })
-      }
-
-      this.displayModalEditFolder(false)
-    },
-    // Intented to by called by CollectionsEditRequest modal submit event
-    updateEditingRequest(requestUpdateData) {
-      const requestUpdated = {
-        ...this.editingRequest,
-        name: requestUpdateData.name || this.editingRequest.name,
-      }
-
-      if (this.collectionsType.type === "my-collections") {
-        editRESTRequest(
-          this.editingFolderPath,
-          this.editingRequestIndex,
-          requestUpdated
-        )
-      } else if (
-        this.collectionsType.type === "team-collections" &&
-        this.collectionsType.selectedTeam.myRole !== "VIEWER"
-      ) {
-        const requestName = requestUpdateData.name || this.editingRequest.name
-        teamUtils
-          .updateRequest(
-            this.$apollo,
-            requestUpdated,
-            requestName,
-            this.editingRequestIndex
-          )
-          .then(() => {
-            this.$toast.success(this.$t("request.renamed"), {
-              icon: "done",
-            })
-            this.$emit("update-team-collections")
-          })
-          .catch((e) => {
-            this.$toast.error(this.$t("error.something_went_wrong"), {
-              icon: "error_outline",
-            })
-            console.error(e)
-          })
-      }
-
-      this.displayModalEditRequest(false)
-    },
-    displayModalAdd(shouldDisplay) {
-      this.showModalAdd = shouldDisplay
-    },
-    displayModalEdit(shouldDisplay) {
-      this.showModalEdit = shouldDisplay
-
-      if (!shouldDisplay) this.resetSelectedData()
-    },
-    displayModalImportExport(shouldDisplay) {
-      this.showModalImportExport = shouldDisplay
-    },
-    displayModalAddFolder(shouldDisplay) {
-      this.showModalAddFolder = shouldDisplay
-
-      if (!shouldDisplay) this.resetSelectedData()
-    },
-    displayModalEditFolder(shouldDisplay) {
-      this.showModalEditFolder = shouldDisplay
-
-      if (!shouldDisplay) this.resetSelectedData()
-    },
-    displayModalEditRequest(shouldDisplay) {
-      this.showModalEditRequest = shouldDisplay
-
-      if (!shouldDisplay) this.resetSelectedData()
-    },
-    editCollection(collection, collectionIndex) {
-      this.$data.editingCollection = collection
-      this.$data.editingCollectionIndex = collectionIndex
-      this.displayModalEdit(true)
-    },
-    onAddFolder({ name, folder, path }) {
-      if (this.collectionsType.type === "my-collections") {
-        addRESTFolder(name, path)
-      } else if (this.collectionsType.type === "team-collections") {
-        if (this.collectionsType.selectedTeam.myRole !== "VIEWER") {
-          this.$apollo
-            .mutate({
-              mutation: gql`
-                mutation CreateChildCollection(
-                  $childTitle: String!
-                  $collectionID: String!
-                ) {
-                  createChildCollection(
-                    childTitle: $childTitle
-                    collectionID: $collectionID
-                  ) {
-                    id
-                  }
-                }
-              `,
-              // Parameters
-              variables: {
-                childTitle: name,
-                collectionID: folder.id,
-              },
-            })
-            .then(() => {
-              this.$toast.success(this.$t("folder.created"), {
-                icon: "done",
-              })
-              this.$emit("update-team-collections")
-            })
-            .catch((e) => {
-              this.$toast.error(this.$t("error.something_went_wrong"), {
-                icon: "error_outline",
-              })
-              console.error(e)
-            })
-        }
-      }
-
-      this.displayModalAddFolder(false)
-    },
-    addFolder(payload) {
-      const { folder, path } = payload
-      this.$data.editingFolder = folder
-      this.$data.editingFolderPath = path
-      this.displayModalAddFolder(true)
-    },
-    editFolder(payload) {
-      const { collectionIndex, folder, folderIndex, folderPath } = payload
-      this.$data.editingCollectionIndex = collectionIndex
-      this.$data.editingFolder = folder
-      this.$data.editingFolderIndex = folderIndex
-      this.$data.editingFolderPath = folderPath
-      this.$data.collectionsType = this.collectionsType
-      this.displayModalEditFolder(true)
-    },
-    editRequest(payload) {
-      const {
-        collectionIndex,
-        folderIndex,
-        folderName,
-        request,
-        requestIndex,
-        folderPath,
-      } = payload
-      this.$data.editingCollectionIndex = collectionIndex
-      this.$data.editingFolderIndex = folderIndex
-      this.$data.editingFolderName = folderName
-      this.$data.editingRequest = request
-      this.$data.editingRequestIndex = requestIndex
-      this.editingFolderPath = folderPath
-      this.$emit("select-request", requestIndex)
-      this.displayModalEditRequest(true)
-    },
-    resetSelectedData() {
-      this.$data.editingCollection = undefined
-      this.$data.editingCollectionIndex = undefined
-      this.$data.editingFolder = undefined
-      this.$data.editingFolderIndex = undefined
-      this.$data.editingRequest = undefined
-      this.$data.editingRequestIndex = undefined
-    },
-    expandCollection(collectionID) {
-      this.teamCollectionAdapter.expandCollection(collectionID)
-    },
-    removeCollection({ collectionsType, collectionIndex, collectionID }) {
-      if (collectionsType.type === "my-collections") {
-        // Cancel pick if picked collection is deleted
-        if (
-          this.picked &&
-          this.picked.pickedType === "my-collection" &&
-          this.picked.collectionIndex === collectionIndex
-        ) {
-          this.$emit("select", { picked: null })
-        }
-
-        removeRESTCollection(collectionIndex)
-        this.$toast.success(this.$t("state.deleted"), {
-          icon: "delete",
-        })
-      } else if (collectionsType.type === "team-collections") {
-        // Cancel pick if picked collection is deleted
-        if (
-          this.picked &&
-          this.picked.pickedType === "teams-collection" &&
-          this.picked.collectionID === collectionID
-        ) {
-          this.$emit("select", { picked: null })
-        }
-
-        if (collectionsType.selectedTeam.myRole !== "VIEWER") {
-          this.$apollo
-            .mutate({
-              // Query
-              mutation: gql`
-                mutation ($collectionID: String!) {
-                  deleteCollection(collectionID: $collectionID)
-                }
-              `,
-              // Parameters
-              variables: {
-                collectionID,
-              },
-            })
-            .then(() => {
-              this.$toast.success(this.$t("state.deleted"), {
-                icon: "delete",
-              })
-            })
-            .catch((e) => {
-              this.$toast.error(this.$t("error.something_went_wrong"), {
-                icon: "error_outline",
-              })
-              console.error(e)
-            })
-        }
-      }
-    },
-    removeRequest({ requestIndex, folderPath }) {
-      if (this.collectionsType.type === "my-collections") {
-        // Cancel pick if the picked item is being deleted
-        if (
-          this.picked &&
-          this.picked.pickedType === "my-request" &&
-          this.picked.folderPath === folderPath &&
-          this.picked.requestIndex === requestIndex
-        ) {
-          this.$emit("select", { picked: null })
-        }
-        removeRESTRequest(folderPath, requestIndex)
-        this.$toast.success(this.$t("state.deleted"), {
-          icon: "delete",
-        })
-      } else if (this.collectionsType.type === "team-collections") {
-        // Cancel pick if the picked item is being deleted
-        if (
-          this.picked &&
-          this.picked.pickedType === "teams-request" &&
-          this.picked.requestID === requestIndex
-        ) {
-          this.$emit("select", { picked: null })
-        }
-
-        teamUtils
-          .deleteRequest(this.$apollo, requestIndex)
-          .then(() => {
-            this.$toast.success(this.$t("state.deleted"), {
-              icon: "delete",
-            })
-          })
-          .catch((e) => {
-            this.$toast.error(this.$t("error.something_went_wrong"), {
-              icon: "error_outline",
-            })
-            console.error(e)
-          })
-      }
-    },
-  },
-})
-</script>

components/collections/my/Collection.vue

@@ -1,252 +0,0 @@
-<template>
-  <div class="flex flex-col" :class="[{ 'bg-primaryLight': dragging }]">
-    <div
-      class="flex items-center group"
-      @dragover.prevent
-      @drop.prevent="dropEvent"
-      @dragover="dragging = true"
-      @drop="dragging = false"
-      @dragleave="dragging = false"
-      @dragend="dragging = false"
-    >
-      <span
-        class="cursor-pointer flex px-4 justify-center items-center"
-        @click="toggleShowChildren()"
-      >
-        <i class="material-icons" :class="{ 'text-green-500': isSelected }">
-          {{ getCollectionIcon }}
-        </i>
-      </span>
-      <span
-        class="
-          cursor-pointer
-          flex flex-1
-          min-w-0
-          py-2
-          pr-2
-          transition
-          group-hover:text-secondaryDark
-        "
-        @click="toggleShowChildren()"
-      >
-        <span class="truncate"> {{ collection.name }} </span>
-      </span>
-      <div class="flex">
-        <ButtonSecondary
-          v-if="doc && !selected"
-          v-tippy="{ theme: 'tooltip' }"
-          :title="$t('import.title')"
-          icon="radio_button_unchecked"
-          color="green"
-          @click.native="$emit('select-collection')"
-        />
-        <ButtonSecondary
-          v-if="doc && selected"
-          v-tippy="{ theme: 'tooltip' }"
-          :title="$t('action.remove')"
-          icon="check_circle_outline"
-          color="green"
-          @click.native="$emit('unselect-collection')"
-        />
-        <ButtonSecondary
-          v-if="!doc"
-          v-tippy="{ theme: 'tooltip' }"
-          icon="create_new_folder"
-          :title="$t('folder.new')"
-          class="hidden group-hover:inline-flex"
-          @click.native="
-            $emit('add-folder', {
-              folder: collection,
-              path: `${collectionIndex}`,
-            })
-          "
-        />
-        <span>
-          <tippy
-            ref="options"
-            interactive
-            trigger="click"
-            theme="popover"
-            arrow
-          >
-            <template #trigger>
-              <ButtonSecondary
-                v-tippy="{ theme: 'tooltip' }"
-                :title="$t('action.more')"
-                icon="more_vert"
-              />
-            </template>
-            <SmartItem
-              icon="create_new_folder"
-              :label="$t('folder.new')"
-              @click.native="
-                $emit('add-folder', {
-                  folder: collection,
-                  path: `${collectionIndex}`,
-                })
-                $refs.options.tippy().hide()
-              "
-            />
-            <SmartItem
-              icon="create"
-              :label="$t('action.edit')"
-              @click.native="
-                $emit('edit-collection')
-                $refs.options.tippy().hide()
-              "
-            />
-            <SmartItem
-              icon="delete"
-              color="red"
-              :label="$t('action.delete')"
-              @click.native="
-                confirmRemove = true
-                $refs.options.tippy().hide()
-              "
-            />
-          </tippy>
-        </span>
-      </div>
-    </div>
-    <div v-if="showChildren || isFiltered">
-      <CollectionsMyFolder
-        v-for="(folder, index) in collection.folders"
-        :key="`folder-${index}`"
-        class="border-l border-dividerLight ml-6"
-        :folder="folder"
-        :folder-index="index"
-        :folder-path="`${collectionIndex}/${index}`"
-        :collection-index="collectionIndex"
-        :doc="doc"
-        :save-request="saveRequest"
-        :collections-type="collectionsType"
-        :is-filtered="isFiltered"
-        :picked="picked"
-        @add-folder="$emit('add-folder', $event)"
-        @edit-folder="$emit('edit-folder', $event)"
-        @edit-request="$emit('edit-request', $event)"
-        @select="$emit('select', $event)"
-        @remove-request="$emit('remove-request', $event)"
-      />
-      <CollectionsMyRequest
-        v-for="(request, index) in collection.requests"
-        :key="`request-${index}`"
-        class="border-l border-dividerLight ml-6"
-        :request="request"
-        :collection-index="collectionIndex"
-        :folder-index="-1"
-        :folder-name="collection.name"
-        :folder-path="collectionIndex.toString()"
-        :request-index="index"
-        :doc="doc"
-        :save-request="saveRequest"
-        :collections-type="collectionsType"
-        :picked="picked"
-        @edit-request="editRequest($event)"
-        @select="$emit('select', $event)"
-        @remove-request="$emit('remove-request', $event)"
-      />
-      <div
-        v-if="
-          (collection.folders == undefined ||
-            collection.folders.length === 0) &&
-          (collection.requests == undefined || collection.requests.length === 0)
-        "
-        class="
-          border-l border-dividerLight
-          flex flex-col
-          text-secondaryLight
-          ml-6
-          p-4
-          items-center
-          justify-center
-        "
-      >
-        <i class="opacity-75 pb-2 material-icons">folder_open</i>
-        <span class="text-center">
-          {{ $t("empty.collection") }}
-        </span>
-      </div>
-    </div>
-    <SmartConfirmModal
-      :show="confirmRemove"
-      :title="$t('confirm.remove_collection')"
-      @hide-modal="confirmRemove = false"
-      @resolve="removeCollection"
-    />
-  </div>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-import { moveRESTRequest } from "~/newstore/collections"
-
-export default defineComponent({
-  props: {
-    collectionIndex: { type: Number, default: null },
-    collection: { type: Object, default: () => {} },
-    doc: Boolean,
-    isFiltered: Boolean,
-    selected: Boolean,
-    saveRequest: Boolean,
-    collectionsType: { type: Object, default: () => {} },
-    picked: { type: Object, default: () => {} },
-  },
-  data() {
-    return {
-      showChildren: false,
-      dragging: false,
-      selectedFolder: {},
-      confirmRemove: false,
-      prevCursor: "",
-      cursor: "",
-      pageNo: 0,
-    }
-  },
-  computed: {
-    isSelected() {
-      return (
-        this.picked &&
-        this.picked.pickedType === "my-collection" &&
-        this.picked.collectionIndex === this.collectionIndex
-      )
-    },
-    getCollectionIcon() {
-      if (this.isSelected) return "check_circle_outline"
-      else if (!this.showChildren && !this.isFiltered) return "folder"
-      else if (this.showChildren || this.isFiltered) return "folder_open"
-      else return "folder"
-    },
-  },
-  methods: {
-    editRequest(event) {
-      this.$emit("edit-request", event)
-    },
-    toggleShowChildren() {
-      if (this.$props.saveRequest)
-        this.$emit("select", {
-          picked: {
-            pickedType: "my-collection",
-            collectionIndex: this.collectionIndex,
-          },
-        })
-
-      this.$emit("expand-collection", this.collection.id)
-      this.showChildren = !this.showChildren
-    },
-    removeCollection() {
-      this.$emit("remove-collection", {
-        collectionsType: this.collectionsType,
-        collectionIndex: this.collectionIndex,
-        collectionID: this.collection.id,
-      })
-    },
-    dropEvent({ dataTransfer }) {
-      this.dragging = !this.dragging
-      const folderPath = dataTransfer.getData("folderPath")
-      const requestIndex = dataTransfer.getData("requestIndex")
-      moveRESTRequest(folderPath, requestIndex, this.collectionIndex.toString())
-    },
-  },
-})
-</script>

components/collections/my/Folder.vue

@@ -1,257 +0,0 @@
-<template>
-  <div class="flex flex-col" :class="[{ 'bg-primaryLight': dragging }]">
-    <div
-      class="flex items-center group"
-      @dragover.prevent
-      @drop.prevent="dropEvent"
-      @dragover="dragging = true"
-      @drop="dragging = false"
-      @dragleave="dragging = false"
-      @dragend="dragging = false"
-    >
-      <span
-        class="cursor-pointer flex px-4 justify-center items-center"
-        @click="toggleShowChildren()"
-      >
-        <i class="material-icons" :class="{ 'text-green-500': isSelected }">
-          {{ getCollectionIcon }}
-        </i>
-      </span>
-      <span
-        class="
-          cursor-pointer
-          flex flex-1
-          min-w-0
-          py-2
-          pr-2
-          transition
-          group-hover:text-secondaryDark
-        "
-        @click="toggleShowChildren()"
-      >
-        <span class="truncate">
-          {{ folder.name ? folder.name : folder.title }}
-        </span>
-      </span>
-      <div class="flex">
-        <ButtonSecondary
-          v-tippy="{ theme: 'tooltip' }"
-          icon="create_new_folder"
-          :title="$t('folder.new')"
-          class="hidden group-hover:inline-flex"
-          @click.native="$emit('add-folder', { folder, path: folderPath })"
-        />
-        <span>
-          <tippy
-            ref="options"
-            interactive
-            trigger="click"
-            theme="popover"
-            arrow
-          >
-            <template #trigger>
-              <ButtonSecondary
-                v-tippy="{ theme: 'tooltip' }"
-                :title="$t('action.more')"
-                icon="more_vert"
-              />
-            </template>
-            <SmartItem
-              icon="create_new_folder"
-              :label="$t('folder.new')"
-              @click.native="
-                $emit('add-folder', { folder, path: folderPath })
-                $refs.options.tippy().hide()
-              "
-            />
-            <SmartItem
-              icon="edit"
-              :label="$t('action.edit')"
-              @click.native="
-                $emit('edit-folder', {
-                  folder,
-                  folderIndex,
-                  collectionIndex,
-                  folderPath,
-                })
-                $refs.options.tippy().hide()
-              "
-            />
-            <SmartItem
-              icon="delete"
-              color="red"
-              :label="$t('action.delete')"
-              @click.native="
-                confirmRemove = true
-                $refs.options.tippy().hide()
-              "
-            />
-          </tippy>
-        </span>
-      </div>
-    </div>
-    <div v-if="showChildren || isFiltered">
-      <CollectionsMyFolder
-        v-for="(subFolder, subFolderIndex) in folder.folders"
-        :key="`subFolder-${subFolderIndex}`"
-        class="border-l border-dividerLight ml-6"
-        :folder="subFolder"
-        :folder-index="subFolderIndex"
-        :collection-index="collectionIndex"
-        :doc="doc"
-        :save-request="saveRequest"
-        :collections-type="collectionsType"
-        :folder-path="`${folderPath}/${subFolderIndex}`"
-        :picked="picked"
-        @add-folder="$emit('add-folder', $event)"
-        @edit-folder="$emit('edit-folder', $event)"
-        @edit-request="$emit('edit-request', $event)"
-        @update-team-collections="$emit('update-team-collections')"
-        @select="$emit('select', $event)"
-        @remove-request="removeRequest"
-      />
-      <CollectionsMyRequest
-        v-for="(request, index) in folder.requests"
-        :key="`request-${index}`"
-        class="border-l border-dividerLight ml-6"
-        :request="request"
-        :collection-index="collectionIndex"
-        :folder-index="folderIndex"
-        :folder-name="folder.name"
-        :folder-path="folderPath"
-        :request-index="index"
-        :doc="doc"
-        :picked="picked"
-        :save-request="saveRequest"
-        :collections-type="collectionsType"
-        @edit-request="$emit('edit-request', $event)"
-        @select="$emit('select', $event)"
-        @remove-request="removeRequest"
-      />
-      <div
-        v-if="
-          folder.folders &&
-          folder.folders.length === 0 &&
-          folder.requests &&
-          folder.requests.length === 0
-        "
-        class="
-          border-l border-dividerLight
-          flex flex-col
-          text-secondaryLight
-          ml-6
-          p-4
-          items-center
-          justify-center
-        "
-      >
-        <i class="opacity-75 pb-2 material-icons">folder_open</i>
-        <span class="text-center">
-          {{ $t("empty.folder") }}
-        </span>
-      </div>
-    </div>
-    <SmartConfirmModal
-      :show="confirmRemove"
-      :title="$t('confirm.remove_folder')"
-      @hide-modal="confirmRemove = false"
-      @resolve="removeFolder"
-    />
-  </div>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-import {
-  removeRESTFolder,
-  removeRESTRequest,
-  moveRESTRequest,
-} from "~/newstore/collections"
-
-export default defineComponent({
-  name: "Folder",
-  props: {
-    folder: { type: Object, default: () => {} },
-    folderIndex: { type: Number, default: null },
-    collectionIndex: { type: Number, default: null },
-    folderPath: { type: String, default: null },
-    doc: Boolean,
-    saveRequest: Boolean,
-    isFiltered: Boolean,
-    collectionsType: { type: Object, default: () => {} },
-    picked: { type: Object, default: () => {} },
-  },
-  data() {
-    return {
-      showChildren: false,
-      dragging: false,
-      confirmRemove: false,
-      prevCursor: "",
-      cursor: "",
-    }
-  },
-  computed: {
-    isSelected() {
-      return (
-        this.picked &&
-        this.picked.pickedType === "my-folder" &&
-        this.picked.folderPath === this.folderPath
-      )
-    },
-    getCollectionIcon() {
-      if (this.isSelected) return "check_circle_outline"
-      else if (!this.showChildren && !this.isFiltered) return "folder"
-      else if (this.showChildren || this.isFiltered) return "folder_open"
-      else return "folder"
-    },
-  },
-  methods: {
-    toggleShowChildren() {
-      if (this.$props.saveRequest)
-        this.$emit("select", {
-          picked: {
-            pickedType: "my-folder",
-            collectionIndex: this.collectionIndex,
-            folderName: this.folder.name,
-            folderPath: this.folderPath,
-          },
-        })
-      this.showChildren = !this.showChildren
-    },
-    removeFolder() {
-      // TODO: Bubble it up ?
-      // Cancel pick if picked folder was deleted
-      if (
-        this.picked &&
-        this.picked.pickedType === "my-folder" &&
-        this.picked.folderPath === this.folderPath
-      ) {
-        this.$emit("select", { picked: null })
-      }
-      removeRESTFolder(this.folderPath)
-      this.$toast.success(this.$t("state.deleted"), {
-        icon: "delete",
-      })
-    },
-    dropEvent({ dataTransfer }) {
-      this.dragging = !this.dragging
-      const folderPath = dataTransfer.getData("folderPath")
-      const requestIndex = dataTransfer.getData("requestIndex")
-      moveRESTRequest(folderPath, requestIndex, this.folderPath)
-    },
-    removeRequest({ requestIndex }) {
-      // TODO: Bubble it up to root ?
-      // Cancel pick if the picked item is being deleted
-      if (
-        this.picked &&
-        this.picked.pickedType === "my-request" &&
-        this.picked.folderPath === this.folderPath &&
-        this.picked.requestIndex === requestIndex
-      ) {
-        this.$emit("select", { picked: null })
-      }
-      removeRESTRequest(this.folderPath, requestIndex)
-    },
-  },
-})
-</script>

components/collections/my/Request.vue

@@ -1,223 +0,0 @@
-<template>
-  <div class="flex flex-col" :class="[{ 'bg-primaryLight': dragging }]">
-    <div
-      class="flex items-center group"
-      draggable="true"
-      @dragstart="dragStart"
-      @dragover.stop
-      @dragleave="dragging = false"
-      @dragend="dragging = false"
-    >
-      <span
-        class="
-          cursor-pointer
-          flex
-          px-2
-          w-16
-          justify-center
-          items-center
-          truncate
-        "
-        :class="getRequestLabelColor(request.method)"
-        @click="!doc ? selectRequest() : {}"
-      >
-        <i
-          v-if="isSelected"
-          class="material-icons"
-          :class="{ 'text-green-500': isSelected }"
-        >
-          check_circle_outline
-        </i>
-        <span v-else class="truncate">
-          {{ request.method }}
-        </span>
-      </span>
-      <span
-        class="
-          cursor-pointer
-          flex flex-1
-          min-w-0
-          py-2
-          pr-2
-          transition
-          items-center
-          group-hover:text-secondaryDark
-        "
-        @click="!doc ? selectRequest() : {}"
-      >
-        <span class="truncate"> {{ request.name }} </span>
-        <span
-          v-if="
-            active &&
-            active.originLocation === 'user-collection' &&
-            active.folderPath === folderPath &&
-            active.requestIndex === requestIndex
-          "
-          class="rounded-full bg-green-500 flex-shrink-0 h-1.5 mx-3 w-1.5"
-        ></span>
-      </span>
-      <div class="flex">
-        <ButtonSecondary
-          v-if="!saveRequest && !doc"
-          v-tippy="{ theme: 'tooltip' }"
-          icon="replay"
-          :title="$t('action.restore')"
-          class="hidden group-hover:inline-flex"
-          @click.native="!doc ? selectRequest() : {}"
-        />
-        <span>
-          <tippy
-            ref="options"
-            interactive
-            trigger="click"
-            theme="popover"
-            arrow
-          >
-            <template #trigger>
-              <ButtonSecondary
-                v-tippy="{ theme: 'tooltip' }"
-                :title="$t('action.more')"
-                icon="more_vert"
-              />
-            </template>
-            <SmartItem
-              icon="edit"
-              :label="$t('action.edit')"
-              @click.native="
-                $emit('edit-request', {
-                  collectionIndex,
-                  folderIndex,
-                  folderName,
-                  request,
-                  requestIndex,
-                  folderPath,
-                })
-                $refs.options.tippy().hide()
-              "
-            />
-            <SmartItem
-              icon="delete"
-              color="red"
-              :label="$t('action.delete')"
-              @click.native="
-                confirmRemove = true
-                $refs.options.tippy().hide()
-              "
-            />
-          </tippy>
-        </span>
-      </div>
-    </div>
-    <SmartConfirmModal
-      :show="confirmRemove"
-      :title="$t('confirm.remove_request')"
-      @hide-modal="confirmRemove = false"
-      @resolve="removeRequest"
-    />
-  </div>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-import { translateToNewRequest } from "~/helpers/types/HoppRESTRequest"
-import { useReadonlyStream } from "~/helpers/utils/composables"
-import {
-  restSaveContext$,
-  setRESTRequest,
-  setRESTSaveContext,
-} from "~/newstore/RESTSession"
-
-export default defineComponent({
-  props: {
-    request: { type: Object, default: () => {} },
-    collectionIndex: { type: Number, default: null },
-    folderIndex: { type: Number, default: null },
-    folderName: { type: String, default: null },
-    // eslint-disable-next-line vue/require-default-prop
-    requestIndex: [Number, String],
-    doc: Boolean,
-    saveRequest: Boolean,
-    collectionsType: { type: Object, default: () => {} },
-    folderPath: { type: String, default: null },
-    picked: { type: Object, default: () => {} },
-  },
-  setup() {
-    const active = useReadonlyStream(restSaveContext$, null)
-    return {
-      active,
-    }
-  },
-  data() {
-    return {
-      dragging: false,
-      requestMethodLabels: {
-        get: "text-green-500",
-        post: "text-yellow-500",
-        put: "text-blue-500",
-        delete: "text-red-500",
-        default: "text-gray-500",
-      },
-      confirmRemove: false,
-    }
-  },
-  computed: {
-    isSelected() {
-      return (
-        this.picked &&
-        this.picked.pickedType === "my-request" &&
-        this.picked.folderPath === this.folderPath &&
-        this.picked.requestIndex === this.requestIndex
-      )
-    },
-  },
-  methods: {
-    selectRequest() {
-      if (
-        this.active &&
-        this.active.originLocation === "user-collection" &&
-        this.active.folderPath === this.folderPath &&
-        this.active.requestIndex === this.requestIndex
-      ) {
-        setRESTSaveContext(null)
-        return
-      }
-      if (this.$props.saveRequest)
-        this.$emit("select", {
-          picked: {
-            pickedType: "my-request",
-            collectionIndex: this.collectionIndex,
-            folderPath: this.folderPath,
-            folderName: this.folderName,
-            requestIndex: this.requestIndex,
-          },
-        })
-      else {
-        setRESTRequest(translateToNewRequest(this.request), {
-          originLocation: "user-collection",
-          folderPath: this.folderPath,
-          requestIndex: this.requestIndex,
-        })
-      }
-    },
-    dragStart({ dataTransfer }) {
-      this.dragging = !this.dragging
-      dataTransfer.setData("folderPath", this.folderPath)
-      dataTransfer.setData("requestIndex", this.requestIndex)
-    },
-    removeRequest() {
-      this.$emit("remove-request", {
-        collectionIndex: this.$props.collectionIndex,
-        folderName: this.$props.folderName,
-        folderPath: this.folderPath,
-        requestIndex: this.$props.requestIndex,
-      })
-    },
-    getRequestLabelColor(method) {
-      return (
-        this.requestMethodLabels[method.toLowerCase()] ||
-        this.requestMethodLabels.default
-      )
-    },
-  },
-})
-</script>

components/collections/teams/Collection.vue

@@ -1,257 +0,0 @@
-<template>
-  <div class="flex flex-col">
-    <div class="flex items-center group">
-      <span
-        class="cursor-pointer flex px-4 justify-center items-center"
-        @click="toggleShowChildren()"
-      >
-        <i class="material-icons" :class="{ 'text-green-500': isSelected }">
-          {{ getCollectionIcon }}
-        </i>
-      </span>
-      <span
-        class="
-          cursor-pointer
-          flex flex-1
-          min-w-0
-          py-2
-          pr-2
-          transition
-          group-hover:text-secondaryDark
-        "
-        @click="toggleShowChildren()"
-      >
-        <span class="truncate"> {{ collection.title }} </span>
-      </span>
-      <div class="flex">
-        <ButtonSecondary
-          v-if="doc && !selected"
-          v-tippy="{ theme: 'tooltip' }"
-          :title="$t('import.title')"
-          icon="radio_button_unchecked"
-          color="green"
-          @click.native="$emit('select-collection')"
-        />
-        <ButtonSecondary
-          v-if="doc && selected"
-          v-tippy="{ theme: 'tooltip' }"
-          :title="$t('action.remove')"
-          icon="check_circle_outline"
-          color="green"
-          @click.native="$emit('unselect-collection')"
-        />
-        <ButtonSecondary
-          v-if="collectionsType.selectedTeam.myRole !== 'VIEWER'"
-          v-tippy="{ theme: 'tooltip' }"
-          icon="create_new_folder"
-          :title="$t('folder.new')"
-          class="hidden group-hover:inline-flex"
-          @click.native="
-            $emit('add-folder', {
-              folder: collection,
-              path: `${collectionIndex}`,
-            })
-          "
-        />
-        <span>
-          <tippy
-            v-if="collectionsType.selectedTeam.myRole !== 'VIEWER'"
-            ref="options"
-            interactive
-            trigger="click"
-            theme="popover"
-            arrow
-          >
-            <template #trigger>
-              <ButtonSecondary
-                v-tippy="{ theme: 'tooltip' }"
-                :title="$t('action.more')"
-                icon="more_vert"
-              />
-            </template>
-            <SmartItem
-              v-if="collectionsType.selectedTeam.myRole !== 'VIEWER'"
-              icon="create_new_folder"
-              :label="$t('folder.new')"
-              @click.native="
-                $emit('add-folder', {
-                  folder: collection,
-                  path: `${collectionIndex}`,
-                })
-                $refs.options.tippy().hide()
-              "
-            />
-            <SmartItem
-              v-if="collectionsType.selectedTeam.myRole !== 'VIEWER'"
-              icon="create"
-              :label="$t('action.edit')"
-              @click.native="
-                $emit('edit-collection')
-                $refs.options.tippy().hide()
-              "
-            />
-            <SmartItem
-              v-if="collectionsType.selectedTeam.myRole !== 'VIEWER'"
-              icon="delete"
-              color="red"
-              :label="$t('action.delete')"
-              @click.native="
-                confirmRemove = true
-                $refs.options.tippy().hide()
-              "
-            />
-          </tippy>
-        </span>
-      </div>
-    </div>
-    <div v-if="showChildren || isFiltered">
-      <CollectionsTeamsFolder
-        v-for="(folder, index) in collection.children"
-        :key="`folder-${index}`"
-        class="border-l border-dividerLight ml-6"
-        :folder="folder"
-        :folder-index="index"
-        :folder-path="`${collectionIndex}/${index}`"
-        :collection-index="collectionIndex"
-        :doc="doc"
-        :save-request="saveRequest"
-        :collections-type="collectionsType"
-        :is-filtered="isFiltered"
-        :picked="picked"
-        @add-folder="$emit('add-folder', $event)"
-        @edit-folder="$emit('edit-folder', $event)"
-        @edit-request="$emit('edit-request', $event)"
-        @select="$emit('select', $event)"
-        @expand-collection="expandCollection"
-        @remove-request="removeRequest"
-      />
-      <CollectionsTeamsRequest
-        v-for="(request, index) in collection.requests"
-        :key="`request-${index}`"
-        class="border-l border-dividerLight ml-6"
-        :request="request.request"
-        :collection-index="collectionIndex"
-        :folder-index="-1"
-        :folder-name="collection.name"
-        :request-index="request.id"
-        :doc="doc"
-        :save-request="saveRequest"
-        :collections-type="collectionsType"
-        :picked="picked"
-        @edit-request="editRequest($event)"
-        @select="$emit('select', $event)"
-        @remove-request="removeRequest"
-      />
-      <div
-        v-if="
-          (collection.children == undefined ||
-            collection.children.length === 0) &&
-          (collection.requests == undefined || collection.requests.length === 0)
-        "
-        class="
-          border-l border-dividerLight
-          flex flex-col
-          text-secondaryLight
-          ml-6
-          p-4
-          items-center
-          justify-center
-        "
-      >
-        <i class="opacity-75 pb-2 material-icons">folder_open</i>
-        <span class="text-center">
-          {{ $t("empty.collection") }}
-        </span>
-      </div>
-    </div>
-    <SmartConfirmModal
-      :show="confirmRemove"
-      :title="$t('confirm.remove_collection')"
-      @hide-modal="confirmRemove = false"
-      @resolve="removeCollection"
-    />
-  </div>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-
-export default defineComponent({
-  props: {
-    collectionIndex: { type: Number, default: null },
-    collection: { type: Object, default: () => {} },
-    doc: Boolean,
-    isFiltered: Boolean,
-    selected: Boolean,
-    saveRequest: Boolean,
-    collectionsType: { type: Object, default: () => {} },
-    picked: { type: Object, default: () => {} },
-  },
-  data() {
-    return {
-      showChildren: false,
-      selectedFolder: {},
-      confirmRemove: false,
-      prevCursor: "",
-      cursor: "",
-      pageNo: 0,
-    }
-  },
-  computed: {
-    isSelected() {
-      return (
-        this.picked &&
-        this.picked.pickedType === "teams-collection" &&
-        this.picked.collectionID === this.collection.id
-      )
-    },
-    getCollectionIcon() {
-      if (this.isSelected) return "check_circle_outline"
-      else if (!this.showChildren && !this.isFiltered) return "folder"
-      else if (this.showChildren || this.isFiltered) return "folder_open"
-      else return "folder"
-    },
-  },
-  methods: {
-    editRequest(event) {
-      this.$emit("edit-request", event)
-      if (this.$props.saveRequest)
-        this.$emit("select", {
-          picked: {
-            pickedType: "teams-collection",
-            collectionID: this.collection.id,
-          },
-        })
-    },
-    toggleShowChildren() {
-      if (this.$props.saveRequest)
-        this.$emit("select", {
-          picked: {
-            pickedType: "teams-collection",
-            collectionID: this.collection.id,
-          },
-        })
-
-      this.$emit("expand-collection", this.collection.id)
-      this.showChildren = !this.showChildren
-    },
-    removeCollection() {
-      this.$emit("remove-collection", {
-        collectionsType: this.collectionsType,
-        collectionIndex: this.collectionIndex,
-        collectionID: this.collection.id,
-      })
-    },
-    expandCollection(collectionID) {
-      this.$emit("expand-collection", collectionID)
-    },
-    removeRequest({ collectionIndex, folderName, requestIndex }) {
-      this.$emit("remove-request", {
-        collectionIndex,
-        folderName,
-        requestIndex,
-      })
-    },
-  },
-})
-</script>

components/collections/teams/Folder.vue

@@ -1,251 +0,0 @@
-<template>
-  <div class="flex flex-col">
-    <div class="flex items-center group">
-      <span
-        class="cursor-pointer flex px-4 justify-center items-center"
-        @click="toggleShowChildren()"
-      >
-        <i class="material-icons" :class="{ 'text-green-500': isSelected }">
-          {{ getCollectionIcon }}
-        </i>
-      </span>
-      <span
-        class="
-          cursor-pointer
-          flex flex-1
-          min-w-0
-          py-2
-          pr-2
-          transition
-          group-hover:text-secondaryDark
-        "
-        @click="toggleShowChildren()"
-      >
-        <span class="truncate">
-          {{ folder.name ? folder.name : folder.title }}
-        </span>
-      </span>
-      <div class="flex">
-        <ButtonSecondary
-          v-if="collectionsType.selectedTeam.myRole !== 'VIEWER'"
-          v-tippy="{ theme: 'tooltip' }"
-          icon="create_new_folder"
-          :title="$t('folder.new')"
-          class="hidden group-hover:inline-flex"
-          @click.native="$emit('add-folder', { folder, path: folderPath })"
-        />
-        <span>
-          <tippy
-            v-if="collectionsType.selectedTeam.myRole !== 'VIEWER'"
-            ref="options"
-            interactive
-            trigger="click"
-            theme="popover"
-            arrow
-          >
-            <template #trigger>
-              <ButtonSecondary
-                v-tippy="{ theme: 'tooltip' }"
-                :title="$t('action.more')"
-                icon="more_vert"
-              />
-            </template>
-            <SmartItem
-              v-if="collectionsType.selectedTeam.myRole !== 'VIEWER'"
-              icon="create_new_folder"
-              :label="$t('folder.new')"
-              @click.native="
-                $emit('add-folder', { folder, path: folderPath })
-                $refs.options.tippy().hide()
-              "
-            />
-            <SmartItem
-              v-if="collectionsType.selectedTeam.myRole !== 'VIEWER'"
-              icon="edit"
-              :label="$t('action.edit')"
-              @click.native="
-                $emit('edit-folder', {
-                  folder,
-                  folderIndex,
-                  collectionIndex,
-                  folderPath: '',
-                })
-                $refs.options.tippy().hide()
-              "
-            />
-            <SmartItem
-              v-if="collectionsType.selectedTeam.myRole !== 'VIEWER'"
-              icon="delete"
-              color="red"
-              :label="$t('action.delete')"
-              @click.native="
-                confirmRemove = true
-                $refs.options.tippy().hide()
-              "
-            />
-          </tippy>
-        </span>
-      </div>
-    </div>
-    <div v-if="showChildren || isFiltered">
-      <CollectionsTeamsFolder
-        v-for="(subFolder, subFolderIndex) in folder.children"
-        :key="`subFolder-${subFolderIndex}`"
-        class="border-l border-dividerLight ml-6"
-        :folder="subFolder"
-        :folder-index="subFolderIndex"
-        :collection-index="collectionIndex"
-        :doc="doc"
-        :save-request="saveRequest"
-        :collections-type="collectionsType"
-        :folder-path="`${folderPath}/${subFolderIndex}`"
-        :picked="picked"
-        @add-folder="$emit('add-folder', $event)"
-        @edit-folder="$emit('edit-folder', $event)"
-        @edit-request="$emit('edit-request', $event)"
-        @update-team-collections="$emit('update-team-collections')"
-        @select="$emit('select', $event)"
-        @expand-collection="expandCollection"
-        @remove-request="removeRequest"
-      />
-      <CollectionsTeamsRequest
-        v-for="(request, index) in folder.requests"
-        :key="`request-${index}`"
-        class="border-l border-dividerLight ml-6"
-        :request="request.request"
-        :collection-index="collectionIndex"
-        :folder-index="folderIndex"
-        :folder-name="folder.name"
-        :request-index="request.id"
-        :doc="doc"
-        :save-request="saveRequest"
-        :collections-type="collectionsType"
-        :picked="picked"
-        @edit-request="$emit('edit-request', $event)"
-        @select="$emit('select', $event)"
-        @remove-request="removeRequest"
-      />
-      <div
-        v-if="
-          (folder.children == undefined || folder.children.length === 0) &&
-          (folder.requests == undefined || folder.requests.length === 0)
-        "
-        class="
-          border-l border-dividerLight
-          flex flex-col
-          text-secondaryLight
-          ml-6
-          p-4
-          items-center
-          justify-center
-        "
-      >
-        <i class="opacity-75 pb-2 material-icons">folder_open</i>
-        <span class="text-center">
-          {{ $t("empty.folder") }}
-        </span>
-      </div>
-    </div>
-    <SmartConfirmModal
-      :show="confirmRemove"
-      :title="$t('confirm.remove_folder')"
-      @hide-modal="confirmRemove = false"
-      @resolve="removeFolder"
-    />
-  </div>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-import * as teamUtils from "~/helpers/teams/utils"
-
-export default defineComponent({
-  name: "Folder",
-  props: {
-    folder: { type: Object, default: () => {} },
-    folderIndex: { type: Number, default: null },
-    collectionIndex: { type: Number, default: null },
-    folderPath: { type: String, default: null },
-    doc: Boolean,
-    saveRequest: Boolean,
-    isFiltered: Boolean,
-    collectionsType: { type: Object, default: () => {} },
-    picked: { type: Object, default: () => {} },
-  },
-  data() {
-    return {
-      showChildren: false,
-      confirmRemove: false,
-      prevCursor: "",
-      cursor: "",
-    }
-  },
-  computed: {
-    isSelected() {
-      return (
-        this.picked &&
-        this.picked.pickedType === "teams-folder" &&
-        this.picked.folderID === this.folder.id
-      )
-    },
-    getCollectionIcon() {
-      if (this.isSelected) return "check_circle_outline"
-      else if (!this.showChildren && !this.isFiltered) return "folder"
-      else if (this.showChildren || this.isFiltered) return "folder_open"
-      else return "folder"
-    },
-  },
-  methods: {
-    toggleShowChildren() {
-      if (this.$props.saveRequest)
-        this.$emit("select", {
-          picked: {
-            pickedType: "teams-folder",
-            folderID: this.folder.id,
-          },
-        })
-
-      this.$emit("expand-collection", this.$props.folder.id)
-      this.showChildren = !this.showChildren
-    },
-    removeFolder() {
-      if (this.collectionsType.selectedTeam.myRole !== "VIEWER") {
-        // Cancel pick if picked collection folder was deleted
-        if (
-          this.picked &&
-          this.picked.pickedType === "teams-folder" &&
-          this.picked.folderID === this.folder.id
-        ) {
-          this.$emit("select", { picked: null })
-        }
-
-        teamUtils
-          .deleteCollection(this.$apollo, this.folder.id)
-          .then(() => {
-            this.$toast.success(this.$t("state.deleted"), {
-              icon: "delete",
-            })
-            this.$emit("update-team-collections")
-          })
-          .catch((e) => {
-            this.$toast.error(this.$t("error.something_went_wrong"), {
-              icon: "error_outline",
-            })
-            console.error(e)
-          })
-        this.$emit("update-team-collections")
-      }
-    },
-    expandCollection(collectionID) {
-      this.$emit("expand-collection", collectionID)
-    },
-    removeRequest({ collectionIndex, folderName, requestIndex }) {
-      this.$emit("remove-request", {
-        collectionIndex,
-        folderName,
-        requestIndex,
-      })
-    },
-  },
-})
-</script>

components/collections/teams/Request.vue

@@ -1,200 +0,0 @@
-<template>
-  <div class="flex flex-col">
-    <div class="flex items-center group">
-      <span
-        class="
-          cursor-pointer
-          flex
-          px-2
-          w-16
-          justify-center
-          items-center
-          truncate
-        "
-        :class="getRequestLabelColor(request.method)"
-        @click="!doc ? selectRequest() : {}"
-      >
-        <i
-          v-if="isSelected"
-          class="material-icons"
-          :class="{ 'text-green-500': isSelected }"
-        >
-          check_circle_outline
-        </i>
-        <span v-else>
-          {{ request.method }}
-        </span>
-      </span>
-      <span
-        class="
-          cursor-pointer
-          flex flex-1
-          min-w-0
-          py-2
-          pr-2
-          transition
-          items-center
-          group-hover:text-secondaryDark
-        "
-        @click="!doc ? selectRequest() : {}"
-      >
-        <span class="truncate"> {{ request.name }} </span>
-        <span
-          v-if="
-            active &&
-            active.originLocation === 'team-collection' &&
-            active.requestID === requestIndex
-          "
-          class="rounded-full bg-green-500 flex-shrink-0 h-1.5 mx-3 w-1.5"
-        ></span>
-      </span>
-      <div class="flex">
-        <ButtonSecondary
-          v-if="!saveRequest && !doc"
-          v-tippy="{ theme: 'tooltip' }"
-          icon="replay"
-          :title="$t('action.restore')"
-          class="hidden group-hover:inline-flex"
-          @click.native="!doc ? selectRequest() : {}"
-        />
-        <span>
-          <tippy
-            v-if="collectionsType.selectedTeam.myRole !== 'VIEWER'"
-            ref="options"
-            interactive
-            trigger="click"
-            theme="popover"
-            arrow
-          >
-            <template #trigger>
-              <ButtonSecondary
-                v-tippy="{ theme: 'tooltip' }"
-                :title="$t('action.more')"
-                icon="more_vert"
-              />
-            </template>
-            <SmartItem
-              icon="edit"
-              :label="$t('action.edit')"
-              @click.native="
-                $emit('edit-request', {
-                  collectionIndex,
-                  folderIndex,
-                  folderName,
-                  request,
-                  requestIndex,
-                })
-                $refs.options.tippy().hide()
-              "
-            />
-            <SmartItem
-              icon="delete"
-              color="red"
-              :label="$t('action.delete')"
-              @click.native="
-                confirmRemove = true
-                $refs.options.tippy().hide()
-              "
-            />
-          </tippy>
-        </span>
-      </div>
-    </div>
-    <SmartConfirmModal
-      :show="confirmRemove"
-      :title="$t('confirm.remove_request')"
-      @hide-modal="confirmRemove = false"
-      @resolve="removeRequest"
-    />
-  </div>
-</template>
-
-<script lang="ts">
-import { defineComponent } from "@nuxtjs/composition-api"
-import { translateToNewRequest } from "~/helpers/types/HoppRESTRequest"
-import { useReadonlyStream } from "~/helpers/utils/composables"
-import {
-  restSaveContext$,
-  setRESTRequest,
-  setRESTSaveContext,
-} from "~/newstore/RESTSession"
-
-export default defineComponent({
-  props: {
-    request: { type: Object, default: () => {} },
-    collectionIndex: { type: Number, default: null },
-    folderIndex: { type: Number, default: null },
-    folderName: { type: String, default: null },
-    // eslint-disable-next-line vue/require-default-prop
-    requestIndex: [Number, String],
-    doc: Boolean,
-    saveRequest: Boolean,
-    collectionsType: { type: Object, default: () => {} },
-    picked: { type: Object, default: () => {} },
-  },
-  setup() {
-    const active = useReadonlyStream(restSaveContext$, null)
-    return {
-      active,
-    }
-  },
-  data() {
-    return {
-      requestMethodLabels: {
-        get: "text-green-500",
-        post: "text-yellow-500",
-        put: "text-blue-500",
-        delete: "text-red-500",
-        default: "text-gray-500",
-      },
-      confirmRemove: false,
-    }
-  },
-  computed: {
-    isSelected(): boolean {
-      return (
-        this.picked &&
-        this.picked.pickedType === "teams-request" &&
-        this.picked.requestID === this.requestIndex
-      )
-    },
-  },
-  methods: {
-    selectRequest() {
-      if (
-        this.active &&
-        this.active.originLocation === "team-collection" &&
-        this.active.requestID === this.requestIndex
-      ) {
-        setRESTSaveContext(null)
-        return
-      }
-      if (this.$props.saveRequest)
-        this.$emit("select", {
-          picked: {
-            pickedType: "teams-request",
-            requestID: this.requestIndex,
-          },
-        })
-      else
-        setRESTRequest(translateToNewRequest(this.request), {
-          originLocation: "team-collection",
-          requestID: this.requestIndex as string,
-        })
-    },
-    removeRequest() {
-      this.$emit("remove-request", {
-        collectionIndex: this.$props.collectionIndex,
-        folderName: this.$props.folderName,
-        requestIndex: this.$props.requestIndex,
-      })
-    },
-    getRequestLabelColor(method: any) {
-      return (
-        (this.requestMethodLabels as any)[method.toLowerCase()] ||
-        this.requestMethodLabels.default
-      )
-    },
-  },
-})
-</script>

components/docs/Collection.vue

@@ -1,43 +0,0 @@
-<template>
-  <div class="collection">
-    <h2 class="heading">
-      <i class="material-icons">folder</i>
-      {{ collection.name || $t("state.none") }}
-    </h2>
-    <span
-      v-for="(folder, index) in collection.folders"
-      :key="`folder-${index}`"
-      class="folder"
-    >
-      <DocsFolder :folder="folder" />
-    </span>
-    <div
-      v-for="(request, index) in collection.requests"
-      :key="`request-${index}`"
-    >
-      <DocsRequest :request="request" />
-    </div>
-  </div>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-
-export default defineComponent({
-  props: {
-    collection: { type: Object, default: () => {} },
-  },
-})
-</script>
-
-<style scoped lang="scss">
-.collection {
-  @apply flex flex-col flex-1;
-  @apply justify-center;
-  @apply p-4;
-
-  .material-icons {
-    @apply mr-4;
-  }
-}
-</style>

components/docs/Folder.vue

@@ -1,41 +0,0 @@
-<template>
-  <div class="folder">
-    <h3 class="heading">
-      <i class="material-icons">folder_open</i>
-      {{ folder.name || $t("state.none") }}
-    </h3>
-    <div
-      v-for="(subFolder, index) in folder.folders"
-      :key="`subFolder-${index}`"
-    >
-      <DocsFolder :folder="subFolder" />
-    </div>
-    <div v-for="(request, index) in folder.requests" :key="`request-${index}`">
-      <DocsRequest :request="request" />
-    </div>
-  </div>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-
-export default defineComponent({
-  props: {
-    folder: { type: Object, default: () => {} },
-  },
-})
-</script>
-
-<style scoped lang="scss">
-.folder {
-  @apply flex flex-col flex-1;
-  @apply justify-center;
-  @apply p-4;
-  @apply mt-4;
-  @apply border-l border-divider;
-
-  .material-icons {
-    @apply mr-4;
-  }
-}
-</style>

components/docs/Request.vue

@@ -1,157 +0,0 @@
-<template>
-  <div class="request">
-    <h4 class="heading">
-      <i class="material-icons">insert_drive_file</i>
-      {{ request.name || $t("state.none") }}
-    </h4>
-    <p v-if="request.url" class="doc-desc">
-      <span>
-        {{ $t("request.url") }}:
-        <code>{{ request.url || $t("state.none") }}</code>
-      </span>
-    </p>
-    <p v-if="request.path" class="doc-desc">
-      <span>
-        {{ $t("request.path") }}:
-        <code>{{ request.path || $t("state.none") }}</code>
-      </span>
-    </p>
-    <p v-if="request.method" class="doc-desc">
-      <span>
-        {{ $t("request.method") }}:
-        <code>{{ request.method || $t("state.none") }}</code>
-      </span>
-    </p>
-    <p v-if="request.auth" class="doc-desc">
-      <span>
-        {{ $t("request.authorization") }}:
-        <code>{{ request.auth.authType || $t("state.none") }}</code>
-      </span>
-    </p>
-    <p v-if="request.httpUser" class="doc-desc">
-      <span>
-        {{ $t("authorization.username") }}:
-        <code>{{ request.httpUser || $t("state.none") }}</code>
-      </span>
-    </p>
-    <p v-if="request.httpPassword" class="doc-desc">
-      <span>
-        {{ $t("authorization.password") }}:
-        <code>{{ request.httpPassword || $t("state.none") }}</code>
-      </span>
-    </p>
-    <p v-if="request.bearerToken" class="doc-desc">
-      <span>
-        {{ $t("authorization.token") }}:
-        <code>{{ request.bearerToken || $t("state.none") }}</code>
-      </span>
-    </p>
-    <h4 v-if="request.headers" class="heading">{{ $t("tab.headers") }}</h4>
-    <span v-if="request.headers">
-      <p
-        v-for="(header, index) in request.headers"
-        :key="`header-${index}`"
-        class="doc-desc"
-      >
-        <span>
-          {{ header.key || $t("state.none") }}:
-          <code>{{ header.value || $t("state.none") }}</code>
-        </span>
-      </p>
-    </span>
-    <h4 v-if="request.params" class="heading">
-      {{ $t("request.parameters") }}
-    </h4>
-    <span v-if="request.params">
-      <p
-        v-for="(parameter, index) in request.params"
-        :key="`parameter-${index}`"
-        class="doc-desc"
-      >
-        <span>
-          {{ parameter.key || $t("state.none") }}:
-          <code>{{ parameter.value || $t("state.none") }}</code>
-        </span>
-      </p>
-    </span>
-    <h4 v-if="request.bodyParams" class="heading">
-      {{ $t("request.payload") }}
-    </h4>
-    <span v-if="request.bodyParams">
-      <p
-        v-for="(payload, index) in request.bodyParams"
-        :key="`payload-${index}`"
-        class="doc-desc"
-      >
-        <span>
-          {{ payload.key || $t("state.none") }}:
-          <code>{{ payload.value || $t("state.none") }}</code>
-        </span>
-      </p>
-    </span>
-    <p v-if="request.rawParams" class="doc-desc">
-      <span>
-        {{ $t("request.parameters") }}:
-        <code>{{ request.rawParams || $t("state.none") }}</code>
-      </span>
-    </p>
-    <p v-if="request.contentType" class="doc-desc">
-      <span>
-        {{ $t("request.content_type") }}:
-        <code>{{ request.contentType || $t("state.none") }}</code>
-      </span>
-    </p>
-    <p v-if="request.requestType" class="doc-desc">
-      <span>
-        {{ $t("request.type") }}:
-        <code>{{ request.requestType || $t("state.none") }}</code>
-      </span>
-    </p>
-  </div>
-</template>
-
-<script>
-import { defineComponent } from "@nuxtjs/composition-api"
-
-export default defineComponent({
-  props: {
-    request: { type: Object, default: () => {} },
-  },
-})
-</script>
-
-<style scoped lang="scss">
-.request {
-  @apply flex flex-col flex-1;
-  @apply justify-center;
-  @apply p-4;
-  @apply mt-4;
-  @apply border border-divider;
-  @apply rounded;
-
-  h4 {
-    @apply mt-4;
-  }
-
-  .material-icons {
-    @apply mr-4;
-  }
-}
-
-.doc-desc {
-  @apply flex flex-col flex-1;
-  @apply justify-center;
-  @apply p-4;
-  @apply m-0;
-  @apply text-secondaryLight;
-  @apply border-b border-divider;
-
-  &:last-child {
-    @apply border-b-0;
-  }
-
-  .material-icons {
-    @apply mr-4;
-  }
-}
-</style>

components/environments/Add.vue

@@ -1,64 +0,0 @@
-<template>
-  <SmartModal v-if="show" :title="$t('environment.new')" @close="hideModal">
-    <template #body>
-      <div class="flex flex-col px-2">
-        <input
-          id="selectLabelEnvAdd"
-          v-model="name"
-          v-focus
-          class="input floating-input"
-          placeholder=" "
-          type="text"
-          @keyup.enter="addNewEnvironment"
-        />
-        <label for="selectLabelEnvAdd">
-          {{ $t("action.label") }}
-        </label>
-      </div>
-    </template>
-    <template #footer>
-      <span>
-        <ButtonPrimary
-          :label="$t('action.save')"
-          @click.native="addNewEnvironment"
-        />
-        <ButtonSecondary
-          :label="$t('action.cancel')"
-          @click.native="hideModal"
-        />
-      </span>
-    </template>
-  </SmartModal>
-</template>
-
-<script lang="ts">
-import { defineComponent } from "@nuxtjs/composition-api"
-import { createEnvironment } from "~/newstore/environments"
-
-export default defineComponent({
-  props: {
-    show: Boolean,
-  },
-  data() {
-    return {
-      name: null as string | null,
-    }
-  },
-  methods: {
-    addNewEnvironment() {
-      if (!this.name) {
-        this.$toast.error(this.$t("environment.invalid_name").toString(), {
-          icon: "error_outline",
-        })
-        return
-      }
-      createEnvironment(this.name)
-      this.hideModal()
-    },
-    hideModal() {
-      this.name = null
-      this.$emit("hide-modal")
-    },
-  },
-})
-</script>

components/environments/Edit.vue

@@ -1,200 +0,0 @@
-<template>
-  <SmartModal v-if="show" :title="$t('environment.edit')" @close="hideModal">
-    <template #body>
-      <div class="flex flex-col px-2">
-        <div class="flex relative">
-          <input
-            id="selectLabelEnvEdit"
-            v-model="name"
-            v-focus
-            class="input floating-input"
-            placeholder=" "
-            type="text"
-            :disabled="editingEnvironmentIndex === 'Global'"
-            @keyup.enter="saveEnvironment"
-          />
-          <label for="selectLabelEnvEdit">
-            {{ $t("action.label") }}
-          </label>
-        </div>
-        <div class="flex flex-1 justify-between items-center">
-          <label for="variableList" class="p-4">
-            {{ $t("environment.variable_list") }}
-          </label>
-          <div class="flex">
-            <ButtonSecondary
-              v-tippy="{ theme: 'tooltip' }"
-              :title="$t('action.clear_all')"
-              :icon="clearIcon"
-              class="rounded"
-              @click.native="clearContent()"
-            />
-            <ButtonSecondary
-              v-tippy="{ theme: 'tooltip' }"
-              icon="add"
-              :title="$t('add.new')"
-              class="rounded"
-              @click.native="addEnvironmentVariable"
-            />
-          </div>
-        </div>
-        <div class="divide-y divide-dividerLight border-divider border rounded">
-          <div
-            v-for="(variable, index) in vars"
-            :key="`variable-${index}`"
-            class="divide-x divide-dividerLight flex"
-          >
-            <input
-              v-model="variable.key"
-              class="bg-transparent flex flex-1 py-2 px-4"
-              :placeholder="$t('count.variable', { count: index + 1 })"
-              :name="'param' + index"
-            />
-            <input
-              v-model="variable.value"
-              class="bg-transparent flex flex-1 py-2 px-4"
-              :placeholder="$t('count.value', { count: index + 1 })"
-              :name="'value' + index"
-            />
-            <div class="flex">
-              <ButtonSecondary
-                id="variable"
-                v-tippy="{ theme: 'tooltip' }"
-                :title="$t('action.remove')"
-                icon="remove_circle_outline"
-                color="red"
-                @click.native="removeEnvironmentVariable(index)"
-              />
-            </div>
-          </div>
-          <div
-            v-if="vars.length === 0"
-            class="
-              flex flex-col
-              text-secondaryLight
-              p-4
-              items-center
-              justify-center
-            "
-          >
-            <i class="opacity-75 pb-2 material-icons">layers</i>
-            <span class="text-center pb-4">
-              {{ $t("empty.environments") }}
-            </span>
-            <ButtonSecondary
-              :label="$t('add.new')"
-              filled
-              @click.native="addEnvironmentVariable"
-            />
-          </div>
-        </div>
-      </div>
-    </template>
-    <template #footer>
-      <span>
-        <ButtonPrimary
-          :label="$t('action.save')"
-          @click.native="saveEnvironment"
-        />
-        <ButtonSecondary
-          :label="$t('action.cancel')"
-          @click.native="hideModal"
-        />
-      </span>
-    </template>
-  </SmartModal>
-</template>
-
-<script lang="ts">
-import clone from "lodash/clone"
-import { computed, defineComponent, PropType } from "@nuxtjs/composition-api"
-import {
-  Environment,
-  getEnviroment,
-  getGlobalVariables,
-  setGlobalEnvVariables,
-  updateEnvironment,
-} from "~/newstore/environments"
-
-export default defineComponent({
-  props: {
-    show: Boolean,
-    editingEnvironmentIndex: {
-      type: [Number, String] as PropType<number | "Global" | null>,
-      default: null,
-    },
-  },
-  setup(props) {
-    const workingEnv = computed(() => {
-      if (props.editingEnvironmentIndex === null) return null
-
-      if (props.editingEnvironmentIndex === "Global") {
-        return {
-          name: "Global",
-          variables: getGlobalVariables(),
-        } as Environment
-      } else {
-        return getEnviroment(props.editingEnvironmentIndex)
-      }
-    })
-
-    return {
-      workingEnv,
-    }
-  },
-  data() {
-    return {
-      name: null as string | null,
-      vars: [] as { key: string; value: string }[],
-      clearIcon: "clear_all",
-    }
-  },
-  watch: {
-    show() {
-      this.name = this.workingEnv?.name ?? null
-      this.vars = clone(this.workingEnv?.variables ?? [])
-    },
-  },
-  methods: {
-    clearContent() {
-      this.vars = []
-      this.clearIcon = "done"
-      this.$toast.success(this.$t("state.cleared").toString(), {
-        icon: "clear_all",
-      })
-      setTimeout(() => (this.clearIcon = "clear_all"), 1000)
-    },
-    addEnvironmentVariable() {
-      this.vars.push({
-        key: "",
-        value: "",
-      })
-    },
-    removeEnvironmentVariable(index: number) {
-      this.vars.splice(index, 1)
-    },
-    saveEnvironment() {
-      if (!this.name) {
-        this.$toast.error(this.$t("environment.invalid_name").toString(), {
-          icon: "error_outline",
-        })
-        return
-      }
-
-      const environmentUpdated: Environment = {
-        name: this.name,
-        variables: this.vars,
-      }
-
-      if (this.editingEnvironmentIndex === "Global")
-        setGlobalEnvVariables(environmentUpdated.variables)
-      else updateEnvironment(this.editingEnvironmentIndex!, environmentUpdated)
-      this.hideModal()
-    },
-    hideModal() {
-      this.name = null
-      this.$emit("hide-modal")
-    },
-  },
-})
-</script>