Skip to content

Commit 836f2d9

Browse files
PlopixPlopix
committed
feat(cli): introduce zero sync
1 parent 9ba9e5d commit 836f2d9

File tree

8 files changed

+234
-61
lines changed

8 files changed

+234
-61
lines changed

‎atw-cli/package.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,8 +16,9 @@
1616
"commander": "^13.1.0",
1717
"ink": "^5.1.1",
1818
"ink-link": "^4.1.0",
19+
"lib": "workspace:*",
1920
"picocolors": "^1.1.1",
20-
"react": "18",
21+
"react": "^18",
2122
"react-devtools-core": "^6.1.1"
2223
}
2324
}

‎atw-cli/src/actions/register.action.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@ export type Event = {
44
slug: string
55
name: string
66
startDate: string
7-
location: string
7+
shortLocation: string|null
88
}
99

1010
export const registerAction = async (email: string, eventId: Event['id']) => {

‎atw-cli/src/commands/register.tsx‎

Lines changed: 24 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -3,29 +3,43 @@ import { Box, Newline, render, Text } from 'ink';
33
import { FooterSpeakers } from "../ui/speaker";
44
import { RegisterJourney } from "../ui/register-journey";
55
import pc from "picocolors";
6-
6+
import { ZeroProvider } from "@rocicorp/zero/react";
7+
import { Zero } from "@rocicorp/zero";
78
import { logo } from "..";
8-
9+
import { schema } from "@lib/zero-sync/schema";
910

1011
export const createRegisterCommand = (): Command => {
1112
const command = new Command("register")
1213
.description("Register to an event.")
1314
.action(async () => {
1415
console.log(pc.dim(logo));
16+
const z = new Zero({
17+
userID: "anon",
18+
server: 'https://allthingsweb-sync.fly.dev',
19+
schema,
20+
kvStore: 'mem',
21+
});
1522
const { waitUntilExit, unmount } = render(
16-
<>
17-
<Text bold italic>Register to an event!</Text>
18-
<RegisterJourney unmount={() => unmount()} />
19-
<Newline />
20-
<Box flexDirection="column" padding={1} gap={1}>
21-
<FooterSpeakers />
22-
</Box>
23-
</>,
23+
<ZeroProvider zero={z}>
24+
<>
25+
<Text bold italic>Register to an event!</Text>
26+
<RegisterJourney unmount={() => unmount()} />
27+
<Newline />
28+
<Box flexDirection="column" padding={1} gap={1}>
29+
<FooterSpeakers />
30+
</Box>
31+
</>
32+
</ZeroProvider>,
2433
{
2534
exitOnCtrlC: true,
2635
}
2736
);
2837
await waitUntilExit();
38+
39+
40+
render(<Box flexDirection="column" padding={1} gap={1}>
41+
<Text>Register to an event!</Text>
42+
</Box>)
2943
});
3044
return command;
3145
}

‎atw-cli/src/ui/components/select.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,7 @@ export function Select<T>({ options, onSelect, defaultSelectedIndex = 0, colors
7171
})}
7272
{overflowItem && (
7373
<Box marginLeft={3} flexDirection="row">
74-
<Text>
74+
<Text dimColor>
7575
{overflowItem.label}
7676
<Newline />
7777
...

‎atw-cli/src/ui/register-journey.tsx‎

Lines changed: 10 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
11
import { Box, Text } from "ink"
2-
import { useEffect, useState } from "react"
2+
import { useState } from "react"
33
import { Select } from "./components/select"
44
import { EmailInput, Spinner } from '@inkjs/ui';
55

66
import { registerAction, type Event } from "../actions/register.action"
77
import Link from "ink-link";
8+
import { useQuery, useZero } from "@rocicorp/zero/react";
9+
import { schema } from "@lib/zero-sync/schema";
810

911
type RegisterJourneyProps = {
1012
unmount: () => void
@@ -13,31 +15,13 @@ type RegisterJourneyProps = {
1315
const toDate = (date: string) => `${new Date(date).toLocaleDateString()} ${new Date(date).toLocaleTimeString()}`
1416

1517
export const RegisterJourney = ({ unmount }: RegisterJourneyProps) => {
16-
const [events, setEvents] = useState<{
17-
id: string,
18-
slug: string,
19-
name: string,
20-
startDate: string,
21-
location: string
22-
}[]>([])
23-
18+
const z = useZero<typeof schema>();
19+
20+
//where('startDate', '>', now.toUTCString())
21+
const eventQuery = z.query.events.orderBy('startDate', 'desc').limit(10);
22+
const [events] = useQuery(eventQuery);
2423
const [event, setEvent] = useState<Event | null>(null)
2524
const [hasSucceeded, setHasSucceeded] = useState(false)
26-
27-
useEffect(() => {
28-
const fetchEvents = async () => {
29-
try {
30-
const response = await fetch('https://allthingsweb.dev/api/events')
31-
const { data } = await response.json()
32-
setEvents(data)
33-
} catch (error) {
34-
console.error(error)
35-
}
36-
37-
}
38-
fetchEvents()
39-
}, [])
40-
4125
return <Box flexDirection="column" padding={1} gap={1}>
4226

4327
{!event && <Text>Here is the list of the upcomping events:</Text>}
@@ -49,7 +33,7 @@ export const RegisterJourney = ({ unmount }: RegisterJourneyProps) => {
4933
render: (label, value, isSelected) => <Box>
5034
<Box flexDirection="column">
5135
<Text bold={isSelected} dimColor={!isSelected}>{label}</Text>
52-
<Text dimColor={!isSelected}>{toDate(event.startDate)} - {value.location}</Text>
36+
<Text dimColor={!isSelected}>{toDate(event.startDate)} - {value.shortLocation}</Text>
5337
<Link url={link}>
5438
<Text color={'#FF9900'} dimColor={!isSelected}>{link}</Text>
5539
</Link>
@@ -63,7 +47,7 @@ export const RegisterJourney = ({ unmount }: RegisterJourneyProps) => {
6347
{event && <Box flexDirection="column" padding={1} gap={1} borderStyle={"round"}>
6448
<Box flexDirection="column">
6549
<Text bold>{event.name}</Text>
66-
<Text>{toDate(event.startDate)} - {event.location}</Text>
50+
<Text>{toDate(event.startDate)} - {event.shortLocation}</Text>
6751
<Link url={`https://allthingsweb.dev/${event.slug}`}>
6852
<Text color={'#FF9900'}>{`https://allthingsweb.dev/${event.slug}`}</Text>
6953
</Link>

‎atw-cli/tsconfig.json‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -22,6 +22,10 @@
2222
// Some stricter flags (disabled by default)
2323
"noUnusedLocals": true,
2424
"noUnusedParameters": true,
25-
"noPropertyAccessFromIndexSignature": false
25+
"noPropertyAccessFromIndexSignature": false,
26+
27+
"paths": {
28+
"@lib/*": ["../lib/*"]
29+
}
2630
}
2731
}

0 commit comments

Comments
 (0)