From 99aacbc6cc48d12445e629dab6f3b8d5dcb521b1 Mon Sep 17 00:00:00 2001 From: Julien Toussaint Dang <79483707+JulienTD23@users.noreply.github.com> Date: Sat, 6 Dec 2025 12:23:43 -0500 Subject: [PATCH] Tutorial feature implementation --- .../time_select_component.tsx | 2 +- src/components/Home/HomePage.tsx | 20 ++ src/components/navbar/NavBar.tsx | 25 ++ .../TutorialModal/EditAvailable.mp4 | Bin 0 -> 742578 bytes .../TutorialModal/EventDeletion.mp4 | Bin 0 -> 652901 bytes .../components/TutorialModal/EventDetails.png | Bin 0 -> 48533 bytes .../TutorialModal/GeneralDaysTutorial.png | Bin 0 -> 47480 bytes .../components/TutorialModal/Meeting.mp4 | Bin 0 -> 264153 bytes .../TutorialModal/SelectDaysTutorial.png | Bin 0 -> 128477 bytes .../utils/components/TutorialModal/Share.mp4 | Bin 0 -> 144951 bytes .../TutorialModal/TutorialModal.tsx | 336 ++++++++++++++++++ .../TutorialModal/ViewAvailable.mp4 | Bin 0 -> 464194 bytes src/react-app-env.d.ts | 5 + 13 files changed, 387 insertions(+), 1 deletion(-) create mode 100644 src/components/utils/components/TutorialModal/EditAvailable.mp4 create mode 100644 src/components/utils/components/TutorialModal/EventDeletion.mp4 create mode 100644 src/components/utils/components/TutorialModal/EventDetails.png create mode 100644 src/components/utils/components/TutorialModal/GeneralDaysTutorial.png create mode 100644 src/components/utils/components/TutorialModal/Meeting.mp4 create mode 100644 src/components/utils/components/TutorialModal/SelectDaysTutorial.png create mode 100644 src/components/utils/components/TutorialModal/Share.mp4 create mode 100644 src/components/utils/components/TutorialModal/TutorialModal.tsx create mode 100644 src/components/utils/components/TutorialModal/ViewAvailable.mp4 diff --git a/src/components/DaySelect/time_select_component/time_select_component.tsx b/src/components/DaySelect/time_select_component/time_select_component.tsx index 4578b10b..ec11e67e 100644 --- a/src/components/DaySelect/time_select_component/time_select_component.tsx +++ b/src/components/DaySelect/time_select_component/time_select_component.tsx @@ -55,7 +55,7 @@ export const TimeSelectComponent = (props: any) => { return (
diff --git a/src/components/Home/HomePage.tsx b/src/components/Home/HomePage.tsx
index 5b5c8557..164dfd1e 100644
--- a/src/components/Home/HomePage.tsx
+++ b/src/components/Home/HomePage.tsx
@@ -7,6 +7,7 @@ import graphic from './calendargraphic.png';
import LoginPopup from '../utils/components/LoginPopup';
import Footer from '../utils/components/Footer';
import Button from '../utils/components/Button';
+import TutorialModal from '../utils/components/TutorialModal/TutorialModal';
// import { SiGooglecalendar } from 'react-icons/si';
// import { FaLock } from 'react-icons/fa';
@@ -72,10 +73,19 @@ export default function HomePage() {
}
};
+ const [showTutorial, setTutorial] = React.useState
z3SN`qU>&Zq3*{EbJPT=mS{a!j+#PnPm$!PrP(oEFRprj*V<=_JzaT;)R-vsvL4Z`W
zm887gDRtI5?)BDD#AGc_P;6V({`l-c3HTdyHtr;m`Xa6HvQPMHp$=IUlM|wc!EaG#
z{I?ax12O}I%?8Z`*_}m`587=%gs#
+ New to ymeets? →
+ setTutorial(true)}>
+ Click here for a quick walkthrough!
+
+
+
trgG@?OjC+QI
z*9$*}B#fqItIXuiU96Q@Iuw3WFve|{Uudd+n&&UY;d+&;*m~f}a{JxjW!veY!9@1B
zFp=X>GfJj>s=x}UQu@r>;}6q`^edDv`Q~30adSP+eXv&BX7LrZt98Tj6_r|pF@wbO
z!TKMxB|X6crr|60$5QL*u3vgYCbuG+19%2-KP}SNrdLc8&d;vD*&Fh*#hDP(w`srb
zNXe&K9cmWSw;f~grko|>4zZUmfnD1o6@CC-lX}#OmHu-(skuk%J!>)?jiV=}cIO_9
zae8-H;5P8=C-(RmZFgODxK}he%pWbV%oHQ^yi#+`Rn6&DD{0uFxwg%_H`ocruG;Dv
zh|_8N)^(F6dZFgFRpJ%PK)#M(4&kMqG65-3RU$!-@Umf7t#nu3{%0BaKaao6#ZHd|
zw%KZ5!{U@=c&@cIR*aO;bFE+>dG@5TLha(2Hy^z?5#y^SZaBVK>vC;*Z!C#!hV0Ab
zSG1T>JCNq8njSg7Hy7b|2{h1MSd)FD{dwq1kLQ_Qx&-t4xo?ubI7)TO5oi27Td;Lj
zBN3k_rc3Sk2e;Rzi&tpsPq|OR&zY{0n|=+eofen1ca?oqFLd~%m52NFgM_Sz$i<-6
zS8Yd71_A!io`vDB=JM-HiBi5--sCq(94FP>yYrk{Y=D^hsc_NUO&%8_lV6LaQ8tl$
zH1c$9N;f+0ENeb>(H*h4@UU#P-2=ayb%FD#vF6Vd5eIH|;X^ua+Ct8eo74R
z%Ce@hoL{xfNtpb>J?!lsa|qEJIrSK#)V`Y|ZWz~^a<6%&^Bk8@8t!f_^SH8@beX?p
zxU{RyZS_Z#;>mo+t!cwyu`O+Hu|vN{(NH8m_@dBFJp566Q901|y&-bDutq-pm}(>J
zV3gN9YNOYlrYME4G(j~
Mg0#ajz!qNLbA7p|d7d4?lb0QPFXGO9p!P)o(Xz*_q=(qRzRd2-n$
zOY~ljry_TP(VZcKtn7m-8ac?NLa9mY(uHudviYMzsqON)5@m$xo(Gn>SBamfeE$~(
zro=cRH^_)3wY;w{5-87R
z&p5ELkq9y7!|Hba+mR8X4
zY4zL!-1hO_z%aMX)Ml?nMtq
@T4Fje81)0DL+$R`AJ}zc8SU*}U-y
zKS&x)JMv-bj`}lPPrecEChxmh9UQQYw%zV_;=_;It`CTtr
r2MT5Ou=)iIrQhmA}S5g@ZIn2d+pR}o!+R_gPP`(JQk?jscQI?v4AjA@Oeey2A
z>_