Fix the Header component when created with the --template file-router template.

[ga1az]

Which project does this relate to?

Create Tanstack App

Describe the bug

When creating a new project with the template npx create-tsrouter-app@latest my-app --template file-router, recommended by tanstack at: quick-start

it creates a component called Header.tsx which comes with two icons that are not used ChevronDown, ChevronRight and a useState that is also not used

const [groupedExpanded, setGroupedExpanded] = useState<
    Record<string, boolean>
  >({})

Therefore, the linter flags it with a warning. Furthermore, the lucide-react library is not in package.json, which causes an error when running the project.

[vite] Internal server error: Failed to resolve import "lucide-react" from "src/components/Header.tsx". Does the file exist?

Your Example Website or App

https://stackblitz.com/~/github.com/ga1az/tanstack-file-router-error

Steps to Reproduce the Bug or Issue

1. npx create-tsrouter-app@latest my-app --template file-router
2. npm run dev

Expected behavior

It is expected that the project can be executed and comes with the necessary dependencies in package.json.

Screenshots or Videos

No response

Platform

• OS: [e.g. macOS, Windows, Linux]
• Browser: [e.g. Chrome, Safari, Firefox]
• Version: [e.g. 91.1]

Additional context

No response