feat(welcome-guide): 💥 add welcome guide

robolaunch · Sep 19, 2023 · 13a3003 · 13a3003
1 parent 62d90d0
commit 13a3003
Show file tree

Hide file tree

Showing 5 changed files with 42 additions and 1 deletion.
diff --git a/public/css/style.css b/public/css/style.css
@@ -1457,6 +1457,20 @@ video {
           transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
 
+.scale-105 {
+  --tw-scale-x: 1.05;
+  --tw-scale-y: 1.05;
+  -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+          transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
+.scale-110 {
+  --tw-scale-x: 1.1;
+  --tw-scale-y: 1.1;
+  -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+          transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
 .transform {
   -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
           transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));

diff --git a/src/components/RobotHeaderTabs/RobotHeaderTabs.tsx b/src/components/RobotHeaderTabs/RobotHeaderTabs.tsx
@@ -35,7 +35,10 @@ export default function RobotHeaderTabs(): ReactElement {
           isSettedCookie
         ),
       isHidden:
-        envOnPremiseRobot || (responseRobot && !responseRobot?.bridgeEnabled),
+        // hidden for now
+        true ||
+        envOnPremiseRobot ||
+        (responseRobot && !responseRobot?.bridgeEnabled),
     },
     {
       name: "Teleoperation",

diff --git a/src/components/WelcomeGuide/WelcomeGuide.tsx b/src/components/WelcomeGuide/WelcomeGuide.tsx
@@ -0,0 +1,15 @@
+import React, { ReactElement } from "react";
+
+export default function WelcomeGuide(): ReactElement {
+  return (
+    <div className="flex flex-col items-center text-center gap-2">
+      <img className="w-40 scale-110" src="/images/rocket.svg" alt="logo" />
+      <h3 className="text-xl font-semibold ">Welcome to Robolaunch</h3>
+      <p>
+        robolaunch is a Cloud-Native Robotics Platform that provides the
+        end-to-end infrastructure, software stack and tools for developing,
+        simulating, deploying and operating ROS/ROS2 robots at scale.
+      </p>{" "}
+    </div>
+  );
+}
diff --git a/src/functions/handleGuide.tsx b/src/functions/handleGuide.tsx
@@ -1,11 +1,19 @@
 import GuideContainer from "../components/GuideContainer/GuideContainer";
+import WelcomeGuide from "../components/WelcomeGuide/WelcomeGuide";
 import { envOnPremiseFleet, envOnPremiseRobot } from "../helpers/envProvider";
 
 export function getGuideItem(guide: string) {
   switch (guide) {
+    case "welcome":
+      return {
+        selector: guide,
+        content: () => <WelcomeGuide />,
+      };
+
     case '[data-tut="marketplace-sidebar-menu-item"]':
       return {
         selector: guide,
+        position: "center",
         content: () => (
           <GuideContainer
             title="Marketplace"

diff --git a/src/pages/DashboardsPage/MainDashboardPage/MainDashboardPage.tsx b/src/pages/DashboardsPage/MainDashboardPage/MainDashboardPage.tsx
@@ -111,6 +111,7 @@ export default function MainDashboardPage(): ReactElement {
             <TourGuide
               type="main"
               tourConfig={[
+                getGuideItem("welcome"),
                 getGuideItem('[data-tut="organization-sidebar-menu-item"]'),
                 getGuideItem('[data-tut="roboticscloud-sidebar-menu-item"]'),
                 getGuideItem('[data-tut="instance-sidebar-menu-item"]'),