FlowFuse / FlowFuse/flowfuse

Replace static path composition with named routes in Vue Router navigation

Open
#8,094 0 comments 0 reactions 1 assignee Claimed by @cstns View on GitHub
area:frontend epic type:enhancement
Dominant language
JavaScript
Stars
400
Forks
89
Avg merge
1d 20h
Merged PRs (30d)
149

Description

## What

Throughout the frontend we have ~37 places where Vue Router navigation uses hardcoded path strings instead of named routes. This includes `router.push('/')`, `router.push({ path: '/admin/users' })`, template literal composition like `` `/team/${slug}/billing` ``, relative paths like `{ path: 'general' }`, and string-based redirects in route definitions.

All of these should use named routes with params instead, e.g. `router.push({ name: 'home' })` or `{ name: 'team-billing', params: { team_slug: slug } }`.

## Why

Static path composition is fragile. If a route path ever changes, every hardcoded reference breaks silently. Named routes decouple navigation from URL structure, which is the whole point of having route names. We're already standardizing route names in #8084, so this is the natural follow-up.

## Prerequisites

- #8084 (Standardize Vue Router route names to kebab-case) should be completed first, since we'll be referencing the new kebab-case names.

## How

Broken down into sub-issues ordered by blast radius (smallest first). Each sub-issue is a self-contained PR.

## Sub-issues

- [ ] #8095 — Replace string-based redirects in route definitions with named routes
- [ ] #8096 — Replace root path and absolute path navigation with named routes
- [ ] #8097 — Replace relative path navigation in settings pages with named routes
- [ ] #8098 — Replace template literal / string concat path composition with named routes

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.