jennie/app
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

refactor: replace Wizard with CoopBuilder in navigation, enhance budget store structure, and streamline template components for improved user experience

Browse source
This commit is contained in:
Jennie Robinson Faber 2025-08-17 17:25:04 +01:00
parent eede87a273
commit f67b138d95
33 changed files with 4970 additions and 2451 deletions
Download patch file Download diff file Expand all files Collapse all files

90
app.vue
View file

@ -9,12 +9,11 @@
<div class="relative flex items-center justify-center">
<NuxtLink
to="/"
class="flex items-center gap-2 hover:opacity-80 transition-opacity">
<UIcon
name="i-heroicons-rocket-launch"
class="text-primary-500" />
class="flex items-center gap-2 hover:opacity-80 transition-opacity"
>
<h1
class="font-semibold text-black dark:text-white text-center">
class="text-black dark:text-white text-center text-2xl font-mono uppercase font-bold"
>
Urgent Tools
</h1>
</NuxtLink>
@ -25,49 +24,41 @@
<nav
class="mt-4 flex items-center justify-center gap-1"
role="navigation"
aria-label="Main navigation">
aria-label="Main navigation"
>
<NuxtLink
to="/coop-planner"
class="px-3 py-2 text-sm text-black dark:text-white hover:bg-neutral-100 dark:hover:bg-neutral-800 rounded-md transition-colors"
:class="{
'bg-neutral-100 dark:bg-neutral-800': isCoopSection,
}">
Co-Op in 6 Months
'bg-neutral-100 dark:bg-neutral-800': isCoopBuilderSection,
}"
>
Co-Op Builder
</NuxtLink>
<!-- Coach feature - hidden for now -->
<!-- <NuxtLink
to="/coach/skills-to-offers"
class="px-3 py-2 text-sm text-black dark:text-white hover:bg-neutral-100 dark:hover:bg-neutral-800 rounded-md transition-colors"
:class="{
'bg-neutral-100 dark:bg-neutral-800': $route.path.startsWith('/coach'),
}"
>
Coach
</NuxtLink> -->
<NuxtLink
to="/wizards"
class="px-3 py-2 text-sm text-black dark:text-white hover:bg-neutral-100 dark:hover:bg-neutral-800 rounded-md transition-colors"
:class="{
'bg-neutral-100 dark:bg-neutral-800':
$route.path === '/wizards',
}">
'bg-neutral-100 dark:bg-neutral-800': $route.path === '/wizards',
}"
>
Wizards
</NuxtLink>
<UButton
color="gray"
variant="ghost"
disabled
class="px-3 py-2 text-sm text-black dark:text-white rounded-md opacity-60 cursor-not-allowed">
Downloads
</UButton>
</nav>
<nav
v-if="isCoopSection"
class="mt-2 flex items-center justify-center gap-1"
role="navigation"
aria-label="Co-Op in 6 Months sub navigation">
<NuxtLink
v-for="item in coopMenu[0]"
:key="item.to"
:to="item.to"
class="px-3 py-2 text-sm text-black dark:text-white hover:bg-neutral-100 dark:hover:bg-neutral-800 rounded-md transition-colors"
:class="{
'bg-neutral-100 dark:bg-neutral-800':
route.path === item.to,
}">
{{ item.label }}
</NuxtLink>
</nav>
<div class="py-8">
<CoopBuilderSubnav v-if="isCoopBuilderSection" />
<WizardSubnav v-if="isWizardSection" />
</div>
</header>
<NuxtPage />
</UContainer>
@ -82,17 +73,20 @@
</template>
<script setup lang="ts">
const coopMenu = [
[
{ label: "Dashboard", to: "/" },
{ label: "Revenue Mix", to: "/mix" },
{ label: "Budget", to: "/budget" },
{ label: "Scenarios", to: "/scenarios" },
{ label: "Cash", to: "/cash" },
{ label: "Glossary", to: "/glossary" },
],
];
const route = useRoute();
const isCoopSection = computed(() => route.path === "/coop-planner");
const isCoopBuilderSection = computed(
() =>
route.path === "/coop-planner" ||
route.path === "/coop-builder" ||
route.path === "/" ||
route.path === "/mix" ||
route.path === "/budget" ||
route.path === "/scenarios" ||
route.path === "/cash" ||
route.path === "/glossary"
);
const isWizardSection = computed(
() => route.path === "/wizards" || route.path.startsWith("/templates/")
);
</script>