Abdullah.
5a657129f0
Reorganizes the flat `sections/stepper/` (30 files — two distinct steppers plus shared code) into two product-feature-style sections, and moves the shared code to the shared layers. - **`sections/home-stepper/`** — the home-page stepper. Renamed `Stepper` → `HomeStepper` (and the home components → `HomeStepperLottie` / `HomeStepperSteps` / `HomeStepperVisualFrame`) for symmetry with `ProductStepper`. Shell at the root + `components/`/`data/`/`utils/` + barrel. - **`sections/product-stepper/`** — the product-page stepper, same structure. The 3 files both steppers shared can't live in a shared *section* — `check-conventions` forbids a section importing another section. So they moved to the shared layers: - `StepperProgressRail`, `StepperSwipeDeck` → `ui/` - `useBreakpointStepSync` → `platform/motion` Both consumer pages repointed (`@/sections/home-stepper`, `@/sections/product-stepper`); the row-gap allowlist in `check-conventions.mjs` updated to the new paths; explanatory comments stripped across the moved files (CSS-in-template comments and `'use client'` kept). Pure reorganization — no behavior change. typecheck + lint + build all green.
145 lines
3.1 KiB
TypeScript
145 lines
3.1 KiB
TypeScript
import { type PRODUCT_STEPPER_SCENE } from '@/tokens/feature-scenes/product-stepper-scene';
|
|
|
|
import {
|
|
type LayoutFieldIconType,
|
|
type LayoutNavIconType,
|
|
} from '../components/LayoutIcons';
|
|
|
|
type NavTint = keyof typeof PRODUCT_STEPPER_SCENE.navTints;
|
|
|
|
export type LayoutFieldDefinition = {
|
|
icon: LayoutFieldIconType;
|
|
id: string;
|
|
label: string;
|
|
section: string;
|
|
type: string;
|
|
visible: boolean;
|
|
};
|
|
|
|
export type LayoutNavItemDefinition = {
|
|
background: NavTint;
|
|
children?: { background: NavTint; icon: LayoutNavIconType; label: string }[];
|
|
icon: LayoutNavIconType;
|
|
isActive: boolean;
|
|
isFolder?: boolean;
|
|
label: string;
|
|
suffix?: string;
|
|
};
|
|
|
|
export const LAYOUT_EDITOR_CONTENT: {
|
|
fields: LayoutFieldDefinition[];
|
|
navItems: LayoutNavItemDefinition[];
|
|
} = {
|
|
fields: [
|
|
{
|
|
id: 'url',
|
|
icon: 'link',
|
|
label: 'URL',
|
|
type: 'Link',
|
|
section: 'General',
|
|
visible: true,
|
|
},
|
|
{
|
|
id: 'account-owner',
|
|
icon: 'user',
|
|
label: 'Account Owner',
|
|
type: 'Relation',
|
|
section: 'General',
|
|
visible: true,
|
|
},
|
|
{
|
|
id: 'revenue',
|
|
icon: 'money',
|
|
label: 'Revenue',
|
|
type: 'Currency',
|
|
section: 'General',
|
|
visible: true,
|
|
},
|
|
{
|
|
id: 'icp',
|
|
icon: 'target',
|
|
label: 'ICP',
|
|
type: 'Boolean',
|
|
section: 'Additional',
|
|
visible: false,
|
|
},
|
|
{
|
|
id: 'employees',
|
|
icon: 'users',
|
|
label: 'Employees',
|
|
type: 'Number',
|
|
section: 'Other',
|
|
visible: true,
|
|
},
|
|
{
|
|
id: 'address',
|
|
icon: 'map',
|
|
label: 'Address',
|
|
type: 'Address',
|
|
section: 'Other',
|
|
visible: true,
|
|
},
|
|
{
|
|
id: 'creation-date',
|
|
icon: 'calendar',
|
|
label: 'Creation date',
|
|
type: 'Date & Time',
|
|
section: 'Other',
|
|
visible: true,
|
|
},
|
|
],
|
|
navItems: [
|
|
{
|
|
icon: 'building',
|
|
label: 'Companies',
|
|
isActive: true,
|
|
background: 'indigo',
|
|
},
|
|
{ icon: 'user', label: 'People', isActive: false, background: 'indigo' },
|
|
{
|
|
icon: 'target',
|
|
label: 'Opportunities',
|
|
isActive: false,
|
|
background: 'red',
|
|
},
|
|
{
|
|
icon: 'checkbox',
|
|
label: 'Tasks',
|
|
isActive: false,
|
|
background: 'teal',
|
|
},
|
|
{ icon: 'notes', label: 'Notes', isActive: false, background: 'teal' },
|
|
{
|
|
icon: 'letterS',
|
|
label: 'Sales Dashboard',
|
|
isActive: false,
|
|
background: 'yellow',
|
|
suffix: 'Dashboard',
|
|
},
|
|
{
|
|
icon: 'automation',
|
|
label: 'Workflows',
|
|
isActive: false,
|
|
background: 'peach',
|
|
isFolder: true,
|
|
children: [
|
|
{ icon: 'automation', label: 'Workflows', background: 'gray' },
|
|
{ icon: 'play', label: 'Workflows runs', background: 'gray' },
|
|
{
|
|
icon: 'versions',
|
|
label: 'Workflows versions',
|
|
background: 'gray',
|
|
},
|
|
],
|
|
},
|
|
{ icon: 'ai', label: 'Claude', isActive: false, background: 'gray' },
|
|
{
|
|
icon: 'stripeS',
|
|
label: 'Stripe',
|
|
isActive: false,
|
|
background: 'gray',
|
|
isFolder: true,
|
|
},
|
|
],
|
|
};
|