Skip to content

Commit

Permalink
adding items in shopping
Browse files Browse the repository at this point in the history
  • Loading branch information
a-type committed May 20, 2024
1 parent 46ec3ac commit 341256f
Show file tree
Hide file tree
Showing 5 changed files with 504 additions and 20 deletions.
29 changes: 29 additions & 0 deletions apps/shopping/web/src/components/lists/CreateItemButton.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,29 @@
import { ButtonProps, Button } from '@a-type/ui/components/button';
import { Icon } from '@a-type/ui/components/icon';
import { List } from '@shopping.biscuits/verdant';

export interface CreateItemButtonProps extends ButtonProps {
list: List;
}

export function CreateItemButton({
list,
children,
...rest
}: CreateItemButtonProps) {
const createItem = () => {
const item = list.get('items').push({
description: 'New idea',
});
};
return (
<Button onClick={createItem}>
{children ?? (
<>
<Icon name="plus" />
Add idea
</>
)}
</Button>
);
}
10 changes: 8 additions & 2 deletions apps/shopping/web/src/components/lists/ListView.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,21 +2,27 @@ import { hooks } from '@/store.js';
import { H1 } from '@a-type/ui/components/typography';
import { List } from '@shopping.biscuits/verdant';
import { ListItem } from './ListItem.jsx';
import { PageNowPlaying } from '@a-type/ui/components/layouts';
import { CreateItemButton } from './CreateItemButton.jsx';

export interface ListViewProps {
list: List;
}

export function ListView({ list }: ListViewProps) {
const { name, items } = hooks.useWatch(list);
hooks.useWatch(items);
return (
<div className="col">
<div className="col items-stretch">
<H1>{name}</H1>
<div className="col">
<div className="col items-stretch">
{items.map((item) => (
<ListItem item={item} key={item.get('id')} />
))}
</div>
<PageNowPlaying unstyled className="justify-end">
<CreateItemButton list={list} />
</PageNowPlaying>
</div>
);
}
2 changes: 1 addition & 1 deletion apps/shopping/web/src/pages/HomePage.tsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import { CreateListButton } from '@/components/lists/CreateListButton.jsx';
import { hooks } from '@/store.js';
import { PageContent, PageFixedArea } from '@a-type/ui/components/layouts';
import { PageContent } from '@a-type/ui/components/layouts';
import { H1, P } from '@a-type/ui/components/typography';
import { useLocalStorage } from '@biscuits/client';
import { useNavigate } from '@verdant-web/react-router';
Expand Down
5 changes: 4 additions & 1 deletion apps/shopping/web/src/pages/Pages.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import { Link } from '@verdant-web/react-router';
import { TopLoader } from '@/components/nav/TopLoader.jsx';
import { ReloadButton } from '@biscuits/client';
import ListPage from './ListPage.jsx';
import { PageRoot } from '@a-type/ui/components/layouts';

const routes = makeRoutes([
{
Expand Down Expand Up @@ -43,7 +44,9 @@ export function Pages() {
<Suspense fallback={<Spinner />}>
<Router routes={routes} onNavigate={handleNavigate}>
<TopLoader />
<Outlet />
<PageRoot>
<Outlet />
</PageRoot>
</Router>
</Suspense>
</ErrorBoundary>
Expand Down
Loading

0 comments on commit 341256f

Please sign in to comment.