refactor: monorepo+pnpm (removed husky)

packages/hoppscotch-app/.env.example

@@ -0,0 +1,18 @@
+# Google Analytics ID
+GA_ID=UA-61422507-4
+
+# Google Tag Manager ID
+GTM_ID=GTM-NMKVBMV
+
+# 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
+
+# Base URL
+BASE_URL=https://hoppscotch.io

packages/hoppscotch-app/assets/README.md

@@ -0,0 +1,5 @@
+# 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).

packages/hoppscotch-app/assets/icons/align-left.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-align-left"><line x1="17" y1="10" x2="3" y2="10"></line><line x1="21" y1="6" x2="3" y2="6"></line><line x1="21" y1="14" x2="3" y2="14"></line><line x1="17" y1="18" x2="3" y2="18"></line></svg>

packages/hoppscotch-app/assets/icons/archive.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="21 8 21 21 3 21 3 8"></polyline><rect x="1" y="3" width="22" height="5"></rect><line x1="10" y1="12" x2="14" y2="12"></line></svg>

packages/hoppscotch-app/assets/icons/arrow-left.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="19" y1="12" x2="5" y2="12"></line><polyline points="12 19 5 12 12 5"></polyline></svg>

packages/hoppscotch-app/assets/icons/arrow-right.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg>

packages/hoppscotch-app/assets/icons/at-sign.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="4"></circle><path d="M16 8v5a3 3 0 0 0 6 0v-1a10 10 0 1 0-3.92 7.94"></path></svg>

packages/hoppscotch-app/assets/icons/auth/github.svg

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="256px" height="250px" viewBox="0 0 256 250" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid">
+    <g>
+        <path d="M128.00106,0 C57.3172926,0 0,57.3066942 0,128.00106 C0,184.555281 36.6761997,232.535542 87.534937,249.460899 C93.9320223,250.645779 96.280588,246.684165 96.280588,243.303333 C96.280588,240.251045 96.1618878,230.167899 96.106777,219.472176 C60.4967585,227.215235 52.9826207,204.369712 52.9826207,204.369712 C47.1599584,189.574598 38.770408,185.640538 38.770408,185.640538 C27.1568785,177.696113 39.6458206,177.859325 39.6458206,177.859325 C52.4993419,178.762293 59.267365,191.04987 59.267365,191.04987 C70.6837675,210.618423 89.2115753,204.961093 96.5158685,201.690482 C97.6647155,193.417512 100.981959,187.77078 104.642583,184.574357 C76.211799,181.33766 46.324819,170.362144 46.324819,121.315702 C46.324819,107.340889 51.3250588,95.9223682 59.5132437,86.9583937 C58.1842268,83.7344152 53.8029229,70.715562 60.7532354,53.0843636 C60.7532354,53.0843636 71.5019501,49.6441813 95.9626412,66.2049595 C106.172967,63.368876 117.123047,61.9465949 128.00106,61.8978432 C138.879073,61.9465949 149.837632,63.368876 160.067033,66.2049595 C184.49805,49.6441813 195.231926,53.0843636 195.231926,53.0843636 C202.199197,70.715562 197.815773,83.7344152 196.486756,86.9583937 C204.694018,95.9223682 209.660343,107.340889 209.660343,121.315702 C209.660343,170.478725 179.716133,181.303747 151.213281,184.472614 C155.80443,188.444828 159.895342,196.234518 159.895342,208.176593 C159.895342,225.303317 159.746968,239.087361 159.746968,243.303333 C159.746968,246.709601 162.05102,250.70089 168.53925,249.443941 C219.370432,232.499507 256,184.536204 256,128.00106 C256,57.3066942 198.691187,0 128.00106,0 Z M47.9405593,182.340212 C47.6586465,182.976105 46.6581745,183.166873 45.7467277,182.730227 C44.8183235,182.312656 44.2968914,181.445722 44.5978808,180.80771 C44.8734344,180.152739 45.876026,179.97045 46.8023103,180.409216 C47.7328342,180.826786 48.2627451,181.702199 47.9405593,182.340212 Z M54.2367892,187.958254 C53.6263318,188.524199 52.4329723,188.261363 51.6232682,187.366874 C50.7860088,186.474504 50.6291553,185.281144 51.2480912,184.70672 C51.8776254,184.140775 53.0349512,184.405731 53.8743302,185.298101 C54.7115892,186.201069 54.8748019,187.38595 54.2367892,187.958254 Z M58.5562413,195.146347 C57.7719732,195.691096 56.4895886,195.180261 55.6968417,194.042013 C54.9125733,192.903764 54.9125733,191.538713 55.713799,190.991845 C56.5086651,190.444977 57.7719732,190.936735 58.5753181,192.066505 C59.3574669,193.22383 59.3574669,194.58888 58.5562413,195.146347 Z M65.8613592,203.471174 C65.1597571,204.244846 63.6654083,204.03712 62.5716717,202.981538 C61.4524999,201.94927 61.1409122,200.484596 61.8446341,199.710926 C62.5547146,198.935137 64.0575422,199.15346 65.1597571,200.200564 C66.2704506,201.230712 66.6095936,202.705984 65.8613592,203.471174 Z M75.3025151,206.281542 C74.9930474,207.284134 73.553809,207.739857 72.1039724,207.313809 C70.6562556,206.875043 69.7087748,205.700761 70.0012857,204.687571 C70.302275,203.678621 71.7478721,203.20382 73.2083069,203.659543 C74.6539041,204.09619 75.6035048,205.261994 75.3025151,206.281542 Z M86.046947,207.473627 C86.0829806,208.529209 84.8535871,209.404622 83.3316829,209.4237 C81.8013,209.457614 80.563428,208.603398 80.5464708,207.564772 C80.5464708,206.498591 81.7483088,205.631657 83.2786917,205.606221 C84.8005962,205.576546 86.046947,206.424403 86.046947,207.473627 Z M96.6021471,207.069023 C96.7844366,208.099171 95.7267341,209.156872 94.215428,209.438785 C92.7295577,209.710099 91.3539086,209.074206 91.1652603,208.052538 C90.9808515,206.996955 92.0576306,205.939253 93.5413813,205.66582 C95.054807,205.402984 96.4092596,206.021919 96.6021471,207.069023 Z" fill="currentColor"></path>
+    </g>
+</svg>

packages/hoppscotch-app/assets/icons/auth/google.svg

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="256px" height="262px" viewBox="0 0 256 262" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid">
+	<g>
+		<path d="M255.878,133.451 C255.878,122.717 255.007,114.884 253.122,106.761 L130.55,106.761 L130.55,155.209 L202.497,155.209 C201.047,167.249 193.214,185.381 175.807,197.565 L175.563,199.187 L214.318,229.21 L217.003,229.478 C241.662,206.704 255.878,173.196 255.878,133.451" fill="currentColor"></path>
+		<path d="M130.55,261.1 C165.798,261.1 195.389,249.495 217.003,229.478 L175.807,197.565 C164.783,205.253 149.987,210.62 130.55,210.62 C96.027,210.62 66.726,187.847 56.281,156.37 L54.75,156.5 L14.452,187.687 L13.925,189.152 C35.393,231.798 79.49,261.1 130.55,261.1" fill="currentColor"></path>
+		<path d="M56.281,156.37 C53.525,148.247 51.93,139.543 51.93,130.55 C51.93,121.556 53.525,112.853 56.136,104.73 L56.063,103 L15.26,71.312 L13.925,71.947 C5.077,89.644 0,109.517 0,130.55 C0,151.583 5.077,171.455 13.925,189.152 L56.281,156.37" fill="currentColor"></path>
+		<path d="M130.55,50.479 C155.064,50.479 171.6,61.068 181.029,69.917 L217.873,33.943 C195.245,12.91 165.798,0 130.55,0 C79.49,0 35.393,29.301 13.925,71.947 L56.136,104.73 C66.726,73.253 96.027,50.479 130.55,50.479" fill="currentColor"></path>
+	</g>
+</svg>

packages/hoppscotch-app/assets/icons/book-open.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M2 3h6a4 4 0 0 1 4 4v14a3 3 0 0 0-3-3H2z"></path><path d="M22 3h-6a4 4 0 0 0-4 4v14a3 3 0 0 1 3-3h7z"></path></svg>

packages/hoppscotch-app/assets/icons/book.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 19.5A2.5 2.5 0 0 1 6.5 17H20"></path><path d="M6.5 2H20v20H6.5A2.5 2.5 0 0 1 4 19.5v-15A2.5 2.5 0 0 1 6.5 2z"></path></svg>

packages/hoppscotch-app/assets/icons/brands/chrome.svg

