mirror of
https://github.com/seanmorley15/AdventureLog.git
synced 2025-07-25 15:59:38 +02:00
Enhance category management: update adventure category assignment logic, improve category display in UI components, and add dynamic sorting for category dropdown
This commit is contained in:
parent
adf45ff557
commit
f878167a36
6 changed files with 441 additions and 429 deletions
|
@ -405,16 +405,20 @@
|
|||
console.log(adventure);
|
||||
if (adventure.id === '') {
|
||||
console.log(categories);
|
||||
if (categories.some((category) => category.name === 'general')) {
|
||||
adventure.category = categories.find((category) => category.name === 'general') as Category;
|
||||
} else {
|
||||
adventure.category = {
|
||||
id: '',
|
||||
name: 'general',
|
||||
display_name: 'General',
|
||||
icon: '🌍',
|
||||
user_id: ''
|
||||
};
|
||||
if (adventure.category?.display_name == '') {
|
||||
if (categories.some((category) => category.name === 'general')) {
|
||||
adventure.category = categories.find(
|
||||
(category) => category.name === 'general'
|
||||
) as Category;
|
||||
} else {
|
||||
adventure.category = {
|
||||
id: '',
|
||||
name: 'general',
|
||||
display_name: 'General',
|
||||
icon: '🌍',
|
||||
user_id: ''
|
||||
};
|
||||
}
|
||||
}
|
||||
let res = await fetch('/api/adventures', {
|
||||
method: 'POST',
|
||||
|
|
|
@ -77,16 +77,19 @@
|
|||
>
|
||||
</div>
|
||||
<div class="flex flex-wrap gap-2 mt-2">
|
||||
<!-- svelte-ignore a11y-no-static-element-interactions -->
|
||||
{#each categories as category}
|
||||
<!-- svelte-ignore a11y-click-events-have-key-events -->
|
||||
<!-- svelte-ignore a11y-no-static-element-interactions -->
|
||||
<div
|
||||
<!-- Sort the categories dynamically before rendering -->
|
||||
{#each categories
|
||||
.slice()
|
||||
.sort((a, b) => (b.num_adventures || 0) - (a.num_adventures || 0)) as category}
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-neutral flex items-center space-x-2"
|
||||
on:click={() => selectCategory(category)}
|
||||
role="option"
|
||||
aria-selected={selected_category && selected_category.id === category.id}
|
||||
>
|
||||
<span>{category.display_name} {category.icon} ({category.num_adventures})</span>
|
||||
</div>
|
||||
</button>
|
||||
{/each}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -6,6 +6,8 @@
|
|||
let modal: HTMLDialogElement;
|
||||
import { t } from 'svelte-i18n';
|
||||
|
||||
import InformationSlabCircle from '~icons/mdi/information-slab-circle';
|
||||
|
||||
export let categories: Category[] = [];
|
||||
|
||||
let category_to_edit: Category | null = null;
|
||||
|
@ -86,6 +88,8 @@
|
|||
<button on:click={removeCategory(category)} class="btn btn-warning btn-sm"
|
||||
>{$t('adventures.remove')}</button
|
||||
>
|
||||
{:else}
|
||||
<button class="btn btn-warning btn-sm btn-disabled">{$t('adventures.remove')}</button>
|
||||
{/if}
|
||||
</div>
|
||||
</div>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue