Good start

package.json

@@ -13,7 +13,7 @@
     "lint": "next lint",
     "start": "next start",
     "generate-apple-secret": "tsx src/scripts/generate_apple_secret.ts",
-    "go": "git pull && next dev",
+    "go": "next dev",
     "goprod": "next build && next start"
   },
   "dependencies": {

src/app/layout.tsx

@@ -2,16 +2,12 @@ import "~/styles/globals.css";
 import { Inter as FontSans } from "next/font/google";
 import { cn } from "~/lib/utils"
 import { auth } from "~/auth"
-import Sign_In_Apple_Button from "~/components/auth/server/SignInAppleButton"
-import Title from "~/components/home/Title"
-import First_Sign_In_Form from "~/components/auth/FirstSignInForm"
 import { SessionProvider } from "next-auth/react";
 import Theme_Provider from "~/components/theme/theme_provider"
-import Hero from "~/components/home/Hero"
-import Nav_Bar from "~/components/home/NavBar"
-import Avatar_Popover from "~/components/auth/AvatarPopover"
-import Theme_Toggle from "~/components/theme/theme_toggle"
 import { type Metadata } from "next";
+import Theme_Toggle from '~/components/theme/theme_toggle'
+import { Button } from "~/components/ui/button"
+import Link from 'next/link'
 
 export const metadata: Metadata = {
   title: "Tenant Portal",
@@ -29,6 +25,7 @@ export default async function RootLayout({
 }: Readonly<{ children: React.ReactNode }>) {
   const session = await auth();
   if (!session?.user) {
+  }
   return (
     <html lang="en">
       <body
@@ -43,57 +40,56 @@ export default async function RootLayout({
           disableTransitionOnChange={true}
         >
           <SessionProvider>
-            <main className="min-h-screen">
+
-              <div className="w-full justify-end items-end p-3 flex flex-col">
+          <div className="flex flex-col min-h-screen">
+            <header className="bg-background shadow-sm">
+              <div className="container mx-auto px-4 py-4 flex justify-between items-center">
+                <Link href="/" className="text-2xl:md font-bold text-primary">Magnolia Coast Properties</Link>
+                <nav className="hidden md:flex space-x-2 lg:space-x-4 text-sm lg:text-lg">
+                  <Link href="#" className="text-gray-600 hover:text-primary">Home</Link>
+                  <Link href="#" className="text-gray-600 hover:text-primary">Properties</Link>
+                  <Link href="#" className="text-gray-600 hover:text-primary">Services</Link>
+                  <Link href="#" className="text-gray-600 hover:text-primary">About</Link>
+                  <Link href="#" className="text-gray-600 hover:text-primary">Contact</Link>
+                </nav>
+                <div className="flex space-x-2">
                   <Theme_Toggle/>
+                  <Button variant="outline">Login</Button>
+                  <Button>Register</Button>
                 </div>
-              <div className="w-full flex flex-col justify-center items-center">
-                <Title />
-                <Sign_In_Apple_Button />
               </div>
-            </main>
+            </header>
             {children}
-            </SessionProvider>
+            <footer className="bg-background text-primary py-8">
-          </Theme_Provider>
+              <div className="container mx-auto px-4">
-        </body>
+                <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
-      </html>
+                  <div>
-    );
+                    <h3 className="text-xl font-bold mb-4">Magnolia Coast Property Management</h3>
-  } else {
+                    <p>Your trusted partner in property management</p>
-    const users_email = session.user.email ?? "";
-    const users_name = session.user.name ?? "New User";
-    return (
-      <html lang="en">
-        <body
-          className={cn(
-            "min-h-screen bg-background font-sans antialiased",
-            fontSans.variable)}
-        >
-          <Theme_Provider
-            attribute="class"
-            defaultTheme="system"
-            enableSystem={true}
-            disableTransitionOnChange={true}
-          >
-            <SessionProvider>
-              <div className="w-11/12 flex flex-col mx-auto">
-                < First_Sign_In_Form users_name={users_name} users_email={users_email} />
                   </div>
-              <div className="flex flex-row p-4">
+                  <div>
-                <div className="w-1/6 md:w-1/4 p-4">
+                    <h4 className="text-lg font-semibold mb-4">Quick Links</h4>
-                  <div className="flex flex-col">
+                    <ul className="space-y-2">
-                    <Hero />
+                      <li><Link href="#" className="hover:text-primary-foreground">Home</Link></li>
-                    <Nav_Bar />
+                      <li><Link href="#" className="hover:text-primary-foreground">Properties</Link></li>
+                      <li><Link href="#" className="hover:text-primary-foreground">Services</Link></li>
+                      <li><Link href="#" className="hover:text-primary-foreground">About Us</Link></li>
+                      <li><Link href="#" className="hover:text-primary-foreground">Contact</Link></li>
+                    </ul>
+                  </div>
+                  <div>
+                    <h4 className="text-lg font-semibold mb-4">Contact Us</h4>
+                    <p>123 Property Street</p>
+                    <p>City, State 12345</p>
+                    <p>Phone: (123) 456-7890</p>
+                    <p>Email: info@propertypro.com</p>
                   </div>
                 </div>
-                {children}
+                <div className="mt-8 text-center">
-                <div className="w-1/12 p-4 flex flex-row justify-end">
+                  <p>&copy; 2024 Magnolia Coast Property Management LLC. All rights reserved.</p>
-                  <div className="pb-1 px-4">
-                    <Theme_Toggle />
-                  </div>
-                  <div className="w-auto">
-                    <Avatar_Popover />
                 </div>
               </div>
+            </footer>
           </div>
           </SessionProvider>
         </Theme_Provider>
@@ -101,4 +97,3 @@ export default async function RootLayout({
     </html>
   );
 }
-}

src/app/page.tsx

@@ -1,17 +1,88 @@
-"use server"
+import Link from 'next/link'
-import { auth } from "~/auth"
+import { Button } from "~/components/ui/button"
-import Breadcrumb_Home from "~/components/home/breadcrumb/BreadcrumbHome"
+import { Input } from "~/components/ui/input"
+import { Card, CardContent, CardFooter, CardHeader, CardTitle } from "~/components/ui/card"
+import { Search, Home, Key, Wrench, DollarSign } from 'lucide-react'
 
 export default async function HomePage() {
-  const session = await auth()
-  if (!session?.user) return <></>
   return (
-      <div className="w-2/3 flex flex-col p-6">
+    <main className="flex-grow">
-        <div className="flex flex-row">
+      <section className="bg-gradient-to-r from-background to-primary-foreground text-primary py-20">
-          <div className="">
+        <div className="container mx-auto px-4 text-center">
-            <Breadcrumb_Home />
+          <h1 className="text-4xl md:text-5xl font-bold mb-4">Find Your Perfect Property</h1>
+          <p className="text-xl mb-8">Discover a wide range of properties for sale and rent</p>
+          <div className="max-w-2xl mx-auto flex">
+            <Input type="text" placeholder="Search properties..." className="flex-grow" />
+            <Button className="ml-2">
+              <Search className="mr-2 h-4 w-4" /> Search
+            </Button>
           </div>
         </div>
+      </section>
+
+      <section className="py-16">
+        <div className="container mx-auto px-4">
+          <h2 className="text-3xl font-bold mb-8 text-center">Featured Properties</h2>
+          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
+            {[1, 2, 3].map((i) => (
+              <Card key={i}>
+                <CardHeader>
+                  <CardTitle>Beautiful Property {i}</CardTitle>
+                </CardHeader>
+                <CardContent>
+                  <img src={`/placeholder.svg?height=200&width=300`} alt={`Property ${i}`} className="w-full h-48 object-cover mb-4 rounded" />
+                  <p className="text-gray-600">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
+                </CardContent>
+                <CardFooter>
+                  <Button className="w-full">View Details</Button>
+                </CardFooter>
+              </Card>
+            ))}
           </div>
-    );
+        </div>
+      </section>
+
+      <section className="bg-background py-16">
+        <div className="container mx-auto px-4">
+          <h2 className="text-3xl font-bold mb-8 text-center">Our Services</h2>
+          <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
+            {[
+              { icon: Home, title: "Property Management" },
+              { icon: Key, title: "Rentals" },
+              { icon: Wrench, title: "Maintenance" },
+              { icon: DollarSign, title: "Rent Collection" },
+            ].map((service, i) => (
+              <Card key={i} className="text-center">
+                <CardHeader>
+                  <service.icon className="mx-auto h-12 w-12 text-primary" />
+                  <CardTitle>{service.title}</CardTitle>
+                </CardHeader>
+                <CardContent>
+                  <p className="text-gray-600">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
+                </CardContent>
+              </Card>
+            ))}
+          </div>
+        </div>
+      </section>
+
+    </main>
+  )
 }
+//"use server"
+//import { auth } from "~/auth"
+//import Breadcrumb_Home from "~/components/home/breadcrumb/BreadcrumbHome"
+
+//export default async function HomePage() {
+  //const session = await auth()
+  //if (!session?.user) return <></>
+    //return (
+      //<div className="w-2/3 flex flex-col p-6">
+        //<div className="flex flex-row">
+          //<div className="">
+            //<Breadcrumb_Home />
+          //</div>
+        //</div>
+      //</div>
+    //);
+//}