thepaperpilot/gardening-app
1
0
Fork 0
Code Issues Pull requests Releases Activity Actions

Fix navbar links not rendering active when thread is open

Browse source
This commit is contained in:
thepaperpilot 2024-05-27 22:45:05 -05:00
parent cf3fb3e6ef
commit a3494184c8
3 changed files with 61 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
src/components/Item.vue
View file

@ -239,9 +239,11 @@ function deleteItem() {
function openThread(e: MouseEvent | TouchEvent, index: number) {
e.preventDefault();
if (!dragged.value) {
router.push(
isSelected(index) ? props.baseUrl :
`${props.baseUrl}/${props.item.source}/${props.item.sourceItem}/${index}`);
if (isSelected(index)) {
emits("deselect");
} else {
router.push(`${props.baseUrl}/${props.item.source}/${props.item.sourceItem}/${index}`);
}
}
}

2
src/components/Nav.vue
View file

@ -17,7 +17,7 @@
<RouterLink :to="`source/${contact.source}/${contact.id}/${contact.thread}`" class="flex items-center text-gray-900 rounded-lg dark:text-white hover:bg-gray-100 dark:hover:bg-gray-700 group relative" active-class="bg-gray-100 dark:bg-gray-700">
<Avatar :image="contact.image" :name="contact.name" :status="contact.status ?? 'unknown'" />
<span v-if="contact.count > 0" class="absolute bg-gray-800 bottom-0 right-0 h-4 w-4 text-center rounded-full">{{ Math.min(contact.count, 9) }}</span>
<FontAwesomeIcon v-else :icon="faThumbTack" class="star absolute drop-shadow-2xl bottom-0 right-0 h-4 w-4 text-center rounded-full" />
<FontAwesomeIcon v-else :icon="faThumbTack" class="star absolute drop-shadow-2xl bottom-0 right-0 h-4 w-4 text-center rounded-full" />
</RouterLink>
</li>
</ul>

60
src/main.ts
View file

@ -11,11 +11,61 @@ import Unsorted from "./components/pages/Unsorted.vue";
const routes: RouteRecordRaw[] = [
{ path: '/', component: Todo, name: 'home' },
{ path: '/todo/:source(\\d+)?/:sourceItem(\\d+)?/:thread(\\d+)?', component: Todo, name: 'todo' },
{ path: '/snoozed/:source(\\d+)?/:sourceItem(\\d+)?/:thread(\\d+)?', component: Snoozed, name: 'snoozed' },
{ path: '/low/:source(\\d+)?/:sourceItem(\\d+)?/:thread(\\d+)?', component: LowPriority, name: 'low' },
{ path: '/source/:source(\\d+)/:sourceItem(\\d+)?/:thread(\\d+)?/:event(\\d+)?', component: Source, name: 'source' },
{ path: '/unsorted/:source(\\d+)?/:sourceItem(\\d+)?/:thread(\\d+)?', component: Unsorted, name: 'unsorted' },
{
path: '/todo',
component: Todo,
name: 'todo',
children: [
{
path: ':source(\\d+)/:sourceItem(\\d+)/:thread(\\d+)',
component: Todo
}
]
},
{
path: '/snoozed',
component: Snoozed,
name: 'snoozed',
children: [
{
path: ':source(\\d+)/:sourceItem(\\d+)/:thread(\\d+)',
component: Snoozed
}
]
},
{
path: '/low',
component: LowPriority,
name: 'low',
children: [
{
path: ':source(\\d+)/:sourceItem(\\d+)/:thread(\\d+)',
component: LowPriority
}
]
},
{
path: '/source/:source(\\d+)',
component: Source,
name: 'source',
children: [
{
path: ':sourceItem(\\d+)/:thread(\\d+)/:event(\\d+)?',
component: Source
}
]
},
{
path: '/unsorted',
component: Unsorted,
name: 'unsorted',
children: [
{
path: ':source(\\d+)/:sourceItem(\\d+)/:thread(\\d+)',
component: Unsorted
}
]
}
];
const router = createRouter({