From 944ac896f219254402936fdbc94cc15f278462c2 Mon Sep 17 00:00:00 2001 From: supervoidcoder <88671013+supervoidcoder@users.noreply.github.com> Date: Tue, 2 Dec 2025 00:19:20 +0000 Subject: [PATCH 1/7] feat: add welcome modal --- src/components/gui/gui.jsx | 10 +- src/components/welcome-modal/addons-step.css | 71 +++++++ src/components/welcome-modal/addons-step.jsx | 46 +++++ src/components/welcome-modal/final-step.css | 110 ++++++++++ src/components/welcome-modal/final-step.jsx | 57 ++++++ src/components/welcome-modal/theme-step.css | 125 ++++++++++++ src/components/welcome-modal/theme-step.jsx | 149 ++++++++++++++ .../welcome-modal/welcome-modal.css | 134 ++++++++++++ .../welcome-modal/welcome-modal.jsx | 193 ++++++++++++++++++ src/components/welcome-modal/welcome-step.css | 89 ++++++++ src/components/welcome-modal/welcome-step.jsx | 58 ++++++ src/containers/gui.jsx | 7 +- 12 files changed, 1047 insertions(+), 2 deletions(-) create mode 100644 src/components/welcome-modal/addons-step.css create mode 100644 src/components/welcome-modal/addons-step.jsx create mode 100644 src/components/welcome-modal/final-step.css create mode 100644 src/components/welcome-modal/final-step.jsx create mode 100644 src/components/welcome-modal/theme-step.css create mode 100644 src/components/welcome-modal/theme-step.jsx create mode 100644 src/components/welcome-modal/welcome-modal.css create mode 100644 src/components/welcome-modal/welcome-modal.jsx create mode 100644 src/components/welcome-modal/welcome-step.css create mode 100644 src/components/welcome-modal/welcome-step.jsx diff --git a/src/components/gui/gui.jsx b/src/components/gui/gui.jsx index a96c5f16c..daff0481a 100644 --- a/src/components/gui/gui.jsx +++ b/src/components/gui/gui.jsx @@ -8,7 +8,7 @@ import MediaQuery from 'react-responsive'; import {Tab, Tabs, TabList, TabPanel} from 'react-tabs'; import tabStyles from 'react-tabs/style/react-tabs.css'; import VM from 'scratch-vm'; - +import WelcomeModal from '../welcome-modal/welcome-modal.jsx'; import Blocks from '../../containers/blocks.jsx'; import CostumeTab from '../../containers/costume-tab.jsx'; import TargetPane from '../../containers/target-pane.jsx'; @@ -160,9 +160,11 @@ const GUIComponent = props => { fontsModalVisible, unknownPlatformModalVisible, invalidProjectModalVisible, + showWelcomeModal, vm, ...componentProps } = omit(props, 'dispatch'); + console.log('🎯 showWelcomeModal:', showWelcomeModal); if (children) { return {children}; } @@ -238,6 +240,10 @@ const GUIComponent = props => { {...componentProps} > {alwaysEnabledModals} + {showWelcomeModal ? ( + + ) : null} {telemetryModalVisible ? ( ( +
+
+
+ {/* Your SVG illustration goes here! */} +
+ 🧩 Your addons SVG illustration here! +
+
+ +
+

Set Up Your Addons 🧩

+

+ Customize OmniBlocks with powerful extensions +

+
+
+ +
+