@@ -0,0 +1,19 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no" ?>
+<svg width="256px" height="257px" viewBox="0 0 256 257" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid">
+    <defs>
+        <linearGradient x1="49.9976632%" y1="0.70578635%" x2="49.9976632%" y2="96.9898739%" id="linearGradient-1">
+            <stop stop-color="#86BBE5" offset="0%"></stop>
+            <stop stop-color="#1072BA" offset="100%"></stop>
+        </linearGradient>
+    </defs>
+    <g>
+        <path d="M127.788721,0.035213205 C127.788721,0.035213205 203.109766,-3.34525447 243.041541,72.3631362 L121.379917,72.3631362 C121.379917,72.3631362 98.4209078,71.6236589 78.8071527,99.477304 C73.1730399,111.168088 67.1163686,123.211004 73.9125172,146.944704 C64.1232462,130.359285 21.9378267,56.9045392 21.9378267,56.9045392 C21.9378267,56.9045392 51.6929849,3.02833563 127.788721,0.035213205 L127.788721,0.035213205 Z" fill="#EF3F36"></path>
+        <path d="M239.132875,192.228886 C239.132875,192.228886 204.377442,259.169188 118.87978,255.859147 C129.443741,237.583494 179.728198,150.501238 179.728198,150.501238 C179.728198,150.501238 191.876754,130.993122 177.544979,100.075928 C170.255846,89.335901 162.82586,78.1028886 138.88088,72.1166437 C158.142503,71.9405777 242.830261,72.1166437 242.830261,72.1166437 C242.830261,72.1166437 274.557359,124.830812 239.132875,192.228886 L239.132875,192.228886 Z" fill="#FCD900"></path>
+        <path d="M16.9727648,192.757084 C16.9727648,192.757084 -23.6280605,129.197249 22.0082531,56.7988996 C32.5370014,75.074553 82.821458,162.156809 82.821458,162.156809 C82.821458,162.156809 93.6671252,182.439615 127.577442,185.46795 C140.500688,184.517194 153.952132,183.70729 171.136176,165.995048 C161.663824,182.756534 119.161486,256 119.161486,256 C119.161486,256 57.6088033,257.126823 16.9727648,192.757084 L16.9727648,192.757084 Z" fill="#61BC5B"></path>
+        <path d="M118.844567,256.492985 L135.958184,185.080605 C135.958184,185.080605 154.762036,183.601651 170.537552,166.311967 C160.748281,183.531224 118.844567,256.492985 118.844567,256.492985 L118.844567,256.492985 Z" fill="#5AB055"></path>
+        <path d="M70.4616231,129.056396 C70.4616231,97.5757909 95.9911967,72.0462173 127.471802,72.0462173 C158.952407,72.0462173 184.481981,97.5757909 184.481981,129.056396 C184.481981,160.537001 158.952407,186.066575 127.471802,186.066575 C95.9911967,186.031362 70.4616231,160.537001 70.4616231,129.056396 L70.4616231,129.056396 Z" fill="#FFFFFF"></path>
+        <path d="M80.0044017,129.056396 C80.0044017,102.857772 101.237964,81.5889959 127.471802,81.5889959 C153.670426,81.5889959 174.939202,102.822558 174.939202,129.056396 C174.939202,155.255021 153.70564,176.523796 127.471802,176.523796 C101.273177,176.523796 80.0044017,155.255021 80.0044017,129.056396 L80.0044017,129.056396 Z" fill="url(#linearGradient-1)"></path>
+        <path d="M242.795048,72.1518569 L172.333425,92.8220083 C172.333425,92.8220083 161.699037,77.2225585 138.845667,72.1518569 C158.670702,72.0462173 242.795048,72.1518569 242.795048,72.1518569 L242.795048,72.1518569 Z" fill="#EACA05"></path>
+        <path d="M72.5392022,144.338927 C62.6442916,127.190096 21.9378267,56.9045392 21.9378267,56.9045392 L74.1237964,108.527098 C74.1237964,108.527098 68.7713893,119.548831 70.778542,135.324347 L72.5392022,144.338927 L72.5392022,144.338927 Z" fill="#DF3A32"></path>
+    </g>
+</svg>

packages/hoppscotch-app/assets/icons/brands/discord.svg

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="256px" height="199px" viewBox="0 0 256 199" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid">
+    <g>
+        <path d="M216.856339,16.5966031 C200.285002,8.84328665 182.566144,3.2084988 164.041564,0 C161.766523,4.11318106 159.108624,9.64549908 157.276099,14.0464379 C137.583995,11.0849896 118.072967,11.0849896 98.7430163,14.0464379 C96.9108417,9.64549908 94.1925838,4.11318106 91.8971895,0 C73.3526068,3.2084988 55.6133949,8.86399117 39.0420583,16.6376612 C5.61752293,67.146514 -3.4433191,116.400813 1.08711069,164.955721 C23.2560196,181.510915 44.7403634,191.567697 65.8621325,198.148576 C71.0772151,190.971126 75.7283628,183.341335 79.7352139,175.300261 C72.104019,172.400575 64.7949724,168.822202 57.8887866,164.667963 C59.7209612,163.310589 61.5131304,161.891452 63.2445898,160.431257 C105.36741,180.133187 151.134928,180.133187 192.754523,160.431257 C194.506336,161.891452 196.298154,163.310589 198.110326,164.667963 C191.183787,168.842556 183.854737,172.420929 176.223542,175.320965 C180.230393,183.341335 184.861538,190.991831 190.096624,198.16893 C211.238746,191.588051 232.743023,181.531619 254.911949,164.955721 C260.227747,108.668201 245.831087,59.8662432 216.856339,16.5966031 Z M85.4738752,135.09489 C72.8290281,135.09489 62.4592217,123.290155 62.4592217,108.914901 C62.4592217,94.5396472 72.607595,82.7145587 85.4738752,82.7145587 C98.3405064,82.7145587 108.709962,94.5189427 108.488529,108.914901 C108.508531,123.290155 98.3405064,135.09489 85.4738752,135.09489 Z M170.525237,135.09489 C157.88039,135.09489 147.510584,123.290155 147.510584,108.914901 C147.510584,94.5396472 157.658606,82.7145587 170.525237,82.7145587 C183.391518,82.7145587 193.761324,94.5189427 193.539891,108.914901 C193.539891,123.290155 183.391518,135.09489 170.525237,135.09489 Z" fill="#5865F2" fill-rule="nonzero"></path>
+    </g>
+</svg>

packages/hoppscotch-app/assets/icons/brands/facebook.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg"
+aria-label="Facebook" role="img"
+viewBox="0 0 512 512"><rect
+width="512" height="512"
+rx="15%"
+fill="#1877f2"/><path d="M355.6 330l11.4-74h-71v-48c0-20.2 9.9-40 41.7-40H370v-63s-29.3-5-57.3-5c-58.5 0-96.7 35.4-96.7 99.6V256h-65v74h65v182h80V330h59.6z" fill="#fff"/></svg>

packages/hoppscotch-app/assets/icons/brands/firefox.svg

