21f0ee704b
Adds the scheduling core to Prisma (Shop, Location, Method enum, SlotTemplate, SlotOverride, BlackoutDate — IMPLEMENTATION_PLAN.md §4) and Polaris admin screens to manage them: - /app/locations: list/create/edit/delete locations, one-click vertical template seeding (bakery/florist/grocer) - /app/slots: weekly slot template editor, scoped per location - /app/blackouts: blackout dates, scoped to one location or all of them services/templates.server.ts keeps the vertical presets as a pure, unit-tested function (getVerticalTemplate) separate from the thin I/O wrapper (seedVerticalTemplate) that does the actual Prisma writes, per CLAUDE.md's "pure functions, inject data, no I/O in the math" rule. Switched dev DB from SQLite to Postgres (docker-compose.yml, ports 5433/6380 to avoid clashing with other local projects already on 5432/6379): SQLite doesn't support Prisma enums at all, and IMPLEMENTATION_PLAN.md's schema relies on them (Method) plus Postgres-only array fields in later phases (Zone.postalCodes, ProductRule.allowedLocationIds). Only one throwaway migration existed, so switching now avoids compounding the rework later. Also fixed a Remix/Polaris integration issue hit while building these forms: this Polaris version's TextField/Checkbox are fully controlled (no defaultValue/defaultChecked), and `data()` imported from `@remix-run/react` (rather than `@remix-run/node`) breaks useActionData's type inference — both are now handled correctly across the new routes. Verified: lint, typecheck, unit tests (incl. template-seeding fixtures), build, and a live end-to-end run of seedVerticalTemplate against the Postgres container all pass. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
60 lines
2.2 KiB
TypeScript
60 lines
2.2 KiB
TypeScript
import type { LoaderFunctionArgs } from "@remix-run/node";
|
|
import { useLoaderData } from "@remix-run/react";
|
|
import { Page, Layout, Text, Card, BlockStack, EmptyState, InlineStack, Badge } from "@shopify/polaris";
|
|
import { TitleBar } from "@shopify/app-bridge-react";
|
|
import { authenticate } from "../shopify.server";
|
|
import db from "../db.server";
|
|
|
|
export const loader = async ({ request }: LoaderFunctionArgs) => {
|
|
const { session } = await authenticate.admin(request);
|
|
|
|
const locations = await db.location.findMany({
|
|
where: { shopDomain: session.shop },
|
|
include: { _count: { select: { slotTemplates: true } } },
|
|
});
|
|
|
|
return { locations };
|
|
};
|
|
|
|
export default function Index() {
|
|
const { locations } = useLoaderData<typeof loader>();
|
|
|
|
return (
|
|
<Page>
|
|
<TitleBar title="Delivery Date & Time" />
|
|
<BlockStack gap="500">
|
|
<Layout>
|
|
<Layout.Section>
|
|
<Card>
|
|
{locations.length === 0 ? (
|
|
<EmptyState
|
|
heading="No locations configured yet"
|
|
action={{ content: "Add a location", url: "/app/locations" }}
|
|
image="https://cdn.shopify.com/s/files/1/0757/9955/files/empty-state.svg"
|
|
>
|
|
<Text as="p" variant="bodyMd">
|
|
Set up a fulfillment location and its weekly slots to start
|
|
taking scheduled Shipping, Local Delivery, or Pickup orders.
|
|
</Text>
|
|
</EmptyState>
|
|
) : (
|
|
<BlockStack gap="300">
|
|
<Text as="h2" variant="headingMd">
|
|
{locations.length} location{locations.length === 1 ? "" : "s"} configured
|
|
</Text>
|
|
{locations.map((location) => (
|
|
<InlineStack key={location.id} align="space-between">
|
|
<Text as="span">{location.name}</Text>
|
|
<Badge>{`${location._count.slotTemplates} slot templates`}</Badge>
|
|
</InlineStack>
|
|
))}
|
|
</BlockStack>
|
|
)}
|
|
</Card>
|
|
</Layout.Section>
|
|
</Layout>
|
|
</BlockStack>
|
|
</Page>
|
|
);
|
|
}
|