Initial commit

2025-10-11 17:02:49 +02:00
commit 92056f073f
243 changed files with 27536 additions and 0 deletions
--- a/resources/js/pages/Home.tsx
+++ b/resources/js/pages/Home.tsx
@@ -0,0 +1,136 @@
+import { useEffect, useState } from 'react';
+import Header from '../components/Header/Header';
+import Footer from '../components/Footer/Footer';
+import { Head } from '@inertiajs/react';
+import styles from './Home.module.css';
+import AppLayout from '@/layouts/AppLayout';
+import { ActionButtons } from '../components/ActionButtons/ActionButtons';
+import classNames from 'classnames';
+
+interface OpeningHour {
+    type: 'opening_hour';
+    data: {
+        name: string;
+        time: string;
+    };
+}
+
+interface Promotion {
+    id: number;
+    sort_order: number;
+    title: string;
+    description: string;
+    additional_info: string | null;
+    created_at: string;
+    updated_at: string;
+}
+
+interface HomepageData {
+    status: string;
+    data: {
+        photo: string | null;
+        photo_mobile: string | null;
+        title: string | null;
+        body: string | null;
+        delivery: string | null;
+        address: string | null;
+        opening_hours: OpeningHour[];
+        widget_link: string | null;
+    };
+}
+
+export default function Home() {
+    const [data, setData] = useState<HomepageData['data'] | null>(null);
+    const [promotions, setPromotions] = useState<Promotion[]>([]);
+    const [loading, setLoading] = useState(true);
+
+    useEffect(() => {
+        Promise.all([
+            fetch('/api/homepage').then(res => res.json()),
+            fetch('/api/promotions').then(res => res.json())
+        ])
+            .then(([homepageResponse, promotionsResponse]) => {
+                setData(homepageResponse.data);
+                setPromotions(promotionsResponse.data);
+                setLoading(false);
+            })
+            .catch(error => {
+                console.error('Error fetching data:', error);
+                setLoading(false);
+            });
+    }, []);
+
+    if (loading) {
+        return (
+            <></>
+        );
+    }
+
+    return (
+        <AppLayout>
+            <Head title={data?.title || 'Ghost Pizza'}/>
+            
+            <div className={styles.container}>
+            <Header />
+            <main className={styles.main}>
+            <div className={styles.left}>
+                {data?.body && (
+                    <div className={classNames(styles.text)}>
+                        <div  
+                            dangerouslySetInnerHTML={{ __html: data.body }} 
+                        />
+                    </div>
+                )}
+                <div className={classNames(styles.text, styles.promo)}>
+                    {promotions.map((promotion) => (
+                        <div key={promotion.id}>
+                            <strong>{promotion.title}</strong> {promotion.description} {promotion.additional_info}
+                        </div>
+                    ))}
+                </div>
+                {data?.delivery && (
+                    <div className={classNames(styles.text, styles.special)}>
+                        <div  
+                            dangerouslySetInnerHTML={{ __html: data.delivery }} 
+                        />
+                    </div>
+                )}
+
+                <ActionButtons variant="default" />
+            </div>
+            <div className={styles.right}>
+                {data?.address && (
+                    <div className={classNames(styles.big)} dangerouslySetInnerHTML={{ __html: data.address }} />
+                )}
+
+                <div className={styles.big}>Godziny otwarcia:</div>
+                <div className={styles.hours}>  
+                    {data?.opening_hours.map((hour, index) => (
+                        <div key={index}><div>{hour.data.name}</div> <div className={styles.bold}>{hour.data.time}</div></div>
+                    ))}
+                </div>
+
+                <div className={styles.mapouter}>
+                    <div className={styles['gmap_canvas']}>
+                        {data?.widget_link ? (
+                            <iframe
+                                title="Mapa"
+                                src={data.widget_link}
+                                width="600" 
+                                height="500"
+                                frameBorder="0" 
+                                scrolling="no"
+                                id="gmap_canvas"
+                                loading="lazy"
+                                referrerPolicy="no-referrer-when-downgrade"
+                            />
+                        ) : null}
+                    </div>
+                </div>
+            </div>
+            </main>
+            <Footer />
+        </div>
+        </AppLayout>
+    );
+}