diff --git a/resources/js/modules/editor/editor.jsx b/resources/js/modules/editor/editor.jsx index 407be4b..b4271d5 100644 --- a/resources/js/modules/editor/editor.jsx +++ b/resources/js/modules/editor/editor.jsx @@ -107,8 +107,8 @@ const useResponsiveDimensions = () => { return dimensions; }; -const Editor = () => { - const { init } = useMediaStore(); +const Editor = ({ setInitialMeme, setInitialBackground, setInitialText }) => { + const { init, setInitialMeme: setStoreMeme, setInitialBackground: setStoreBackground, setInitialText: setStoreText } = useMediaStore(); const { getSetting } = useLocalSettingsStore(); const { setSelectedTextElement } = useVideoEditorStore(); const emitter = useMitt(); @@ -121,8 +121,20 @@ const Editor = () => { const isBelowMinWidth = useViewportDetection(320); useEffect(() => { + // Set initial values if props are provided + if (setInitialMeme) { + setInitialMeme(setStoreMeme); + } + if (setInitialBackground) { + setInitialBackground(setStoreBackground); + } + if (setInitialText) { + setInitialText(setStoreText); + } + + // Initialize (will skip API call if initial values were set) init(); - }, []); + }, [setInitialMeme, setInitialBackground, setInitialText, setStoreMeme, setStoreBackground, setStoreText, init]); // Listen for text element selection (but don't auto-open sidebar) useEffect(() => { diff --git a/resources/js/pages/home/home.tsx b/resources/js/pages/home/home.tsx index 877e0b5..82bb6f9 100644 --- a/resources/js/pages/home/home.tsx +++ b/resources/js/pages/home/home.tsx @@ -33,6 +33,7 @@ const Home = ({ faqData }) => {
+ {/* */}
diff --git a/resources/js/pages/home/partials/Hero.jsx b/resources/js/pages/home/partials/Hero.jsx index 451e00c..e8bfcfc 100644 --- a/resources/js/pages/home/partials/Hero.jsx +++ b/resources/js/pages/home/partials/Hero.jsx @@ -1,4 +1,3 @@ -import CountUp from '@/components/reactbits/CountUp/CountUp'; import { usePage } from '@inertiajs/react'; const Hero = () => { @@ -29,7 +28,7 @@ const Hero = () => { {/* Stats */} -
+ {/*
{
720p
Export
-
+
*/} diff --git a/resources/js/pages/memes/show.tsx b/resources/js/pages/memes/show.tsx index ce6341e..4b6f60b 100644 --- a/resources/js/pages/memes/show.tsx +++ b/resources/js/pages/memes/show.tsx @@ -88,7 +88,11 @@ export default function MemeShow({ meme, relatedMemes }: Props) { {isClient && Editor ? ( - + setMeme(meme)} + //setInitialBackground={(setBackground) => setBackground(null)} + setInitialText={(setText) => setText('add your meme caption here')} + /> ) : (
diff --git a/resources/js/stores/MediaStore.js b/resources/js/stores/MediaStore.js index 2f14260..9401c45 100644 --- a/resources/js/stores/MediaStore.js +++ b/resources/js/stores/MediaStore.js @@ -20,6 +20,11 @@ const useMediaStore = create( currentCaption: 'I am chicken rice', watermarked: true, + // Initial values state + hasInitialMeme: false, + hasInitialBackground: false, + hasInitialText: false, + keywords: [], isLoadingAIHints: false, @@ -57,6 +62,19 @@ const useMediaStore = create( set({ currentCaption: caption }); }, + // Set initial values from props + setInitialMeme: (meme) => { + set({ selectedMeme: meme, hasInitialMeme: true }); + }, + + setInitialBackground: (background) => { + set({ selectedBackground: background, hasInitialBackground: true }); + }, + + setInitialText: (text) => { + set({ currentCaption: text, hasInitialText: true }); + }, + // Clear selections clearSelectedMeme: () => { set({ selectedMeme: null }); @@ -107,15 +125,31 @@ const useMediaStore = create( }, init: async () => { + const state = get(); + + // Skip API call completely if ALL initial values were set via props + if (state.hasInitialMeme && state.hasInitialBackground && state.hasInitialText) { + return; + } + try { const response = await axiosInstance.post(route('api.app.init')); if (response?.data?.success?.data?.init) { - set({ - currentCaption: response.data.success.data.init.caption, - selectedMeme: response.data.success.data.init.meme, - selectedBackground: response.data.success.data.init.background, - }); + const updates = {}; + + // Only update values that weren't set via props + if (!state.hasInitialText) { + updates.currentCaption = response.data.success.data.init.caption; + } + if (!state.hasInitialMeme) { + updates.selectedMeme = response.data.success.data.init.meme; + } + if (!state.hasInitialBackground) { + updates.selectedBackground = response.data.success.data.init.background; + } + + set(updates); } else { throw 'Invalid API response'; }