@@ -0,0 +1,201 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg width="256px" height="265px" viewBox="0 0 256 265" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid">
+	<defs>
+		<radialGradient id="SVGID_1_" cx="-14920.2256" cy="-8274.0713" r="124.382" fx="-14928.1611" fy="-8274.0713" gradientTransform="matrix(0.7398 2.920152e-02 -4.866920e-02 1.0902 10886.5264 9537.6963)" gradientUnits="userSpaceOnUse">
+			<stop offset="0.1" style="stop-color:#FFEA00"/>
+			<stop offset="0.17" style="stop-color:#FFDE00"/>
+			<stop offset="0.28" style="stop-color:#FFBF00"/>
+			<stop offset="0.43" style="stop-color:#FF8E00"/>
+			<stop offset="0.77" style="stop-color:#FF272D"/>
+			<stop offset="0.87" style="stop-color:#E0255A"/>
+			<stop offset="0.95" style="stop-color:#CC2477"/>
+			<stop offset="1" style="stop-color:#C42482"/>
+		</radialGradient>
+		<radialGradient id="_Path__1_" cx="-8176.5342" cy="-7746.3013" r="218.2726" gradientTransform="matrix(1.1973 0 0 1.1973 9957.373 9315.5225)" gradientUnits="userSpaceOnUse">
+			<stop offset="0" style="stop-color:#00CCDA"/>
+			<stop offset="0.22" style="stop-color:#0083FF"/>
+			<stop offset="0.26" style="stop-color:#007AF9"/>
+			<stop offset="0.33" style="stop-color:#0060E8"/>
+			<stop offset="0.33" style="stop-color:#005FE7"/>
+			<stop offset="0.44" style="stop-color:#2639AD"/>
+			<stop offset="0.52" style="stop-color:#401E84"/>
+			<stop offset="0.57" style="stop-color:#4A1475"/>
+		</radialGradient>
+		<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="145.2425" y1="481.7857" x2="93.8365" y2="313.6288" gradientTransform="matrix(1 0 0 1 0 -286)">
+			<stop offset="0" style="stop-color:#000F43;stop-opacity:0.4"/>
+			<stop offset="0.48" style="stop-color:#001962;stop-opacity:0.17"/>
+			<stop offset="1" style="stop-color:#002079;stop-opacity:0"/>
+		</linearGradient>
+		<radialGradient id="SVGID_3_" cx="-9132.6758" cy="-6696.7002" r="73.6256" gradientTransform="matrix(1.1875 0.1168 -0.1168 1.1875 10322.1836 9194.8447)" gradientUnits="userSpaceOnUse">
+			<stop offset="0" style="stop-color:#FFEA00"/>
+			<stop offset="0.5" style="stop-color:#FF272D"/>
+			<stop offset="1" style="stop-color:#C42482"/>
+		</radialGradient>
+		<radialGradient id="SVGID_4_" cx="-9139.3379" cy="-6767.2969" r="122.9475" gradientTransform="matrix(1.1875 0.1168 -0.1168 1.1875 10322.1836 9194.8447)" gradientUnits="userSpaceOnUse">
+			<stop offset="0" style="stop-color:#FFE900"/>
+			<stop offset="0.16" style="stop-color:#FFAF0E"/>
+			<stop offset="0.32" style="stop-color:#FF7A1B"/>
+			<stop offset="0.47" style="stop-color:#FF4E26"/>
+			<stop offset="0.62" style="stop-color:#FF2C2E"/>
+			<stop offset="0.76" style="stop-color:#FF1434"/>
+			<stop offset="0.89" style="stop-color:#FF0538"/>
+			<stop offset="1" style="stop-color:#FF0039"/>
+		</radialGradient>
+		<radialGradient id="SVGID_5_" cx="-9121.9473" cy="-6653.3262" r="112.8177" gradientTransform="matrix(1.1875 0.1168 -0.1168 1.1875 10322.1836 9194.8447)" gradientUnits="userSpaceOnUse">
+			<stop offset="0" style="stop-color:#FF272D"/>
+			<stop offset="0.5" style="stop-color:#C42482"/>
+			<stop offset="0.99" style="stop-color:#620700"/>
+		</radialGradient>
+		<radialGradient id="SVGID_6_" cx="227.574" cy="408.42" r="215.776" fx="235.2917" fy="404.6054" gradientTransform="matrix(0.9734 0 0 0.9734 -29.4728 -291.7491)" gradientUnits="userSpaceOnUse">
+			<stop offset="0.16" style="stop-color:#FFEA00"/>
+			<stop offset="0.23" style="stop-color:#FFDE00"/>
+			<stop offset="0.37" style="stop-color:#FFBF00"/>
+			<stop offset="0.54" style="stop-color:#FF8E00"/>
+			<stop offset="0.76" style="stop-color:#FF272D"/>
+			<stop offset="0.8" style="stop-color:#F92433"/>
+			<stop offset="0.84" style="stop-color:#E91C45"/>
+			<stop offset="0.89" style="stop-color:#CF0E62"/>
+			<stop offset="0.94" style="stop-color:#B5007F"/>
+		</radialGradient>
+		<radialGradient id="SVGID_7_" cx="215.2015" cy="308.3499" r="245.9198" gradientTransform="matrix(0.9734 0 0 0.9734 -29.4728 -291.7491)" gradientUnits="userSpaceOnUse">
+			<stop offset="0.28" style="stop-color:#FFEA00"/>
+			<stop offset="0.4" style="stop-color:#FFDD00"/>
+			<stop offset="0.63" style="stop-color:#FFBA00"/>
+			<stop offset="0.86" style="stop-color:#FF9100"/>
+			<stop offset="0.93" style="stop-color:#FF6711"/>
+			<stop offset="0.99" style="stop-color:#FF4A1D"/>
+		</radialGradient>
+		<linearGradient id="SVGID_8_" gradientUnits="userSpaceOnUse" x1="-9348.6621" y1="-6754.1943" x2="-9266.2168" y2="-6775.209" gradientTransform="matrix(1.22 0.12 -0.12 1.22 10634.7598 9460)">
+			<stop offset="0" style="stop-color:#C42482;stop-opacity:0.5"/>
+			<stop offset="0.47" style="stop-color:#FF272D;stop-opacity:0.5"/>
+			<stop offset="0.49" style="stop-color:#FF2C2C;stop-opacity:0.51"/>
+			<stop offset="0.68" style="stop-color:#FF7A1A;stop-opacity:0.72"/>
+			<stop offset="0.83" style="stop-color:#FFB20D;stop-opacity:0.87"/>
+			<stop offset="0.94" style="stop-color:#FFD605;stop-opacity:0.96"/>
+			<stop offset="1" style="stop-color:#FFE302"/>
+		</linearGradient>
+		<linearGradient id="SVGID_9_" gradientUnits="userSpaceOnUse" x1="103.0922" y1="-1126.7808" x2="88.439" y2="-1164.3336" gradientTransform="matrix(0.99 0.1 -0.1 0.99 -175.62 1176.2098)">
+			<stop offset="0" style="stop-color:#891551;stop-opacity:0.6"/>
+			<stop offset="1" style="stop-color:#C42482;stop-opacity:0"/>
+		</linearGradient>
+		<linearGradient id="SVGID_10_" gradientUnits="userSpaceOnUse" x1="-193.2793" y1="534.1769" x2="-168.0087" y2="562.8766" gradientTransform="matrix(0.99 0.1 -0.1 0.99 303.51 -384.2)">
+			<stop offset="1.000000e-02" style="stop-color:#891551;stop-opacity:0.5"/>
+			<stop offset="0.48" style="stop-color:#FF272D;stop-opacity:0.5"/>
+			<stop offset="1" style="stop-color:#FF272D;stop-opacity:0"/>
+		</linearGradient>
+		<linearGradient id="SVGID_11_" gradientUnits="userSpaceOnUse" x1="-144.6839" y1="583.6765" x2="-144.6651" y2="563.5964" gradientTransform="matrix(0.99 0.1 -0.1 0.99 303.51 -384.2)">
+			<stop offset="0" style="stop-color:#C42482"/>
+			<stop offset="8.000000e-02" style="stop-color:#C42482;stop-opacity:0.81"/>
+			<stop offset="0.21" style="stop-color:#C42482;stop-opacity:0.57"/>
+			<stop offset="0.33" style="stop-color:#C42482;stop-opacity:0.36"/>
+			<stop offset="0.45" style="stop-color:#C42482;stop-opacity:0.2"/>
+			<stop offset="0.56" style="stop-color:#C42482;stop-opacity:9.000000e-02"/>
+			<stop offset="0.67" style="stop-color:#C42482;stop-opacity:2.000000e-02"/>
+			<stop offset="0.77" style="stop-color:#C42482;stop-opacity:0"/>
+		</linearGradient>
+		<linearGradient id="SVGID_12_" gradientUnits="userSpaceOnUse" x1="166.5909" y1="295.7137" x2="248.6675" y2="479.2461" gradientTransform="matrix(1 0 0 1 0 -286)">
+			<stop offset="0" style="stop-color:#FFF14F"/>
+			<stop offset="0.27" style="stop-color:#FFEE4C"/>
+			<stop offset="0.45" style="stop-color:#FFE643"/>
+			<stop offset="0.61" style="stop-color:#FFD834"/>
+			<stop offset="0.76" style="stop-color:#FFC41E"/>
+			<stop offset="0.89" style="stop-color:#FFAB02"/>
+			<stop offset="0.9" style="stop-color:#FFA900"/>
+			<stop offset="0.95" style="stop-color:#FFA000"/>
+			<stop offset="1" style="stop-color:#FF9100"/>
+		</linearGradient>
+		<linearGradient id="SVGID_13_" gradientUnits="userSpaceOnUse" x1="182.8878" y1="401.2735" x2="144.0111" y2="505.6616" gradientTransform="matrix(1 0 0 1 0 -286)">
+			<stop offset="0" style="stop-color:#FF8E00"/>
+			<stop offset="4.000000e-02" style="stop-color:#FF8E00;stop-opacity:0.86"/>
+			<stop offset="8.000000e-02" style="stop-color:#FF8E00;stop-opacity:0.73"/>
+			<stop offset="0.13" style="stop-color:#FF8E00;stop-opacity:0.63"/>
+			<stop offset="0.18" style="stop-color:#FF8E00;stop-opacity:0.56"/>
+			<stop offset="0.23" style="stop-color:#FF8E00;stop-opacity:0.51"/>
+			<stop offset="0.28" style="stop-color:#FF8E00;stop-opacity:0.5"/>
+			<stop offset="0.39" style="stop-color:#FF8E00;stop-opacity:0.48"/>
+			<stop offset="0.52" style="stop-color:#FF8E00;stop-opacity:0.42"/>
+			<stop offset="0.68" style="stop-color:#FF8E00;stop-opacity:0.31"/>
+			<stop offset="0.84" style="stop-color:#FF8E00;stop-opacity:0.17"/>
+			<stop offset="1" style="stop-color:#FF8E00;stop-opacity:0"/>
+		</linearGradient>
+	</defs>
+	<g>
+		<path fill="url(#SVGID_1_)" d="M206.8,24.6c-6.4,7.5-9.4,24.3-2.9,41.4s16.5,13.4,22.7,30.8c8.2,23,4.4,53.9,4.4,53.9 s9.9,28.6,16.8-1.8C263.1,91.8,206.8,38.7,206.8,24.6z"/>
+		<path id="_Path_" fill="url(#_Path__1_)" d="M128.4,261.7c65.9,0,119.2-53.6,119.2-119.8S194.2,22.2,128.4,22.2S9.3,75.8 9.3,141.9
+		C9.2,208.1,62.6,261.7,128.4,261.7z"/>
+		<path
+			fill="url(#SVGID_2_)"
+			d="M217.7,215.8c-2.6,1.8-5.3,3.4-8.1,4.9c3.7-5.5,7.2-11.1,10.3-16.9c2.5-2.8,4.9-5.5,6.8-8.5
+		c0.9-1.5,2-3.2,3.1-5.3c6.7-12.1,14.1-31.6,14.3-51.6v-1.5c0-5-0.5-10.1-1.5-15c0.1,0.4,0.1,0.8,0.2,1.2c-0.1-0.3-0.1-0.6-0.2-0.9
+		c0.1,0.5,0.2,1.1,0.3,1.6c1.4,11.6,0.4,22.9-4.5,31.3c-0.1,0.1-0.2,0.2-0.2,0.4c2.5-12.7,3.4-26.7,0.6-40.7c0,0-1.1-6.8-9.5-27.5
+		c-4.8-11.9-13.4-21.7-20.9-28.8c-6.6-8.2-12.7-13.7-16-17.2c-6.9-7.3-9.8-12.8-11-16.3c-1-0.5-14.3-13.4-15.3-13.9
+		c-5.8,9-23.9,37-15.3,63.1c3.9,11.9,13.8,24.2,24.2,31.1c0.5,0.5,6.2,6.7,8.9,20.7c2.8,14.5,1.3,25.7-4.4,42.4
+		c-6.8,14.6-24.2,29.1-40.5,30.6c-34.8,3.2-47.6-17.5-47.6-17.5c12.4,5,26.2,3.9,34.6-1.2c8.4-5.2,13.5-9.1,17.7-7.6
+		c4.1,1.5,7.3-2.9,4.4-7.5c-4.6-7.1-13-10.7-21.3-9.3c-8.4,1.4-16.2,8.1-27.2,1.6c-0.7-0.4-1.4-0.9-2.1-1.4s2.4,0.7,1.6,0.2
+		c-2.1-1.2-6-3.7-6.9-4.6c-0.2-0.2,1.7,0.6,1.5,0.4c-10.3-8.5-9-14.3-8.7-17.9c0.3-2.9,2.1-6.6,5.3-8.1c1.5,0.8,2.5,1.5,2.5,1.5
+		s-0.7-1.3-1-2c0.1-0.1,0.2,0,0.4-0.1c1.3,0.6,4,2.2,5.5,3.1c1.9,1.3,2.5,2.5,2.5,2.5s0.5-0.3,0.1-1.4c-0.1-0.5-0.7-2-2.6-3.5h0.1
+		c1.1,0.6,2.2,1.4,3.2,2.2c0.5-1.9,1.5-3.9,1.3-7.5c-0.1-2.5-0.1-3.2-0.5-4.2c-0.4-0.8,0.2-1.2,0.9-0.3c-0.1-0.7-0.3-1.4-0.6-2v-0.1
+		c0.9-3,18.3-10.9,19.6-11.8c2.1-1.5,3.8-3.4,5.1-5.6c1-1.5,1.7-3.7,1.9-7c0.1-2.4-1-4-18.7-5.8c-4.8-0.5-7.7-4-9.3-7.2
+		c-0.3-0.7-0.6-1.3-0.9-2s-0.5-1.5-0.7-2.3c2.9-8.3,7.7-15.3,14.9-20.6c0.4-0.4-1.6,0.1-1.2-0.3c0.5-0.4,3.4-1.6,4-1.9
+		c0.7-0.3-2.9-1.9-6.1-1.5s-3.9,0.8-5.7,1.5c0.7-0.7,3-1.7,2.5-1.6c-3.5,0.5-7.8,2.6-11.5,4.9c0-0.4,0.1-0.8,0.2-1.2
+		c-1.7,0.7-6,3.7-7.2,6.2c0.1-0.5,0.1-1,0.1-1.5c-1.3,1.1-2.5,2.3-3.5,3.7L85,60.5c-10-4-18.9-4.3-26.3-2.5c-1.6-1.6-2.4-0.4-6.2-8.6
+		c-0.3-0.5,0.2,0.5,0,0c-0.6-1.6,0.4,2.1,0,0c-6.2,5-14.4,10.6-18.4,14.5c0,0.2,4.6-1.3,0,0c-1.6,0.5-1.5,1.4-1.7,10.1
+		c-0.1,0.7,0,1.4-0.1,2c-3.2,4-5.3,7.4-6.1,9.2c-4.1,7-8.6,18-12.9,35.3c1.9-4.7,4.2-9.2,6.9-13.5c-3.6,9.2-7.1,23.7-7.8,45.9
+		c0.9-4.6,2-9.1,3.4-13.6c-0.9,18.5,2.3,36.9,9.3,54c2.5,6.1,6.6,15.4,13.7,25.6c22.2,23.3,53.4,37.8,88,37.8
+		C162.9,256.7,195.4,240.9,217.7,215.8z"/>
+		<path fill="url(#SVGID_3_)" d="M190.9,232.7c43.7-5.1,63.1-50.1,38.2-51C206.7,181,170.2,235.1,190.9,232.7z"/>
+		<path fill="url(#SVGID_4_)" d="M232.3,172.5c30.1-17.5,22.2-55.3,22.2-55.3s-11.6,13.5-19.5,35C227.3,173.5,214.2,183.1,232.3,172.5
+		z"/>
+		<path fill="url(#SVGID_5_)" d="M136.8,255.1c42,13.4,78-19.7,55.8-30.7C172.4,214.5,116.9,248.8,136.8,255.1z"/>
+
+		<path
+			fill="url(#SVGID_6_)"
+			d="M235.5,188.6c1-1.4,2.4-6,3.6-8.1c7.4-12,7.5-21.5,7.5-21.7c4.5-22.3,4.1-31.5,1.3-48.3
+		c-2.2-13.6-11.9-33.1-20.3-42.4c-8.6-9.7-2.6-6.5-10.9-13.6c-7.3-8.1-14.5-16.2-18.3-19.4c-28-23.4-27.4-28.4-26.8-29.2
+		c-0.1,0.1-0.2,0.2-0.4,0.4c-0.3-1.3-0.6-2.4-0.6-2.4S155.2,19.1,152,44.6c-2.1,16.6,4.1,34,13.2,45.1c4.7,5.8,10,11,15.8,15.6l0,0
+		c6.8,9.8,10.6,21.9,10.6,34.9c0,32.6-26.4,58.9-59,58.9c-4.4,0-8.9-0.5-13.2-1.5c-15.4-2.9-24.2-10.7-28.7-16
+		c-2.5-3-3.6-5.2-3.6-5.2c13.8,4.9,29,3.9,38.3-1.2c9.3-5.2,15-9,19.6-7.5c4.5,1.5,8.1-2.9,4.9-7.4c-3.2-4.5-11.4-11-23.6-9.2
+		c-9.3,1.4-17.9,8-30.1,1.6c-0.8-0.4-1.6-0.9-2.3-1.3c-0.8-0.5,2.6,0.7,1.8,0.2c-2.4-1.2-6.6-3.7-7.7-4.6c-0.2-0.2,1.8,0.6,1.7,0.4
+		c-11.4-8.4-10-14.1-9.7-17.7c0.3-2.9,2.4-6.5,5.9-8c1.7,0.8,2.7,1.5,2.7,1.5s-0.7-1.3-1.1-2c0.1-0.1,0.3,0,0.4-0.1
+		c1.4,0.6,4.5,2.1,6.1,3.1c2.1,1.3,2.8,2.5,2.8,2.5s0.6-0.3,0.1-1.4c-0.2-0.5-0.8-2-2.9-3.5h0.1c1.2,0.6,2.4,1.4,3.5,2.2
+		c0.6-1.9,1.6-3.9,1.4-7.5c-0.1-2.5-0.1-3.2-0.6-4.1c-0.4-0.8,0.2-1.2,1-0.3c-0.1-0.7-0.4-1.3-0.7-2V110c1-3,20.3-10.8,21.7-11.7
+		c2.3-1.4,4.2-3.3,5.7-5.5c1.1-1.5,1.9-3.7,2.1-7c0.1-1.5-0.4-2.6-5.5-3.8c-3.1-0.7-7.8-1.3-15.2-2c-5.3-0.5-8.5-3.9-10.3-7.1
+		c-0.3-0.7-0.7-1.3-1-1.9c-0.3-0.7-0.6-1.5-0.8-2.2c3.2-8.4,9-15.5,16.5-20.4c0.4-0.4-1.7,0.1-1.3-0.3c0.5-0.4,3.8-1.6,4.4-1.9
+		c0.8-0.3-3.2-1.8-6.8-1.5c-3.6,0.4-4.3,0.7-6.3,1.5c0.8-0.7,3.3-1.6,2.7-1.6C101,45,96.2,47,92.1,49.3c0-0.4,0.1-0.8,0.2-1.2
+		c-1.9,0.7-6.6,3.7-8,6.2c0.1-0.5,0.1-1,0.1-1.4c-1.4,1.1-2.8,2.3-3.9,3.7l-0.1,0.1c-11.1-4-20.9-4.3-29.1-2.5
+		c-1.8-1.6-4.7-4.1-8.8-12.2c-0.3-0.5-0.4,1-0.6,0.5c-1.6-3.7-2.6-9.8-2.4-14c0,0-3.3,1.5-6,7.8c-0.5,1.1-0.8,1.8-1.2,2.4
+		c-0.2,0.2,0.3-2.1,0.3-1.9c-0.5,0.8-1.7,1.9-2.2,3.4c-0.4,1.1-0.9,1.7-1.2,3l-0.1,0.1c0-0.4,0.1-1.6,0-1.4c-1.3,2.6-2.4,5.3-3.3,8
+		c-1.5,4.8-3.2,11.4-3.5,20c-0.1,0.6,0,1.4-0.1,2c-3.5,4-5.9,7.4-6.8,9.1c-4.5,7-9.5,17.8-14.3,35c2.1-4.7,4.7-9.2,7.7-13.4
+		c-4,9.1-7.9,23.5-8.7,45.5c1-4.6,2.2-9.1,3.7-13.5c-0.7,14.7,1,33,10.3,53.6c5.5,12.1,18.2,36.7,49.3,55.9l0,0
+		c0,0,10.6,7.9,28.7,13.8c1.3,0.5,2.7,1,4.1,1.4c-0.4-0.2-0.9-0.4-1.3-0.5c12.1,3.6,24.6,5.5,37.3,5.5c47,0,60.9-18.9,60.9-18.9
+		l-0.1,0.1c0.7-0.6,1.3-1.3,1.9-1.9c-7.4,7-24.4,7.5-30.7,7c10.8-3.2,17.9-5.9,31.7-11.1c1.6-0.6,3.3-1.3,5-2.1l0.5-0.3
+		c0.3-0.2,0.7-0.3,1-0.5c6.7-3.2,13.1-7.1,18.9-11.8c13.9-11.1,16.9-21.9,18.5-29c-0.2,0.7-0.9,2.3-1.4,3.3
+		c-3.6,7.6-11.5,12.4-20.1,16.4c4.1-5.4,7.9-11,11.4-16.8C232.5,195.9,233.3,191.5,235.5,188.6z"/>
+		<path
+			fill="url(#SVGID_7_)"
+			d="M218.6,215.1c5.7-6.2,10.7-13.4,14.6-21.5c9.9-20.8,25.2-55.5,13.2-91.6
+		c-9.5-28.6-22.6-44.2-39.2-59.5c-27-24.8-34.5-35.9-34.5-42.5c0,0-31.2,34.7-17.7,71s41.2,34.9,59.5,72.7
+		c21.6,44.5-17.4,93.1-49.7,106.7c2-0.4,71.7-16.2,75.4-56.1C240,195,238.4,206.1,218.6,215.1z"/>
+		<path fill="url(#SVGID_8_)" d="M128.2,85.8c0.1-2.4-1.1-3.9-20.6-5.8c-8-0.7-11.1-8.1-12-11.3c-2.8,7.4-4,15.2-3.4,24.6
+		c0.4,6.2,4.6,12.8,6.5,16.6c0,0,0.4-0.6,0.6-0.8c3.7-3.9,19.3-9.8,20.8-10.6C121.8,97.5,128,93,128.2,85.8z"/>
+		<path
+			fill="url(#SVGID_9_)"
+			d="M42.5,42c-0.3-0.5-0.4,1-0.6,0.5c-1.6-3.7-2.6-9.7-2.3-14c0,0-3.3,1.5-6,7.8
+		c-0.5,1.1-0.8,1.8-1.2,2.4c-0.2,0.2,0.3-2.1,0.3-1.9c-0.5,0.8-1.7,1.9-2.2,3.3c-0.4,1.1-0.9,1.8-1.2,3.2c-0.1,0.4,0.1-1.7,0-1.4
+		c-6.4,12.3-7.6,30.9-6.9,30.1C36,57.5,51.5,54.1,51.5,54.1C49.6,52.9,46,49.3,42.5,42L42.5,42z"/>
+		<path fill="url(#SVGID_10_)" d="M93.9,193.4c-18.7-8-40-19.3-39.2-44.9c1.1-33.7,31.5-27.1,31.5-27.1c-1.1,0.3-4.2,2.5-5.3,4.8
+		c-1.1,2.9-3.2,9.5,3.1,16.4c10,10.8-20.5,25.6,26.5,53.6C111.7,196.8,99.5,195.8,93.9,193.4L93.9,193.4z"/>
+		<path
+			fill="url(#SVGID_11_)"
+			d="M87.3,176.6c13.3,4.6,28.7,3.8,38-1.3c6.2-3.5,14.2-9,19-7.6c-4.2-1.7-7.4-2.5-11.3-2.6
+		c-0.7,0-1.4,0-2.1-0.1c-1.4,0-2.8,0.1-4.2,0.2c-2.4,0.2-5,1.7-7.4,1.5c-0.1,0,2.3-1,2.1-1c-1.3,0.3-2.7,0.3-4.1,0.5
+		c-0.9,0.1-1.7,0.2-2.7,0.3c-27.7,2.3-51-15-51-15C61.6,158.1,72.5,171.4,87.3,176.6L87.3,176.6z"/>
+		<path
+			fill="url(#SVGID_12_)"
+			d="M218.5,215.3c28-27.5,42.1-60.8,36.1-98.3c0,0,2.4,19.2-6.7,38.8c4.4-19.2,4.9-43-6.7-67.7
+		c-15.4-32.9-40.8-50.3-50.5-57.5c-14.7-11-20.8-22.1-20.9-24.4c-4.4,9-17.7,39.8-1.4,66.3c15.2,24.9,39.2,32.2,55.9,55
+		C255.3,169.6,218.5,215.3,218.5,215.3z"/>
+		<path fill="url(#SVGID_13_)" d="M214.5,143.8c-9.8-20.2-22-29-33.5-38.5c1.3,1.9,1.7,2.5,2.4,3.8c10.2,10.8,25.1,37.2,14.3,70.4
+		c-20.5,62.4-102.3,33-110.9,24.8c3.5,36.1,63.9,53.4,103.3,30C212.4,212.9,230.5,176.9,214.5,143.8z"/>
+	</g>
+</svg>

