Autosave: 20260502-152630

backend/src/config.js

@@ -70,6 +70,9 @@ const config = {
 };
 
 config.pexelsKey = process.env.PEXELS_KEY || '';
+config.rentcastApiKey = process.env.RENTCAST_API_KEY || '';
+config.propertySearchProvider = process.env.PROPERTY_SEARCH_PROVIDER || '';
+config.rentcastBaseUrl = process.env.RENTCAST_BASE_URL || 'https://api.rentcast.io/v1';
 
 config.pexelsQuery = 'Mountain path at sunrise';
 config.host = process.env.NODE_ENV === "production" ? config.remote : "http://localhost";

backend/src/index.js

@@ -6,7 +6,7 @@ const passport = require('passport');
 const path = require('path');
 const fs = require('fs');
 const bodyParser = require('body-parser');
-const db = require('./db/models');
+require('./db/models');
 const config = require('./config');
 const swaggerUI = require('swagger-ui-express');
 const swaggerJsDoc = require('swagger-jsdoc');
@@ -111,7 +111,10 @@ app.use('/api-docs', function (req, res, next) {
 app.use(cors({origin: true}));
 require('./auth/auth');
 
-app.use(bodyParser.json());
+const requestBodyLimit = '10mb';
+
+app.use(bodyParser.json({ limit: requestBodyLimit }));
+app.use(bodyParser.urlencoded({ extended: true, limit: requestBodyLimit }));
 
 app.use('/api/auth', authRoutes);
 app.use('/api/file', fileRoutes);

backend/src/routes/projects.js

@@ -2,11 +2,11 @@
 const express = require('express');
 
 const ProjectsService = require('../services/projects');
+const LegacyBuilderService = require('../services/legacyBuilder');
+const PropertySearchService = require('../services/propertySearch');
 const ProjectsDBApi = require('../db/api/projects');
 const wrapAsync = require('../helpers').wrapAsync;
 
-const config = require('../config');
-
 
 const router = express.Router();
 
@@ -19,6 +19,17 @@ const {
 
 router.use(checkCrudPermissions('projects'));
 
+router.post('/legacy-builder', wrapAsync(async (req, res) => {
+    const forwardedProto = req.headers['x-forwarded-proto'] || req.protocol;
+    const requestOrigin = `${forwardedProto}://${req.get('host')}`;
+    const payload = await LegacyBuilderService.buildLaunchPlan(req.body.data, req.currentUser, requestOrigin);
+    res.status(200).send(payload);
+}));
+
+router.post('/property-search', wrapAsync(async (req, res) => {
+    const payload = await PropertySearchService.searchListings(req.body.data || {});
+    res.status(200).send(payload);
+}));
 
 /**
  *  @swagger

backend/src/services/propertySearch.js

@@ -0,0 +1,415 @@
+const axios = require('axios');
+const config = require('../config');
+
+const SUPPORTED_PROPERTY_TYPES = [
+  'any',
+  'land',
+  'single_family',
+  'condo',
+  'townhouse',
+  'multi_family',
+  'apartment',
+  'manufactured',
+];
+
+const RENTCAST_PROPERTY_TYPE_MAP = {
+  any: null,
+  land: 'Land',
+  single_family: 'Single Family',
+  condo: 'Condo',
+  townhouse: 'Townhouse',
+  multi_family: 'Multi-Family',
+  apartment: 'Apartment',
+  manufactured: 'Manufactured',
+};
+
+const US_STATE_ALIASES = {
+  AL: 'AL',
+  ALABAMA: 'AL',
+  AK: 'AK',
+  ALASKA: 'AK',
+  AZ: 'AZ',
+  ARIZONA: 'AZ',
+  AR: 'AR',
+  ARKANSAS: 'AR',
+  CA: 'CA',
+  CALIFORNIA: 'CA',
+  CO: 'CO',
+  COLORADO: 'CO',
+  CT: 'CT',
+  CONNECTICUT: 'CT',
+  DE: 'DE',
+  DELAWARE: 'DE',
+  DC: 'DC',
+  'DISTRICT OF COLUMBIA': 'DC',
+  FL: 'FL',
+  FLORIDA: 'FL',
+  GA: 'GA',
+  GEORGIA: 'GA',
+  HI: 'HI',
+  HAWAII: 'HI',
+  ID: 'ID',
+  IDAHO: 'ID',
+  IL: 'IL',
+  ILLINOIS: 'IL',
+  IN: 'IN',
+  INDIANA: 'IN',
+  IA: 'IA',
+  IOWA: 'IA',
+  KS: 'KS',
+  KANSAS: 'KS',
+  KY: 'KY',
+  KENTUCKY: 'KY',
+  LA: 'LA',
+  LOUISIANA: 'LA',
+  ME: 'ME',
+  MAINE: 'ME',
+  MD: 'MD',
+  MARYLAND: 'MD',
+  MA: 'MA',
+  MASSACHUSETTS: 'MA',
+  MI: 'MI',
+  MICHIGAN: 'MI',
+  MN: 'MN',
+  MINNESOTA: 'MN',
+  MS: 'MS',
+  MISSISSIPPI: 'MS',
+  MO: 'MO',
+  MISSOURI: 'MO',
+  MT: 'MT',
+  MONTANA: 'MT',
+  NE: 'NE',
+  NEBRASKA: 'NE',
+  NV: 'NV',
+  NEVADA: 'NV',
+  NH: 'NH',
+  'NEW HAMPSHIRE': 'NH',
+  NJ: 'NJ',
+  'NEW JERSEY': 'NJ',
+  NM: 'NM',
+  'NEW MEXICO': 'NM',
+  NY: 'NY',
+  'NEW YORK': 'NY',
+  NC: 'NC',
+  'NORTH CAROLINA': 'NC',
+  ND: 'ND',
+  'NORTH DAKOTA': 'ND',
+  OH: 'OH',
+  OHIO: 'OH',
+  OK: 'OK',
+  OKLAHOMA: 'OK',
+  OR: 'OR',
+  OREGON: 'OR',
+  PA: 'PA',
+  PENNSYLVANIA: 'PA',
+  RI: 'RI',
+  'RHODE ISLAND': 'RI',
+  SC: 'SC',
+  'SOUTH CAROLINA': 'SC',
+  SD: 'SD',
+  'SOUTH DAKOTA': 'SD',
+  TN: 'TN',
+  TENNESSEE: 'TN',
+  TX: 'TX',
+  TEXAS: 'TX',
+  UT: 'UT',
+  UTAH: 'UT',
+  VT: 'VT',
+  VERMONT: 'VT',
+  VA: 'VA',
+  VIRGINIA: 'VA',
+  WA: 'WA',
+  WASHINGTON: 'WA',
+  WV: 'WV',
+  'WEST VIRGINIA': 'WV',
+  WI: 'WI',
+  WISCONSIN: 'WI',
+  WY: 'WY',
+  WYOMING: 'WY',
+};
+
+function createBadRequest(message) {
+  const error = new Error(message);
+  error.code = 400;
+  return error;
+}
+
+function cleanText(value) {
+  if (typeof value !== 'string') {
+    return '';
+  }
+
+  return value.replace(/\s+/g, ' ').trim();
+}
+
+function toNumber(value) {
+  if (value === null || value === undefined || value === '') {
+    return null;
+  }
+
+  if (typeof value === 'number') {
+    return Number.isFinite(value) ? value : null;
+  }
+
+  const normalized = String(value).replace(/[^0-9.-]/g, '');
+  const parsed = Number.parseFloat(normalized);
+  return Number.isFinite(parsed) ? parsed : null;
+}
+
+function toInteger(value, fallback = 6, min = 1, max = 12) {
+  const parsed = Number.parseInt(value, 10);
+  if (!Number.isFinite(parsed)) {
+    return fallback;
+  }
+
+  return Math.max(min, Math.min(parsed, max));
+}
+
+function normalizeState(value) {
+  const cleaned = cleanText(value);
+  if (!cleaned) {
+    return '';
+  }
+
+  const alias = US_STATE_ALIASES[cleaned.toUpperCase()];
+  return alias || cleaned.toUpperCase();
+}
+
+function normalizeCountry(value) {
+  const cleaned = cleanText(value);
+  if (!cleaned) {
+    return 'USA';
+  }
+
+  const normalized = cleaned.toUpperCase();
+  if (['USA', 'US', 'UNITED STATES', 'UNITED STATES OF AMERICA'].includes(normalized)) {
+    return 'USA';
+  }
+
+  return cleaned;
+}
+
+function normalizePropertyType(value) {
+  const normalized = cleanText(value).toLowerCase().replace(/[\s-]+/g, '_');
+  if (!normalized) {
+    return 'any';
+  }
+
+  return SUPPORTED_PROPERTY_TYPES.includes(normalized) ? normalized : 'any';
+}
+
+function firstNonEmptyText(values) {
+  for (const value of values) {
+    const cleaned = cleanText(value);
+    if (cleaned) {
+      return cleaned;
+    }
+  }
+
+  return '';
+}
+
+function firstNumber(values) {
+  for (const value of values) {
+    const parsed = toNumber(value);
+    if (parsed !== null) {
+      return parsed;
+    }
+  }
+
+  return null;
+}
+
+function toAcresFromSquareFeet(value) {
+  const numeric = toNumber(value);
+  if (numeric === null) {
+    return null;
+  }
+
+  return Number((numeric / 43560).toFixed(2));
+}
+
+function normalizeListing(item) {
+  if (!item || typeof item !== 'object') {
+    return null;
+  }
+
+  const photoCandidates = [];
+  if (Array.isArray(item.photos)) {
+    item.photos.forEach((photo) => {
+      if (typeof photo === 'string') {
+        photoCandidates.push(photo);
+      } else if (photo && typeof photo === 'object') {
+        photoCandidates.push(photo.href, photo.url, photo.src, photo.original);
+      }
+    });
+  }
+
+  const lotSizeAcres = firstNumber([
+    item.lotSizeAcres,
+    item.acres,
+    item.lotSize,
+  ]);
+
+  const normalizedLotSizeAcres = item.lotSizeAcres || item.acres
+    ? lotSizeAcres
+    : toAcresFromSquareFeet(item.lotSize);
+
+  return {
+    id: firstNonEmptyText([item.id, item.listingId, item.propertyId]) || `listing-${Math.random().toString(36).slice(2, 10)}`,
+    address: firstNonEmptyText([
+      item.formattedAddress,
+      item.address,
+      [item.addressLine1, item.city, item.state, item.zipCode].filter(Boolean).join(', '),
+    ]),
+    city: firstNonEmptyText([item.city]),
+    state: firstNonEmptyText([item.state]),
+    county: firstNonEmptyText([item.county, item.countyOrParish]),
+    zipCode: firstNonEmptyText([item.zipCode]),
+    status: firstNonEmptyText([item.status, item.listingStatus, item.mlsStatus, 'active']),
+    propertyType: firstNonEmptyText([item.propertyType, item.propertySubType, 'Property']),
+    price: firstNumber([item.price, item.listPrice, item.askingPrice]),
+    bedrooms: firstNumber([item.bedrooms, item.beds]),
+    bathrooms: firstNumber([item.bathrooms, item.baths, item.fullBathrooms]),
+    squareFootage: firstNumber([item.squareFootage, item.livingArea, item.buildingArea]),
+    lotSizeAcres: normalizedLotSizeAcres,
+    daysOnMarket: firstNumber([item.daysOnMarket]),
+    listedDate: firstNonEmptyText([item.listedDate, item.listDate]),
+    description: firstNonEmptyText([item.description, item.publicRemarks, item.remarks]),
+    photoUrl: firstNonEmptyText(photoCandidates),
+    listingUrl: firstNonEmptyText([item.url, item.listingUrl, item.detailUrl, item.propertyUrl]),
+  };
+}
+
+function normalizeInput(rawData) {
+  return {
+    city: cleanText(rawData?.city),
+    state: normalizeState(rawData?.state),
+    country: normalizeCountry(rawData?.country),
+    propertyType: normalizePropertyType(rawData?.propertyType),
+    maxPrice: toNumber(rawData?.maxPrice),
+    minLotAcres: toNumber(rawData?.minLotAcres),
+    limit: toInteger(rawData?.limit, 6, 1, 12),
+    businessType: cleanText(rawData?.businessType),
+    sitePreferences: cleanText(rawData?.sitePreferences),
+  };
+}
+
+function buildRentcastParams(input) {
+  const params = {
+    state: input.state,
+    status: 'Active',
+    limit: input.limit,
+  };
+
+  if (input.city) {
+    params.city = input.city;
+  }
+
+  const rentcastPropertyType = RENTCAST_PROPERTY_TYPE_MAP[input.propertyType];
+  if (rentcastPropertyType) {
+    params.propertyType = rentcastPropertyType;
+  }
+
+  if (input.maxPrice !== null) {
+    params.price = `0:${Math.round(input.maxPrice)}`;
+  }
+
+  if (input.minLotAcres !== null) {
+    const minimumSquareFeet = Math.max(Math.round(input.minLotAcres * 43560), 1);
+    params.lotSize = `${minimumSquareFeet}:999999999`;
+  }
+
+  return params;
+}
+
+function getProvider() {
+  const configuredProvider = cleanText(config.propertySearchProvider).toLowerCase();
+  if (configuredProvider) {
+    return configuredProvider;
+  }
+
+  return config.rentcastApiKey ? 'rentcast' : '';
+}
+
+module.exports = class PropertySearchService {
+  static async searchListings(rawData) {
+    const provider = getProvider();
+    const input = normalizeInput(rawData);
+
+    if (input.country !== 'USA') {
+      throw createBadRequest('The first live property search version currently supports U.S. listings only. We can add an international provider next.');
+    }
+
+    if (!input.state) {
+      throw createBadRequest('Enter at least a U.S. state to search live listings. City is optional.');
+    }
+
+    if (provider !== 'rentcast' || !config.rentcastApiKey) {
+      throw createBadRequest('Live property search is coded, but the backend still needs a RentCast API key before it can return real listings.');
+    }
+
+    const params = buildRentcastParams(input);
+
+    try {
+      const response = await axios.get(`${config.rentcastBaseUrl}/listings/sale`, {
+        headers: {
+          'X-Api-Key': config.rentcastApiKey,
+          Accept: 'application/json',
+        },
+        params,
+        timeout: 20000,
+      });
+
+      const rawRows = Array.isArray(response.data)
+        ? response.data
+        : Array.isArray(response.data?.results)
+          ? response.data.results
+          : Array.isArray(response.data?.data)
+            ? response.data.data
+            : [];
+
+      const results = rawRows
+        .map((item) => normalizeListing(item))
+        .filter(Boolean);
+
+      return {
+        provider: 'rentcast',
+        fetchedAt: new Date().toISOString(),
+        search: {
+          city: input.city,
+          state: input.state,
+          country: input.country,
+          propertyType: input.propertyType,
+          maxPrice: input.maxPrice,
+          minLotAcres: input.minLotAcres,
+          limit: input.limit,
+          businessType: input.businessType,
+          sitePreferences: input.sitePreferences,
+        },
+        results,
+      };
+    } catch (error) {
+      console.error('Live property search request failed:', {
+        provider: 'rentcast',
+        params,
+        status: error.response?.status,
+        data: error.response?.data,
+      });
+
+      if (error.response?.status === 401 || error.response?.status === 403) {
+        throw createBadRequest('The property-search provider rejected the API key. Once the backend key is corrected, live listings will work.');
+      }
+
+      if (error.response?.status === 429) {
+        throw createBadRequest('The property-search provider rate limit was hit. Please wait a minute and try again.');
+      }
+
+      if (error.response?.status === 400) {
+        throw createBadRequest('The live listing provider rejected the search filters. Try simplifying the city/state or property type.');
+      }
+
+      throw new Error('Failed to fetch live property listings.');
+    }
+  }
+};

frontend/src/components/AsideMenuLayer.tsx

@@ -3,10 +3,8 @@ import { mdiLogout, mdiClose } from '@mdi/js'
 import BaseIcon from './BaseIcon'
 import AsideMenuList from './AsideMenuList'
 import { MenuAsideItem } from '../interfaces'
-import { useAppSelector } from '../stores/hooks'
+import { useAppDispatch, useAppSelector } from '../stores/hooks'
 import Link from 'next/link';
-
-import { useAppDispatch } from '../stores/hooks';
 import { createAsyncThunk } from '@reduxjs/toolkit';
 import axios from 'axios';
 

frontend/src/components/NavBarItem.tsx

@@ -1,6 +1,5 @@
-import React, {useEffect, useRef} from 'react'
+import React, { useEffect, useRef, useState } from 'react'
 import Link from 'next/link'
-import { useState } from 'react'
 import { mdiChevronUp, mdiChevronDown } from '@mdi/js'
 import BaseDivider from './BaseDivider'
 import BaseIcon from './BaseIcon'

frontend/src/layouts/Authenticated.tsx

@@ -1,5 +1,4 @@
-import React, { ReactNode, useEffect } from 'react'
-import { useState } from 'react'
+import React, { ReactNode, useEffect, useState } from 'react'
 import jwt from 'jsonwebtoken';
 import { mdiForwardburger, mdiBackburger, mdiMenu } from '@mdi/js'
 import menuAside from '../menuAside'

frontend/src/menuAside.ts

@@ -7,6 +7,12 @@ const menuAside: MenuAsideItem[] = [
     icon: icon.mdiViewDashboardOutline,
     label: 'Dashboard',
   },
+  {
+    href: '/legacy-launchpad',
+    icon: icon.mdiRobotOutline,
+    label: 'Legacy Launchpad',
+    permissions: 'CREATE_PROJECTS',
+  },
   
   {
     href: '/users/users-list',

frontend/src/pages/dashboard.tsx

@@ -7,6 +7,8 @@ import LayoutAuthenticated from '../layouts/Authenticated'
 import SectionMain from '../components/SectionMain'
 import SectionTitleLineWithButton from '../components/SectionTitleLineWithButton'
 import BaseIcon from "../components/BaseIcon";
+import BaseButton from '../components/BaseButton';
+import CardBox from '../components/CardBox';
 import { getPageTitle } from '../config'
 import Link from "next/link";
 
@@ -53,6 +55,14 @@ const Dashboard = () => {
     const { isFetchingQuery } = useAppSelector((state) => state.openAi);
     
     const { rolesWidgets, loading } = useAppSelector((state) => state.roles);
+
+    const hasLaunchpadStarterDataLoaded = typeof projects === 'number' && typeof business_ideas === 'number';
+    const showLaunchpadStarter =
+      hasLaunchpadStarterDataLoaded &&
+      projects === 0 &&
+      business_ideas === 0 &&
+      hasPermission(currentUser, 'CREATE_PROJECTS');
+    const projectsCardHref = showLaunchpadStarter ? '/legacy-launchpad' : '/projects/projects-list';
     
     
     const organizationId = currentUser?.organizations?.id;
@@ -111,6 +121,39 @@ const Dashboard = () => {
             main>
           {''}
         </SectionTitleLineWithButton>
+
+        {showLaunchpadStarter && (
+          <CardBox className="mb-6 border border-emerald-200 bg-gradient-to-br from-emerald-50 via-white to-sky-50 dark:border-dark-700 dark:from-dark-900 dark:via-dark-900 dark:to-dark-800">
+            <div className="flex flex-col gap-4 lg:flex-row lg:items-center lg:justify-between">
+              <div>
+                <p className="text-xs font-semibold uppercase tracking-[0.2em] text-emerald-700 dark:text-emerald-300">
+                  Start here
+                </p>
+                <h2 className="mt-2 text-2xl font-semibold tracking-tight text-slate-950 dark:text-white">
+                  Your workspace is clean and ready for your first business idea.
+                </h2>
+                <p className="mt-2 max-w-3xl text-sm leading-6 text-slate-600 dark:text-slate-300">
+                  The mock launch plans are gone. Open Legacy Launchpad to describe your idea and generate your first preview plan for land, buildout, staffing, funding, and launch steps.
+                </p>
+              </div>
+              <div className="flex flex-col gap-3 sm:flex-row sm:items-center">
+                <BaseButton
+                  href="/legacy-launchpad"
+                  color="info"
+                  icon={icon.mdiRobotOutline}
+                  label="Open Legacy Launchpad"
+                />
+                <BaseButton
+                  href="/projects/projects-list"
+                  color="whiteDark"
+                  outline
+                  icon={icon.mdiBriefcaseOutline}
+                  label="View project workspace"
+                />
+              </div>
+            </div>
+          </CardBox>
+        )}
         
         {hasPermission(currentUser, 'CREATE_ROLES') && <WidgetCreator
             currentUser={currentUser}
@@ -324,7 +367,7 @@ const Dashboard = () => {
                 </div>
             </Link>}
           
-            {hasPermission(currentUser, 'READ_PROJECTS') && <Link href={'/projects/projects-list'}>
+            {hasPermission(currentUser, 'READ_PROJECTS') && <Link href={projectsCardHref}>
                 <div
                     className={`${corners !== 'rounded-full'? corners : 'rounded-3xl'} dark:bg-dark-900 ${cardsStyle} dark:border-dark-700 p-6`}
                 >

frontend/src/pages/index.tsx

@@ -1,166 +1,274 @@
-
-import React, { useEffect, useState } from 'react';
-import type { ReactElement } from 'react';
+import {
+  mdiAccountTieOutline,
+  mdiArrowRight,
+  mdiBullhornOutline,
+  mdiCashMultiple,
+  mdiChartTimelineVariant,
+  mdiFileDocumentOutline,
+  mdiHomeCityOutline,
+  mdiLightbulbOnOutline,
+  mdiMapMarkerOutline,
+  mdiOpenInNew,
+  mdiRobotOutline,
+  mdiScaleBalance,
+} from '@mdi/js';
 import Head from 'next/head';
 import Link from 'next/link';
+import React, { ReactElement } from 'react';
 import BaseButton from '../components/BaseButton';
+import BaseIcon from '../components/BaseIcon';
 import CardBox from '../components/CardBox';
-import SectionFullScreen from '../components/SectionFullScreen';
 import LayoutGuest from '../layouts/Guest';
-import BaseDivider from '../components/BaseDivider';
-import BaseButtons from '../components/BaseButtons';
 import { getPageTitle } from '../config';
-import { useAppSelector } from '../stores/hooks';
-import CardBoxComponentTitle from "../components/CardBoxComponentTitle";
-import { getPexelsImage, getPexelsVideo } from '../helpers/pexels';
 
+const featureCards = [
+  {
+    icon: mdiRobotOutline,
+    title: 'AI launch architect',
+    text: 'Turn founder notes into a saved launch blueprint with project phases, tasks, and budget-aligned next steps.',
+  },
+  {
+    icon: mdiScaleBalance,
+    title: 'Compliance research hub',
+    text: 'Track city, county, state, and federal research items as real checklist records instead of scattered notes.',
+  },
+  {
+    icon: mdiHomeCityOutline,
+    title: 'Land, build, and layout planning',
+    text: 'Seed site strategy, property records, and design-asset briefs for walkthroughs, systems, and 3D-ready layouts.',
+  },
+  {
+    icon: mdiAccountTieOutline,
+    title: 'Staffing to opening day',
+    text: 'Generate launch roles, training tracks, and go-to-market campaigns so the business is prepared to operate — not just exist on paper.',
+  },
+];
 
-export default function Starter() {
-    const [illustrationImage, setIllustrationImage] = useState({
-        src: undefined,
-        photographer: undefined,
-        photographer_url: undefined,
-    })
-    const [illustrationVideo, setIllustrationVideo] = useState({video_files: []})
-    const [contentType, setContentType] = useState('image');
-    const [contentPosition, setContentPosition] = useState('left');
-    const textColor = useAppSelector((state) => state.style.linkColor);
+const workflowSteps = [
+  {
+    eyebrow: 'Step 01',
+    title: 'Capture the founder vision',
+    text: 'Describe the business, target location, budget, and legacy goal. Add a reference image or scope file when you have one.',
+    icon: mdiLightbulbOnOutline,
+  },
+  {
+    eyebrow: 'Step 02',
+    title: 'Generate the first launch package',
+    text: 'The app saves a project workspace with timelines, documents, funding motions, staffing plans, and design backlog items.',
+    icon: mdiChartTimelineVariant,
+  },
+  {
+    eyebrow: 'Step 03',
+    title: 'Run the business buildout',
+    text: 'Use the existing admin interface to refine records, assign work, track approvals, and move toward opening-day readiness.',
+    icon: mdiOpenInNew,
+  },
+];
 
-    const title = 'Legacy Business Builder'
-
-    // Fetch Pexels image/video
-    useEffect(() => {
-        async function fetchData() {
-            const image = await getPexelsImage();
-            const video = await getPexelsVideo();
-            setIllustrationImage(image);
-            setIllustrationVideo(video);
-        }
-        fetchData();
-    }, []);
-
-    const imageBlock = (image) => (
-        <div
-            className='hidden md:flex flex-col justify-end relative flex-grow-0 flex-shrink-0 w-1/3'
-            style={{
-                backgroundImage: `${
-                    image
-                        ? `url(${image?.src?.original})`
-                        : 'linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5))'
-                }`,
-                backgroundSize: 'cover',
-                backgroundPosition: 'left center',
-                backgroundRepeat: 'no-repeat',
-            }}
-        >
-            <div className='flex justify-center w-full bg-blue-300/20'>
-                <a
-                    className='text-[8px]'
-                    href={image?.photographer_url}
-                    target='_blank'
-                    rel='noreferrer'
-                >
-                    Photo by {image?.photographer} on Pexels
-                </a>
-            </div>
-        </div>
-    );
-
-    const videoBlock = (video) => {
-        if (video?.video_files?.length > 0) {
-            return (
-                <div className='hidden md:flex flex-col justify-end relative flex-grow-0 flex-shrink-0 w-1/3'>
-                    <video
-                        className='absolute top-0 left-0 w-full h-full object-cover'
-                        autoPlay
-                        loop
-                        muted
-                    >
-                        <source src={video?.video_files[0]?.link} type='video/mp4'/>
-                        Your browser does not support the video tag.
-                    </video>
-                    <div className='flex justify-center w-full bg-blue-300/20 z-10'>
-                        <a
-                            className='text-[8px]'
-                            href={video?.user?.url}
-                            target='_blank'
-                            rel='noreferrer'
-                        >
-                            Video by {video.user.name} on Pexels
-                        </a>
-                    </div>
-                </div>)
-        }
-    };
+const valueBlocks = [
+  {
+    icon: mdiCashMultiple,
+    label: 'Funding path',
+    text: 'Budget strategy, capital rounds, and lender-ready planning.',
+  },
+  {
+    icon: mdiMapMarkerOutline,
+    label: 'Site path',
+    text: 'Location, property, and zoning-aware research checkpoints.',
+  },
+  {
+    icon: mdiFileDocumentOutline,
+    label: 'Docs + checklists',
+    text: 'Operating, permit, training, and launch deliverables in one hub.',
+  },
+  {
+    icon: mdiBullhornOutline,
+    label: 'Opening demand',
+    text: 'Marketing and launch motions seeded from the first intake.',
+  },
+];
 
+export default function HomePage() {
   return (
-      <div
-          style={
-              contentPosition === 'background'
-                  ? {
-                      backgroundImage: `${
-                          illustrationImage
-                              ? `url(${illustrationImage.src?.original})`
-                              : 'linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.5))'
-                      }`,
-                      backgroundSize: 'cover',
-                      backgroundPosition: 'left center',
-                      backgroundRepeat: 'no-repeat',
-                  }
-                  : {}
-          }
-      >
+    <>
       <Head>
-        <title>{getPageTitle('Starter Page')}</title>
+        <title>{getPageTitle('Legacy Business Builder')}</title>
       </Head>
 
-      <SectionFullScreen bg='violet'>
-      <div
-          className={`flex ${
-              contentPosition === 'right' ? 'flex-row-reverse' : 'flex-row'
-          } min-h-screen w-full`}
-      >
-          {contentType === 'image' && contentPosition !== 'background'
-              ? imageBlock(illustrationImage)
-              : null}
-          {contentType === 'video' && contentPosition !== 'background'
-              ? videoBlock(illustrationVideo)
-              : null}
-          <div className='flex items-center justify-center flex-col space-y-4 w-full lg:w-full'>
-        <CardBox className='w-full md:w-3/5 lg:w-2/3'>
-            <CardBoxComponentTitle title="Welcome to your Legacy Business Builder app!"/>
-        
-            <div className="space-y-3">
-                <p className='text-center text-gray-500'>This is a React.js/Node.js app generated by the <a className={`${textColor}`} href="https://flatlogic.com/generator">Flatlogic Web App Generator</a></p>
-                <p className='text-center text-gray-500'>For guides and documentation please check
-                    your local README.md and the <a className={`${textColor}`} href="https://flatlogic.com/documentation">Flatlogic documentation</a></p>
+      <div className="min-h-screen bg-[#F8FAFC] text-slate-950">
+        <header className="sticky top-0 z-20 border-b border-white/60 bg-white/80 backdrop-blur">
+          <div className="mx-auto flex w-full max-w-7xl items-center justify-between gap-4 px-6 py-4 lg:px-8">
+            <Link href="/" className="flex items-center gap-3">
+              <span className="inline-flex h-11 w-11 items-center justify-center rounded-2xl bg-[#EEF2FF] text-[#4F46E5] shadow-sm shadow-indigo-200/60">
+                <BaseIcon path={mdiRobotOutline} size={24} />
+              </span>
+              <div>
+                <div className="text-xs font-semibold uppercase tracking-[0.18em] text-slate-500">Legacy Business Builder</div>
+                <div className="text-sm font-medium text-slate-700">AI-powered launch operating system</div>
+              </div>
+            </Link>
+
+            <div className="flex flex-wrap items-center gap-3">
+              <BaseButton href="/login" color="whiteDark" outline label="Login" />
+              <BaseButton href="/dashboard" color="whiteDark" outline label="Admin interface" />
+              <BaseButton href="/legacy-launchpad" color="info" icon={mdiArrowRight} label="Open launchpad" />
             </div>
-        
-            <BaseButtons>
-                <BaseButton
-                    href='/login'
-                    label='Login'
-                    color='info'
-                    className='w-full'
-                />
+          </div>
+        </header>
 
-            </BaseButtons>
-        </CardBox>
-        </div>
-      </div>
-      </SectionFullScreen>
-      <div className='bg-black text-white flex flex-col text-center justify-center md:flex-row'>
-        <p className='py-6 text-sm'>© 2026 <span>{title}</span>. All rights reserved</p>
-        <Link className='py-6 ml-4 text-sm' href='/privacy-policy/'>
-            Privacy Policy
-        </Link>
-      </div>
+        <main>
+          <section className="relative overflow-hidden bg-[#0F172A] text-white">
+            <div className="absolute left-0 top-0 h-72 w-72 rounded-full bg-[#38BDF8]/20 blur-3xl" />
+            <div className="absolute right-0 top-8 h-80 w-80 rounded-full bg-[#8B5CF6]/25 blur-3xl" />
+            <div className="absolute bottom-0 left-1/3 h-56 w-56 rounded-full bg-[#F97316]/20 blur-3xl" />
+            <div className="relative mx-auto grid w-full max-w-7xl gap-10 px-6 py-20 lg:grid-cols-[1.15fr_0.85fr] lg:items-center lg:px-8 lg:py-28">
+              <div>
+                <div className="inline-flex items-center gap-2 rounded-full border border-white/10 bg-white/10 px-4 py-2 text-xs font-semibold uppercase tracking-[0.2em] text-slate-200">
+                  <span className="inline-flex h-2 w-2 rounded-full bg-emerald-400" />
+                  Idea to opening-day execution
+                </div>
+                <h1 className="mt-6 max-w-4xl text-5xl font-semibold tracking-tight md:text-6xl lg:text-7xl">
+                  Build the business legacy your family can inherit, operate, and grow.
+                </h1>
+                <p className="mt-6 max-w-3xl text-lg leading-8 text-slate-300">
+                  This app is designed for founder ideas that need more than a pitch deck. It creates a real launch workflow across funding,
+                  property, compliance research, design assets, staffing, training, marketing, and opening-day readiness.
+                </p>
 
-    </div>
+                <div className="mt-8 flex flex-wrap gap-4">
+                  <BaseButton href="/legacy-launchpad" color="info" icon={mdiArrowRight} label="Start the launch workflow" />
+                  <BaseButton href="/dashboard" color="whiteDark" outline label="Go to admin workspace" />
+                </div>
+
+                <div className="mt-10 grid gap-4 sm:grid-cols-2 xl:grid-cols-4">
+                  {valueBlocks.map((block) => (
+                    <div key={block.label} className="rounded-3xl border border-white/10 bg-white/10 p-4 backdrop-blur-sm">
+                      <div className="inline-flex h-11 w-11 items-center justify-center rounded-2xl bg-white/10 text-white">
+                        <BaseIcon path={block.icon} size={22} />
+                      </div>
+                      <div className="mt-4 text-sm font-semibold uppercase tracking-[0.15em] text-slate-300">{block.label}</div>
+                      <p className="mt-2 text-sm leading-6 text-slate-300">{block.text}</p>
+                    </div>
+                  ))}
+                </div>
+              </div>
+
+              <div className="grid gap-4">
+                <div className="rounded-[32px] border border-white/10 bg-white/10 p-6 backdrop-blur-md shadow-2xl shadow-slate-900/20">
+                  <div className="flex items-start justify-between gap-4">
+                    <div>
+                      <div className="text-xs font-semibold uppercase tracking-[0.16em] text-slate-300">Now live</div>
+                      <h2 className="mt-2 text-3xl font-semibold tracking-tight text-white">Legacy Launchpad</h2>
+                    </div>
+                    <span className="inline-flex rounded-full bg-emerald-400/10 px-3 py-1 text-xs font-semibold uppercase tracking-[0.14em] text-emerald-300">
+                      First MVP slice
+                    </span>
+                  </div>
+                  <p className="mt-4 text-sm leading-7 text-slate-300">
+                    The first delivery is a real founder intake that creates saved project records, timelines, tasks, compliance research, funding
+                    rounds, property notes, staffing plans, training, launch campaigns, and 3D/layout asset briefs.
+                  </p>
+                  <div className="mt-6 rounded-3xl bg-slate-950/50 p-5">
+                    <div className="text-xs font-semibold uppercase tracking-[0.16em] text-slate-400">Best for the first conversation</div>
+                    <div className="mt-3 text-sm leading-7 text-slate-300">
+                      “I have the vision in my head. Help me turn it into the first executable launch plan for my target city and state.”
+                    </div>
+                  </div>
+                </div>
+                <div className="rounded-[32px] border border-white/10 bg-white/10 p-6 backdrop-blur-md shadow-xl shadow-slate-900/20">
+                  <div className="text-xs font-semibold uppercase tracking-[0.16em] text-slate-300">Important</div>
+                  <p className="mt-3 text-sm leading-7 text-slate-300">
+                    The product can organize and draft launch research, but city/county/state legal and compliance items still need confirmation with
+                    agencies and licensed professionals before real-world decisions are made.
+                  </p>
+                </div>
+              </div>
+            </div>
+          </section>
+
+          <section className="mx-auto w-full max-w-7xl px-6 py-16 lg:px-8">
+            <div className="max-w-3xl">
+              <div className="text-xs font-semibold uppercase tracking-[0.18em] text-[#4F46E5]">What the platform handles</div>
+              <h2 className="mt-3 text-4xl font-semibold tracking-tight text-slate-950">A premium operations shell for turning a founder dream into a buildable business.</h2>
+              <p className="mt-4 text-base leading-8 text-slate-600">
+                Instead of leaving the concept trapped in notes, the app converts it into connected records and workflows your family can keep using as the business grows.
+              </p>
+            </div>
+
+            <div className="mt-10 grid gap-6 md:grid-cols-2 xl:grid-cols-4">
+              {featureCards.map((card) => (
+                <CardBox key={card.title} className="border border-slate-200/80 bg-white/90 shadow-sm shadow-slate-200/60">
+                  <div className="inline-flex h-12 w-12 items-center justify-center rounded-2xl bg-[#EEF2FF] text-[#4F46E5] shadow-sm shadow-indigo-200/60">
+                    <BaseIcon path={card.icon} size={24} />
+                  </div>
+                  <h3 className="mt-5 text-xl font-semibold tracking-tight text-slate-950">{card.title}</h3>
+                  <p className="mt-3 text-sm leading-7 text-slate-600">{card.text}</p>
+                </CardBox>
+              ))}
+            </div>
+          </section>
+
+          <section className="bg-white/70 py-16">
+            <div className="mx-auto w-full max-w-7xl px-6 lg:px-8">
+              <div className="max-w-3xl">
+                <div className="text-xs font-semibold uppercase tracking-[0.18em] text-[#4F46E5]">How it works</div>
+                <h2 className="mt-3 text-4xl font-semibold tracking-tight text-slate-950">Three deliberate moves to get from idea to a saved launch system.</h2>
+              </div>
+
+              <div className="mt-10 grid gap-6 lg:grid-cols-3">
+                {workflowSteps.map((step) => (
+                  <div key={step.title} className="rounded-[32px] border border-slate-200 bg-white p-6 shadow-sm shadow-slate-200/60">
+                    <div className="flex items-center justify-between gap-4">
+                      <div className="text-xs font-semibold uppercase tracking-[0.16em] text-[#4F46E5]">{step.eyebrow}</div>
+                      <span className="inline-flex h-11 w-11 items-center justify-center rounded-2xl bg-slate-950 text-white">
+                        <BaseIcon path={step.icon} size={22} />
+                      </span>
+                    </div>
+                    <h3 className="mt-6 text-2xl font-semibold tracking-tight text-slate-950">{step.title}</h3>
+                    <p className="mt-4 text-sm leading-7 text-slate-600">{step.text}</p>
+                  </div>
+                ))}
+              </div>
+            </div>
+          </section>
+
+          <section className="mx-auto w-full max-w-7xl px-6 py-16 lg:px-8">
+            <div className="rounded-[36px] bg-[#0F172A] px-6 py-10 text-white shadow-2xl shadow-slate-900/20 md:px-10">
+              <div className="grid gap-8 lg:grid-cols-[1.2fr_0.8fr] lg:items-center">
+                <div>
+                  <div className="text-xs font-semibold uppercase tracking-[0.18em] text-slate-400">Start inside the real app</div>
+                  <h2 className="mt-3 text-4xl font-semibold tracking-tight">Open the admin interface, then use Legacy Launchpad to create the first working plan.</h2>
+                  <p className="mt-4 max-w-3xl text-base leading-8 text-slate-300">
+                    The landing page stays public. The planning workflow and entity records stay protected behind login, so your business operating system stays private while you build it.
+                  </p>
+                </div>
+                <div className="flex flex-wrap gap-4 lg:justify-end">
+                  <BaseButton href="/login" color="info" label="Login" />
+                  <BaseButton href="/dashboard" color="whiteDark" outline label="Admin interface" />
+                </div>
+              </div>
+            </div>
+          </section>
+        </main>
+
+        <footer className="border-t border-slate-200 bg-white/80">
+          <div className="mx-auto flex w-full max-w-7xl flex-col gap-4 px-6 py-6 text-sm text-slate-500 md:flex-row md:items-center md:justify-between lg:px-8">
+            <div>© 2026 Legacy Business Builder. Built to turn founder vision into a lasting family-owned operating system.</div>
+            <div className="flex items-center gap-4">
+              <Link href="/privacy-policy" className="transition-colors duration-150 hover:text-slate-900">
+                Privacy Policy
+              </Link>
+              <Link href="/login" className="transition-colors duration-150 hover:text-slate-900">
+                Login
+              </Link>
+            </div>
+          </div>
+        </footer>
+      </div>
+    </>
   );
 }
 
-Starter.getLayout = function getLayout(page: ReactElement) {
+HomePage.getLayout = function getLayout(page: ReactElement) {
   return <LayoutGuest>{page}</LayoutGuest>;
 };
-

frontend/src/pages/search.tsx

@@ -1,9 +1,7 @@
 import React, { ReactElement, useEffect, useState } from 'react';
 import Head from 'next/head';
 import 'react-datepicker/dist/react-datepicker.css';
-import { useAppDispatch } from '../stores/hooks';
-
-import { useAppSelector } from '../stores/hooks';
+import { useAppDispatch, useAppSelector } from '../stores/hooks';
 
 import { useRouter } from 'next/router';
 import LayoutAuthenticated from '../layouts/Authenticated';