Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: Storage page #29

Merged
merged 28 commits into from
Aug 26, 2024
Merged
Changes from 1 commit
Commits
Show all changes
28 commits
Select commit Hold shift + click to select a range
390b7ac
feat: Add basic template as storage page
ZeroWave022 Aug 22, 2024
4da9027
feat(ui): Add Input component
ZeroWave022 Aug 22, 2024
7102bca
feat(ui): Add SearchIcon and SearchBar
ZeroWave022 Aug 22, 2024
6fbe0ac
feat: Add SearchBar to the storage page
ZeroWave022 Aug 22, 2024
6d369b9
fix: Rename to correct svg attributes in SearchIcon
ZeroWave022 Aug 22, 2024
6b43485
feat(ui): Add Combobox (and required subcomponents) and its dependencies
ZeroWave022 Aug 22, 2024
0843c07
feat: Add Combobox to storage page
ZeroWave022 Aug 22, 2024
104dfc4
feat: Add translations to storage page
ZeroWave022 Aug 22, 2024
ef7e550
refactor: Replace search icon with Lucide variant
ZeroWave022 Aug 22, 2024
54fdd71
feat: Add cards to storage page
ZeroWave022 Aug 22, 2024
06cf66d
feat: Add pagination to storage page
ZeroWave022 Aug 22, 2024
03cc504
feat: Add filters, move categories on storage page
ZeroWave022 Aug 22, 2024
83e689c
feat: Make storage grid responsive
ZeroWave022 Aug 23, 2024
495439d
Merge branch 'main' into storage-page
ZeroWave022 Aug 23, 2024
6b5608c
refactor: Lint with Biome
ZeroWave022 Aug 23, 2024
5d5ddc7
build: Remove unnecessary dependencies
ZeroWave022 Aug 24, 2024
8377e50
feat(ui): Add custom class name props to Combobox
ZeroWave022 Aug 25, 2024
bb5233d
feat(ui): Add Select component
ZeroWave022 Aug 25, 2024
5942aaa
refactor: Use Select instead of DropdownMenu on storage page
ZeroWave022 Aug 25, 2024
a5c3cb6
fix: Add padding to storage page title
ZeroWave022 Aug 25, 2024
0ad67f3
fix: Translate combobox messages
ZeroWave022 Aug 25, 2024
5bc7237
refactor: Re-order storage page cards
ZeroWave022 Aug 25, 2024
78de1c0
refactor: Lint with Biome
ZeroWave022 Aug 25, 2024
c6b8879
feat: Add hover animation to storage page cards
ZeroWave022 Aug 25, 2024
9d14ab4
feat: Add shopping cart button with tooltip
ZeroWave022 Aug 25, 2024
a3a95c8
refactor: Move storage page header to own layout
ZeroWave022 Aug 25, 2024
3507f29
feat: Add loading animation to storage page
ZeroWave022 Aug 25, 2024
b8cc534
fix: Keep at least two columns on storage page above xs size
ZeroWave022 Aug 26, 2024
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Next Next commit
refactor: Use Select instead of DropdownMenu on storage page
  • Loading branch information
ZeroWave022 committed Aug 25, 2024

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature.
commit 5942aaadf01ad3087d8a0887bedf5eea446c619a
4 changes: 2 additions & 2 deletions messages/en.json
Original file line number Diff line number Diff line change
@@ -56,9 +56,9 @@
"quantityInfo": "{quantity} units available",
"locationInfo": "Location: {location}"
},
"dropdown": {
"select": {
"filters": "Filters",
"buttonLabel": "Sort results",
"defaultPlaceholder": "Sort results",
"popularity": "Popularity",
"sortDescending": "Inventory (descending)",
"sortAscending": "Inventory (ascending)",
4 changes: 2 additions & 2 deletions messages/no.json
Original file line number Diff line number Diff line change
@@ -56,9 +56,9 @@
"quantityInfo": "{quantity} stk. på lager",
"locationInfo": "Hylleplass: {location}"
},
"dropdown": {
"select": {
"filters": "Filtre",
"buttonLabel": "Sorter resultater",
"defaultPlaceholder": "Sorter resultater",
"popularity": "Popularitet",
"sortDescending": "Lagerbeholdning (synkende)",
"sortAscending": "Lagerbeholdning (stigende)",
50 changes: 25 additions & 25 deletions src/app/[locale]/(default)/storage/page.tsx
Original file line number Diff line number Diff line change
@@ -5,7 +5,6 @@ import Image from 'next/image';
import { createSearchParamsCache, parseAsInteger } from 'nuqs/parsers';

import { PaginationCarousel } from '@/components/layout/PaginationCarousel';
import { Button } from '@/components/ui/Button';
import {
Card,
CardContent,
@@ -15,15 +14,14 @@ import {
CardTitle,
} from '@/components/ui/Card';
import { Combobox } from '@/components/ui/Combobox';
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuLabel,
DropdownMenuSeparator,
DropdownMenuTrigger,
} from '@/components/ui/DropdownMenu';
import { SearchBar } from '@/components/ui/SearchBar';
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from '@/components/ui/Select';

export async function generateMetadata({
params: { locale },
@@ -77,34 +75,36 @@ export default function StoragePage({
];

const filters = [
'dropdown.popularity',
'dropdown.sortDescending',
'dropdown.sortAscending',
'dropdown.name',
'select.popularity',
'select.sortDescending',
'select.sortAscending',
'select.name',
] as const;

return (
<>
<h1>{t('title')}</h1>
<div className='my-4 flex justify-center gap-2'>
<SearchBar className='max-w-2xl' />
<DropdownMenu>
<DropdownMenuTrigger asChild>
<Button>{t('dropdown.buttonLabel')}</Button>
</DropdownMenuTrigger>
<DropdownMenuContent>
<DropdownMenuLabel>{t('dropdown.filters')}</DropdownMenuLabel>
<DropdownMenuSeparator />
<div className='my-4 flex flex-col justify-center gap-2 lg:flex-row'>
<SearchBar className='lg:max-w-2xl' />
<Select>
<SelectTrigger className='w-full lg:w-[250px]'>
<SelectValue placeholder={t('select.defaultPlaceholder')} />
</SelectTrigger>
<SelectContent>
{filters.map((filter) => (
<DropdownMenuItem key={filter}>{t(filter)}</DropdownMenuItem>
<SelectItem key={filter} value={filter}>
{t(filter)}
</SelectItem>
))}
</DropdownMenuContent>
</DropdownMenu>
</SelectContent>
</Select>

<Combobox
choices={categories}
defaultDescription={t('combobox.defaultDescription')}
defaultPlaceholder={t('combobox.defaultPlaceholder')}
buttonClassName='w-full lg:w-[250px]'
contentClassName='w-full lg:w-[200px]'
/>
</div>
<div className='grid grid-cols-1 gap-3 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4'>
ZeroWave022 marked this conversation as resolved.
Show resolved Hide resolved