packages/hoppscotch-app/assets/icons/brands/linkedin.svg

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="256px" height="256px" viewBox="0 0 256 256" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid">
+    <g>
+        <path d="M218.123122,218.127392 L180.191928,218.127392 L180.191928,158.724263 C180.191928,144.559023 179.939053,126.323993 160.463756,126.323993 C140.707926,126.323993 137.685284,141.757585 137.685284,157.692986 L137.685284,218.123441 L99.7540894,218.123441 L99.7540894,95.9665207 L136.168036,95.9665207 L136.168036,112.660562 L136.677736,112.660562 C144.102746,99.9650027 157.908637,92.3824528 172.605689,92.9280076 C211.050535,92.9280076 218.138927,118.216023 218.138927,151.114151 L218.123122,218.127392 Z M56.9550587,79.2685282 C44.7981969,79.2707099 34.9413443,69.4171797 34.9391618,57.260052 C34.93698,45.1029244 44.7902948,35.2458562 56.9471566,35.2436736 C69.1040185,35.2414916 78.9608713,45.0950217 78.963054,57.2521493 C78.9641017,63.090208 76.6459976,68.6895714 72.5186979,72.8184433 C68.3913982,76.9473153 62.7929898,79.26748 56.9550587,79.2685282 M75.9206558,218.127392 L37.94995,218.127392 L37.94995,95.9665207 L75.9206558,95.9665207 L75.9206558,218.127392 Z M237.033403,0.0182577091 L18.8895249,0.0182577091 C8.57959469,-0.0980923971 0.124827038,8.16056231 -0.001,18.4706066 L-0.001,237.524091 C0.120519052,247.839103 8.57460631,256.105934 18.8895249,255.9977 L237.033403,255.9977 C247.368728,256.125818 255.855922,247.859464 255.999,237.524091 L255.999,18.4548016 C255.851624,8.12438979 247.363742,-0.133792868 237.033403,0.000790807055" fill="#0077b5"></path>
+    </g>
+</svg>

