From 4772679c425bdb150f5749158dfb1673daac6b90 Mon Sep 17 00:00:00 2001 From: Alok Gupta Date: Thu, 27 Jun 2024 23:07:38 +0530 Subject: [PATCH 01/17] feat : add tour for first time user --- apps/studio/package.json | 5 +- apps/studio/src/App.tsx | 18 +- apps/studio/src/components/Editor/Editor.tsx | 2 +- .../src/components/Editor/EditorSidebar.tsx | 2 +- apps/studio/src/components/Navigationv3.tsx | 2 +- apps/studio/src/components/Sidebar.tsx | 16 +- .../src/components/Template/HTMLWrapper.tsx | 2 +- .../src/components/Terminal/Terminal.tsx | 2 +- apps/studio/src/components/Toolbar.tsx | 4 +- apps/studio/src/helpers/driver.ts | 114 + apps/studio/src/main.css | 62 + apps/studio/src/state/other.state.ts | 2 +- pnpm-lock.yaml | 24363 +++++++++------- 13 files changed, 13702 insertions(+), 10892 deletions(-) create mode 100644 apps/studio/src/helpers/driver.ts diff --git a/apps/studio/package.json b/apps/studio/package.json index 1d324c8d5..ea3875cb9 100644 --- a/apps/studio/package.json +++ b/apps/studio/package.json @@ -36,6 +36,7 @@ "@monaco-editor/react": "^4.4.6", "@stoplight/yaml": "^4.3.0", "@tippyjs/react": "^4.2.6", + "driver.js": "^1.3.1", "js-base64": "^3.7.3", "js-file-download": "^0.4.12", "js-yaml": "^4.1.0", @@ -108,6 +109,7 @@ "conventional-changelog-conventionalcommits": "^5.0.0", "cross-env": "^7.0.3", "esbuild": "0.18.20", + "eslint-config-custom": "workspace:*", "https-browserify": "^1.0.0", "markdown-toc": "^1.2.0", "path-browserify": "^1.0.1", @@ -123,8 +125,7 @@ "url": "^0.11.0", "util": "^0.12.5", "web-vitals": "^3.1.0", - "webpack": "^5.75.0", - "eslint-config-custom": "workspace:*" + "webpack": "^5.75.0" }, "jest": { "transformIgnorePatterns": [ diff --git a/apps/studio/src/App.tsx b/apps/studio/src/App.tsx index bfb54b021..23fdc416e 100644 --- a/apps/studio/src/App.tsx +++ b/apps/studio/src/App.tsx @@ -1,9 +1,19 @@ import { AsyncAPIStudio } from './studio'; -import type { FunctionComponent } from 'react'; +import type { FunctionComponent } from "react"; +import { useEffect } from "react"; +import { driverObj } from "./helpers/driver"; export const App: FunctionComponent = () => { - return ( - - ); + useEffect(() => { + const alreadyVisitedSession = sessionStorage.getItem("alreadyVisited"); + const alreadyVisitedLocal = localStorage.getItem("alreadyVisited"); + if (!alreadyVisitedSession && !alreadyVisitedLocal) { + sessionStorage.setItem("alreadyVisited", "true"); + localStorage.setItem("alreadyVisited", "true"); + driverObj.drive(); + } + }, []); + + return ; }; diff --git a/apps/studio/src/components/Editor/Editor.tsx b/apps/studio/src/components/Editor/Editor.tsx index 380c6607e..cd6547bb1 100644 --- a/apps/studio/src/components/Editor/Editor.tsx +++ b/apps/studio/src/components/Editor/Editor.tsx @@ -21,7 +21,7 @@ export const Editor: React.FunctionComponent = () => { size={editorHeight} defaultSize={editorHeight} > -
+
diff --git a/apps/studio/src/components/Editor/EditorSidebar.tsx b/apps/studio/src/components/Editor/EditorSidebar.tsx index c8e304796..ce18029aa 100644 --- a/apps/studio/src/components/Editor/EditorSidebar.tsx +++ b/apps/studio/src/components/Editor/EditorSidebar.tsx @@ -36,7 +36,7 @@ export const EditorSidebar: React.FunctionComponent< className="flex flex-row items-center" style={{ height: '30px', lineHeight: '30px' }} > -
+