1
0
Fork 0
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:
Sean Morley 2024-11-26 20:06:52 -05:00
parent adf45ff557
commit f878167a36
6 changed files with 441 additions and 429 deletions

View file

@ -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',

View file

@ -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>

View file

@ -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>