packages/hoppscotch-app/assets/icons/brands/reddit.svg

@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="256px" height="256px" viewBox="0 0 256 256" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid">
+    <g>
+        <circle fill="#f40" cx="128" cy="128" r="128"></circle>
+        <path d="M213.149867,129.220267 C213.149867,118.843733 204.758756,110.603378 194.532978,110.603378 C189.498311,110.603378 184.918756,112.585956 181.562311,115.791644 C168.745244,106.635378 151.195022,100.6848 131.662222,99.9224889 L140.206933,59.9409778 L167.980089,65.8915556 C168.287289,72.9116444 174.084267,78.5578667 181.257956,78.5578667 C188.5824,78.5578667 194.532978,72.6072889 194.532978,65.28 C194.532978,57.9555556 188.5824,52.0049778 181.257956,52.0049778 C176.069689,52.0049778 171.490133,55.0570667 169.353956,59.4830222 L138.377956,52.9208889 C137.462044,52.7672889 136.546133,52.9208889 135.934578,53.3788444 C135.172267,53.8368 134.714311,54.5991111 134.563556,55.5150222 L125.100089,100.073244 C105.262933,100.6848 87.4083556,106.635378 74.4376889,115.945244 C71.0812444,112.739556 66.5016889,110.756978 61.4670222,110.756978 C51.0904889,110.756978 42.8501333,119.148089 42.8501333,129.373867 C42.8501333,137.002667 47.4268444,143.4112 53.8382222,146.312533 C53.5310222,148.141511 53.3802667,149.973333 53.3802667,151.958756 C53.3802667,180.644978 86.7996444,203.995022 128.001422,203.995022 C169.2032,203.995022 202.622578,180.798578 202.622578,151.958756 C202.622578,150.126933 202.468978,148.141511 202.164622,146.312533 C208.573156,143.4112 213.149867,136.849067 213.149867,129.220267 Z M85.2721778,142.495289 C85.2721778,135.170844 91.2227556,129.220267 98.5500444,129.220267 C105.874489,129.220267 111.825067,135.170844 111.825067,142.495289 C111.825067,149.819733 105.874489,155.773156 98.5500444,155.773156 C91.2227556,155.923911 85.2721778,149.819733 85.2721778,142.495289 Z M159.588978,177.746489 C150.432711,186.902756 133.036089,187.514311 128.001422,187.514311 C122.813156,187.514311 105.416533,186.749156 96.4110222,177.746489 C95.04,176.372622 95.04,174.236444 96.4110222,172.862578 C97.7848889,171.491556 99.9210667,171.491556 101.294933,172.862578 C107.094756,178.6624 119.303111,180.644978 128.001422,180.644978 C136.699733,180.644978 149.058844,178.6624 154.705067,172.862578 C156.078933,171.491556 158.215111,171.491556 159.588978,172.862578 C160.809244,174.236444 160.809244,176.372622 159.588978,177.746489 Z M157.1456,155.923911 C149.821156,155.923911 143.870578,149.973333 143.870578,142.648889 C143.870578,135.324444 149.821156,129.373867 157.1456,129.373867 C164.472889,129.373867 170.423467,135.324444 170.423467,142.648889 C170.423467,149.819733 164.472889,155.923911 157.1456,155.923911 Z" fill="#FFFFFF" fill-rule="nonzero"></path>
+    </g>
+</svg>

packages/hoppscotch-app/assets/icons/brands/twitter.svg

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg width="256px" height="209px" viewBox="0 0 256 209" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid">
+    <g>
+        <path d="M256,25.4500259 C246.580841,29.6272672 236.458451,32.4504868 225.834156,33.7202333 C236.678503,27.2198053 245.00583,16.9269929 248.927437,4.66307685 C238.779765,10.6812633 227.539325,15.0523376 215.57599,17.408298 C205.994835,7.2006971 192.34506,0.822 177.239197,0.822 C148.232605,0.822 124.716076,24.3375931 124.716076,53.3423116 C124.716076,57.4586875 125.181462,61.4673784 126.076652,65.3112644 C82.4258385,63.1210453 43.7257252,42.211429 17.821398,10.4359288 C13.3005011,18.1929938 10.710443,27.2151234 10.710443,36.8402889 C10.710443,55.061526 19.9835254,71.1374907 34.0762135,80.5557137 C25.4660961,80.2832239 17.3681846,77.9207088 10.2862577,73.9869292 C10.2825122,74.2060448 10.2825122,74.4260967 10.2825122,74.647085 C10.2825122,100.094453 28.3867003,121.322443 52.413563,126.14673 C48.0059695,127.347184 43.3661509,127.988612 38.5755734,127.988612 C35.1914554,127.988612 31.9009766,127.659938 28.694773,127.046602 C35.3777973,147.913145 54.7742053,163.097665 77.7569918,163.52185 C59.7820257,177.607983 37.1354036,186.004604 12.5289147,186.004604 C8.28987161,186.004604 4.10888474,185.75646 0,185.271409 C23.2431033,200.173139 50.8507261,208.867532 80.5109185,208.867532 C177.116529,208.867532 229.943977,128.836982 229.943977,59.4326002 C229.943977,57.1552968 229.893412,54.8901664 229.792282,52.6381454 C240.053257,45.2331635 248.958338,35.9825545 256,25.4500259" fill="#1da1f2"></path>
+    </g>
+</svg>

packages/hoppscotch-app/assets/icons/check-circle.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"></path><polyline points="22 4 12 14.01 9 11.01"></polyline></svg>

packages/hoppscotch-app/assets/icons/check.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 6 9 17 4 12"></polyline></svg>

packages/hoppscotch-app/assets/icons/chevron-down.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg>

packages/hoppscotch-app/assets/icons/chevron-right.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="9 18 15 12 9 6"></polyline></svg>

packages/hoppscotch-app/assets/icons/circle.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle></svg>

packages/hoppscotch-app/assets/icons/cloud.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 10h-1.26A8 8 0 1 0 9 20h9a5 5 0 0 0 0-10z"></path></svg>

packages/hoppscotch-app/assets/icons/code.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="16 18 22 12 16 6"></polyline><polyline points="8 6 2 12 8 18"></polyline></svg>

packages/hoppscotch-app/assets/icons/copy.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path></svg>

packages/hoppscotch-app/assets/icons/download.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path><polyline points="7 10 12 15 17 10"></polyline><line x1="12" y1="15" x2="12" y2="3"></line></svg>

packages/hoppscotch-app/assets/icons/edit.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M11 4H4a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-7"></path><path d="M18.5 2.5a2.121 2.121 0 0 1 3 3L12 15l-4 1 1-4 9.5-9.5z"></path></svg>

packages/hoppscotch-app/assets/icons/external-link.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"></path><polyline points="15 3 21 3 21 9"></polyline><line x1="10" y1="14" x2="21" y2="3"></line></svg>

packages/hoppscotch-app/assets/icons/eye-off.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24"></path><line x1="1" y1="1" x2="23" y2="23"></line></svg>

packages/hoppscotch-app/assets/icons/eye.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"></path><circle cx="12" cy="12" r="3"></circle></svg>

packages/hoppscotch-app/assets/icons/file-plus.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><polyline points="14 2 14 8 20 8"></polyline><line x1="12" y1="18" x2="12" y2="12"></line><line x1="9" y1="15" x2="15" y2="15"></line></svg>

packages/hoppscotch-app/assets/icons/file-text.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><polyline points="14 2 14 8 20 8"></polyline><line x1="16" y1="13" x2="8" y2="13"></line><line x1="16" y1="17" x2="8" y2="17"></line><polyline points="10 9 9 9 8 9"></polyline></svg>

packages/hoppscotch-app/assets/icons/file.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z"></path><polyline points="13 2 13 9 20 9"></polyline></svg>

packages/hoppscotch-app/assets/icons/folder-minus.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"></path><line x1="9" y1="14" x2="15" y2="14"></line></svg>

packages/hoppscotch-app/assets/icons/folder-plus.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"></path><line x1="12" y1="11" x2="12" y2="17"></line><line x1="9" y1="14" x2="15" y2="14"></line></svg>

packages/hoppscotch-app/assets/icons/folder.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z"></path></svg>

packages/hoppscotch-app/assets/icons/gift.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="20 12 20 22 4 22 4 12"></polyline><rect x="2" y="7" width="20" height="5"></rect><line x1="12" y1="22" x2="12" y2="7"></line><path d="M12 7H7.5a2.5 2.5 0 0 1 0-5C11 2 12 7 12 7z"></path><path d="M12 7h4.5a2.5 2.5 0 0 0 0-5C13 2 12 7 12 7z"></path></svg>

packages/hoppscotch-app/assets/icons/github.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.87a3.37 3.37 0 0 0-.94-2.61c3.14-.35 6.44-1.54 6.44-7A5.44 5.44 0 0 0 20 4.77 5.07 5.07 0 0 0 19.91 1S18.73.65 16 2.48a13.38 13.38 0 0 0-7 0C6.27.65 5.09 1 5.09 1A5.07 5.07 0 0 0 5 4.77a5.44 5.44 0 0 0-1.5 3.78c0 5.42 3.3 6.61 6.44 7A3.37 3.37 0 0 0 9 18.13V22"></path></svg>

packages/hoppscotch-app/assets/icons/globe.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><line x1="2" y1="12" x2="22" y2="12"></line><path d="M12 2a15.3 15.3 0 0 1 4 10 15.3 15.3 0 0 1-4 10 15.3 15.3 0 0 1-4-10 15.3 15.3 0 0 1 4-10z"></path></svg>

packages/hoppscotch-app/assets/icons/graphql.svg

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

packages/hoppscotch-app/assets/icons/help-circle.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><path d="M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3"></path><line x1="12" y1="17" x2="12.01" y2="17"></line></svg>

packages/hoppscotch-app/assets/icons/home.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z"></path><polyline points="9 22 9 12 15 12 15 22"></polyline></svg>

packages/hoppscotch-app/assets/icons/inbox.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="22 12 16 12 14 15 10 15 8 12 2 12"></polyline><path d="M5.45 5.11L2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z"></path></svg>

packages/hoppscotch-app/assets/icons/info.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="16" x2="12" y2="12"></line><line x1="12" y1="8" x2="12.01" y2="8"></line></svg>

packages/hoppscotch-app/assets/icons/key.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 2l-2 2m-7.61 7.61a5.5 5.5 0 1 1-7.778 7.778 5.5 5.5 0 0 1 7.777-7.777zm0 0L15.5 7.5m0 0l3 3L22 7l-3-3m-3.5 3.5L19 4"></path></svg>

packages/hoppscotch-app/assets/icons/layers.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 2 7 12 12 22 7 12 2"></polygon><polyline points="2 17 12 22 22 17"></polyline><polyline points="2 12 12 17 22 12"></polyline></svg>

packages/hoppscotch-app/assets/icons/life-buoy.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><circle cx="12" cy="12" r="4"></circle><line x1="4.93" y1="4.93" x2="9.17" y2="9.17"></line><line x1="14.83" y1="14.83" x2="19.07" y2="19.07"></line><line x1="14.83" y1="9.17" x2="19.07" y2="4.93"></line><line x1="14.83" y1="9.17" x2="18.36" y2="5.64"></line><line x1="4.93" y1="19.07" x2="9.17" y2="14.83"></line></svg>

packages/hoppscotch-app/assets/icons/link-2.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M15 7h3a5 5 0 0 1 5 5 5 5 0 0 1-5 5h-3m-6 0H6a5 5 0 0 1-5-5 5 5 0 0 1 5-5h3"></path><line x1="8" y1="12" x2="16" y2="12"></line></svg>

packages/hoppscotch-app/assets/icons/loader.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="12" y1="2" x2="12" y2="6"></line><line x1="12" y1="18" x2="12" y2="22"></line><line x1="4.93" y1="4.93" x2="7.76" y2="7.76"></line><line x1="16.24" y1="16.24" x2="19.07" y2="19.07"></line><line x1="2" y1="12" x2="6" y2="12"></line><line x1="18" y1="12" x2="22" y2="12"></line><line x1="4.93" y1="19.07" x2="7.76" y2="16.24"></line><line x1="16.24" y1="7.76" x2="19.07" y2="4.93"></line></svg>

packages/hoppscotch-app/assets/icons/lock.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg>

packages/hoppscotch-app/assets/icons/log-out.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"></path><polyline points="16 17 21 12 16 7"></polyline><line x1="21" y1="12" x2="9" y2="12"></line></svg>

packages/hoppscotch-app/assets/icons/mail.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"></path><polyline points="22,6 12,13 2,6"></polyline></svg>

packages/hoppscotch-app/assets/icons/maximize-2.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="15 3 21 3 21 9"></polyline><polyline points="9 21 3 21 3 15"></polyline><line x1="21" y1="3" x2="14" y2="10"></line><line x1="3" y1="21" x2="10" y2="14"></line></svg>

packages/hoppscotch-app/assets/icons/maximize.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M8 3H5a2 2 0 0 0-2 2v3m18 0V5a2 2 0 0 0-2-2h-3m0 18h3a2 2 0 0 0 2-2v-3M3 16v3a2 2 0 0 0 2 2h3"></path></svg>

packages/hoppscotch-app/assets/icons/message-circle.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z"></path></svg>

packages/hoppscotch-app/assets/icons/minimize-2.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="4 14 10 14 10 20"></polyline><polyline points="20 10 14 10 14 4"></polyline><line x1="14" y1="10" x2="21" y2="3"></line><line x1="3" y1="21" x2="10" y2="14"></line></svg>

packages/hoppscotch-app/assets/icons/minimize.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M8 3v3a2 2 0 0 1-2 2H3m18 0h-3a2 2 0 0 1-2-2V3m0 18v-3a2 2 0 0 1 2-2h3M3 16h3a2 2 0 0 1 2 2v3"></path></svg>

packages/hoppscotch-app/assets/icons/monitor.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="3" width="20" height="14" rx="2" ry="2"></rect><line x1="8" y1="21" x2="16" y2="21"></line><line x1="12" y1="17" x2="12" y2="21"></line></svg>

packages/hoppscotch-app/assets/icons/moon.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z"></path></svg>

packages/hoppscotch-app/assets/icons/more-vertical.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="1"></circle><circle cx="12" cy="5" r="1"></circle><circle cx="12" cy="19" r="1"></circle></svg>

packages/hoppscotch-app/assets/icons/paperclip.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21.44 11.05l-9.19 9.19a6 6 0 0 1-8.49-8.49l9.19-9.19a4 4 0 0 1 5.66 5.66l-9.2 9.19a2 2 0 0 1-2.83-2.83l8.49-8.48"></path></svg>

packages/hoppscotch-app/assets/icons/play.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="5 3 19 12 5 21 5 3"></polygon></svg>

packages/hoppscotch-app/assets/icons/plus-circle.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="8" x2="12" y2="16"></line><line x1="8" y1="12" x2="16" y2="12"></line></svg>

packages/hoppscotch-app/assets/icons/plus.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="12" y1="5" x2="12" y2="19"></line><line x1="5" y1="12" x2="19" y2="12"></line></svg>

packages/hoppscotch-app/assets/icons/refresh-cw.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="23 4 23 10 17 10"></polyline><polyline points="1 20 1 14 7 14"></polyline><path d="M3.51 9a9 9 0 0 1 14.85-3.36L23 10M1 14l4.64 4.36A9 9 0 0 0 20.49 15"></path></svg>

packages/hoppscotch-app/assets/icons/rotate-ccw.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="1 4 1 10 7 10"></polyline><path d="M3.51 15a9 9 0 1 0 2.13-9.36L1 10"></path></svg>

packages/hoppscotch-app/assets/icons/save.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M19 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11l5 5v11a2 2 0 0 1-2 2z"></path><polyline points="17 21 17 13 7 13 7 21"></polyline><polyline points="7 3 7 8 15 8"></polyline></svg>

packages/hoppscotch-app/assets/icons/search.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="11" cy="11" r="8"></circle><line x1="21" y1="21" x2="16.65" y2="16.65"></line></svg>

packages/hoppscotch-app/assets/icons/settings.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="3"></circle><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"></path></svg>

packages/hoppscotch-app/assets/icons/share-2.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="18" cy="5" r="3"></circle><circle cx="6" cy="12" r="3"></circle><circle cx="18" cy="19" r="3"></circle><line x1="8.59" y1="13.51" x2="15.42" y2="17.49"></line><line x1="15.41" y1="6.51" x2="8.59" y2="10.49"></line></svg>

packages/hoppscotch-app/assets/icons/sidebar.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2" ry="2"></rect><line x1="9" y1="3" x2="9" y2="21"></line></svg>

packages/hoppscotch-app/assets/icons/star-solid.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon></svg>

packages/hoppscotch-app/assets/icons/star.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon></svg>

packages/hoppscotch-app/assets/icons/sun.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="5"></circle><line x1="12" y1="1" x2="12" y2="3"></line><line x1="12" y1="21" x2="12" y2="23"></line><line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line><line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line><line x1="1" y1="12" x2="3" y2="12"></line><line x1="21" y1="12" x2="23" y2="12"></line><line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line><line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line></svg>

packages/hoppscotch-app/assets/icons/terminal.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="4 17 10 11 4 5"></polyline><line x1="12" y1="19" x2="20" y2="19"></line></svg>

packages/hoppscotch-app/assets/icons/trash-2.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="3 6 5 6 21 6"></polyline><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path><line x1="10" y1="11" x2="10" y2="17"></line><line x1="14" y1="11" x2="14" y2="17"></line></svg>

packages/hoppscotch-app/assets/icons/trash.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="3 6 5 6 21 6"></polyline><path d="M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6m3 0V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2"></path></svg>

packages/hoppscotch-app/assets/icons/twitter.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M23 3a10.9 10.9 0 0 1-3.14 1.53 4.48 4.48 0 0 0-7.86 3v1A10.66 10.66 0 0 1 3 4s-4 9 5 13a11.64 11.64 0 0 1-7 2c9 5 20 0 20-11.5a4.5 4.5 0 0 0-.08-.83A7.72 7.72 0 0 0 23 3z"></path></svg>

packages/hoppscotch-app/assets/icons/type.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="4 7 4 4 20 4 20 7"></polyline><line x1="9" y1="20" x2="15" y2="20"></line><line x1="12" y1="4" x2="12" y2="20"></line></svg>

packages/hoppscotch-app/assets/icons/upload-cloud.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="16 16 12 12 8 16"></polyline><line x1="12" y1="12" x2="12" y2="21"></line><path d="M20.39 18.39A5 5 0 0 0 18 9h-1.26A8 8 0 1 0 3 16.3"></path><polyline points="16 16 12 12 8 16"></polyline></svg>

packages/hoppscotch-app/assets/icons/user-plus.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M16 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path><circle cx="8.5" cy="7" r="4"></circle><line x1="20" y1="8" x2="20" y2="14"></line><line x1="23" y1="11" x2="17" y2="11"></line></svg>

packages/hoppscotch-app/assets/icons/user.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"></path><circle cx="12" cy="7" r="4"></circle></svg>

packages/hoppscotch-app/assets/icons/users.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path><circle cx="9" cy="7" r="4"></circle><path d="M23 21v-2a4 4 0 0 0-3-3.87"></path><path d="M16 3.13a4 4 0 0 1 0 7.75"></path></svg>

packages/hoppscotch-app/assets/icons/x.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>

packages/hoppscotch-app/assets/icons/zap.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polygon points="13 2 3 14 12 14 11 22 21 10 12 10 13 2"></polygon></svg>

packages/hoppscotch-app/assets/js/getLinkTag.js

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

packages/hoppscotch-app/assets/js/regex.worker.js

@@ -0,0 +1,32 @@
+function generateREForProtocol(protocol) {
+  return [
+    new RegExp(
+      `${protocol}(([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5]).){3}([0-9]|[1-9][0-9]|1[0-9]{2}|2[0-4][0-9]|25[0-5])$`
+    ),
+    new RegExp(
+      `${protocol}(([a-zA-Z0-9]|[a-zA-Z0-9][a-zA-Z0-9-]*[a-zA-Z0-9]).)*([A-Za-z0-9]|[A-Za-z0-9][A-Za-z0-9-]*[A-Za-z0-9/])$`
+    ),
+  ]
+}
+
+const ws = generateREForProtocol("^(wss?:\\/\\/)?")
+const sse = generateREForProtocol("^(https?:\\/\\/)?")
+const socketio = generateREForProtocol("^((wss?:\\/\\/)|(https?:\\/\\/))?")
+const regex = { ws, sse, socketio }
+
+// type = ws/sse/socketio
+async function validator(type, url) {
+  console.time(`validator ${url}`)
+  const [res1, res2] = await Promise.all([
+    regex[type][0].test(url),
+    regex[type][1].test(url),
+  ])
+  console.timeEnd(`validator ${url}`)
+  return res1 || res2
+}
+
+onmessage = async ({ data }) => {
+  const { type, url } = data
+  const result = await validator(type, url)
+  postMessage({ type, url, result })
+}

packages/hoppscotch-app/assets/md/docs.md

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

packages/hoppscotch-app/assets/md/folderBody.md

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

packages/hoppscotch-app/assets/md/folderContents.md

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

packages/hoppscotch-app/assets/scss/styles.scss

@@ -0,0 +1,468 @@
+*,
+*::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,
+textarea::placeholder {
+  @apply text-secondaryDark;
+  @apply opacity-25;
+}
+
+input,
+textarea {
+  @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;
+  @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-primary;
+  @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";
+  }
+}
+
+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);
+  }
+}

packages/hoppscotch-app/assets/scss/themes.scss

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

packages/hoppscotch-app/components/README.md

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

packages/hoppscotch-app/components/app/Announcement.vue

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

packages/hoppscotch-app/components/app/Footer.vue

@@ -0,0 +1,185 @@
+<template>
+  <div>
+    <div class="flex justify-between">
+      <div class="flex">
+        <ButtonSecondary
+          v-tippy="{ theme: 'tooltip' }"
+          :title="LEFT_SIDEBAR ? $t('hide.sidebar') : $t('show.sidebar')"
+          svg="sidebar"
+          :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')}`"
+          :svg="ZEN_MODE ? 'minimize' : 'maximize'"
+          :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
+                svg="help-circle"
+                class="!rounded-none"
+                :label="$t('app.help')"
+              />
+            </template>
+            <div class="flex flex-col">
+              <SmartItem
+                svg="book"
+                :label="$t('app.documentation')"
+                to="https://docs.hoppscotch.io"
+                blank
+                @click.native="$refs.options.tippy().hide()"
+              />
+              <SmartItem
+                svg="zap"
+                :label="$t('app.keyboard_shortcuts')"
+                @click.native="
+                  showShortcuts = true
+                  $refs.options.tippy().hide()
+                "
+              />
+              <SmartItem
+                svg="gift"
+                :label="$t('app.whats_new')"
+                to="https://docs.hoppscotch.io/changelog"
+                blank
+                @click.native="$refs.options.tippy().hide()"
+              />
+              <SmartItem
+                svg="message-circle"
+                :label="$t('app.chat_with_us')"
+                @click.native="
+                  chatWithUs()
+                  $refs.options.tippy().hide()
+                "
+              />
+              <hr />
+              <SmartItem
+                svg="twitter"
+                :label="$t('app.twitter')"
+                to="https://hoppscotch.io/twitter"
+                blank
+                @click.native="$refs.options.tippy().hide()"
+              />
+              <SmartItem
+                svg="user-plus"
+                :label="$t('app.invite')"
+                @click.native="
+                  showShare = true
+                  $refs.options.tippy().hide()
+                "
+              />
+              <SmartItem
+                svg="lock"
+                :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' }"
+          svg="zap"
+          :title="$t('app.shortcuts')"
+          @click.native="showShortcuts = true"
+        />
+        <ButtonSecondary
+          v-if="navigatorShare"
+          v-tippy="{ theme: 'tooltip' }"
+          svg="share-2"
+          :title="$t('request.share')"
+          @click.native="nativeShare()"
+        />
+        <ButtonSecondary
+          v-tippy="{ theme: 'tooltip' }"
+          :title="RIGHT_SIDEBAR ? $t('hide.sidebar') : $t('show.sidebar')"
+          svg="sidebar"
+          class="transform rotate-180"
+          :class="{ 'rotate-360': !RIGHT_SIDEBAR }"
+          @click.native="RIGHT_SIDEBAR = !RIGHT_SIDEBAR"
+        />
+      </div>
+    </div>
+    <AppShortcuts :show="showShortcuts" @close="showShortcuts = false" />
+    <AppShare :show="showShare" @hide-modal="showShare = 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)
+    const showShare = ref(false)
+
+    defineActionHandler("flyouts.keybinds.toggle", () => {
+      showShortcuts.value = !showShortcuts.value
+    })
+
+    defineActionHandler("modals.share.toggle", () => {
+      showShare.value = !showShare.value
+    })
+
+    return {
+      LEFT_SIDEBAR: useSetting("LEFT_SIDEBAR"),
+      RIGHT_SIDEBAR: useSetting("RIGHT_SIDEBAR"),
+      ZEN_MODE: useSetting("ZEN_MODE"),
+
+      navigatorShare: !!navigator.share,
+
+      showShortcuts,
+      showShare,
+    }
+  },
+  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>

packages/hoppscotch-app/components/app/Fuse.vue

@@ -0,0 +1,38 @@
+<template>
+  <div key="outputHash">
+    <AppPowerSearchEntry
+      v-for="(shortcut, shortcutIndex) in searchResults"
+      :key="`shortcut-${shortcutIndex}`"
+      :ref="`item-${shortcutIndex}`"
+      :shortcut="shortcut.item"
+      @action="$emit('action', shortcut.item.action)"
+    />
+    <div
+      v-if="searchResults.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") }} "{{ search }}"
+      </span>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { computed } from "@nuxtjs/composition-api"
+import Fuse from "fuse.js"
+
+const props = defineProps<{
+  input: Record<string, any>[]
+  search: string
+}>()
+
+const options = {
+  keys: ["keys", "label", "action", "tags"],
+}
+
+const fuse = new Fuse(props.input, options)
+
+const searchResults = computed(() => fuse.search(props.search))
+</script>

packages/hoppscotch-app/components/app/GitHubStarButton.vue

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

packages/hoppscotch-app/components/app/Header.vue

@@ -0,0 +1,166 @@
+<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 hidden sm:flex" />
+      </div>
+      <div class="space-x-2 inline-flex items-center">
+        <ButtonSecondary
+          id="installPWA"
+          v-tippy="{ theme: 'tooltip' }"
+          :title="$t('header.install_pwa')"
+          svg="download"
+          class="rounded"
+          @click.native="showInstallPrompt()"
+        />
+        <ButtonSecondary
+          v-tippy="{ theme: 'tooltip' }"
+          :title="`${$t('app.search')} <kbd>/</kbd>`"
+          svg="search"
+          class="rounded"
+          @click.native="showSearch = true"
+        />
+        <ButtonSecondary
+          v-tippy="{ theme: 'tooltip' }"
+          :title="`${$t('support.title')} <kbd>?</kbd>`"
+          svg="life-buoy"
+          class="rounded"
+          @click.native="showSupport = true"
+        />
+        <ButtonSecondary
+          v-if="currentUser === null"
+          svg="upload-cloud"
+          :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="px-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"
+                svg="user"
+              />
+            </template>
+            <SmartItem
+              to="/settings"
+              svg="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" />
+    <AppSupport :show="showSupport" @hide-modal="showSupport = false" />
+    <AppPowerSearch :show="showSearch" @hide-modal="showSearch = false" />
+  </div>
+</template>
+
+<script>
+import { defineComponent, ref } 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"
+import { defineActionHandler } from "~/helpers/actions"
+
+export default defineComponent({
+  setup() {
+    const showSupport = ref(false)
+    const showSearch = ref(false)
+
+    defineActionHandler("modals.support.toggle", () => {
+      showSupport.value = !showSupport.value
+    })
+    defineActionHandler("modals.search.toggle", () => {
+      showSearch.value = !showSearch.value
+    })
+
+    return {
+      currentUser: useReadonlyStream(currentUser$, null),
+      showSupport,
+      showSearch,
+    }
+  },
+  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>

packages/hoppscotch-app/components/app/Logo.vue

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