Discussion: Reconsider the route/template structure for donate and thank-you

Open
#1,122 1 comment 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Assessment

Difficulty
5/5
Estimated time
Over a week
Newbie friendliness
20/100
Issue type
Refactor
Clarity
Needs clarification
Activity status
Stale
Tech stack
javascript
Domain
frontend

Research direction

Review the listed project.hbs and project/{index,settings,tasks,donate,thank-you}.hbs structure, focusing on the duplicated layout and the project-details component's joinProject action. Read Ember's renderTemplate hook documentation and compare the three routing options in the issue. Done means selecting and documenting a route/layout structure that avoids duplicated layout code and gives the action a clear owner.

Written by the indexing model from the issue text.

Description

Difficulty: Medium

Problem

Right now, our route structure is as follows:

project.hbs
project/
  index.hbs
  settings.hbs
  tasks.hbs
  donate.hbs
  thank-you.

project.hbs is just an {{outlet}}. index, settings and tasks share most of the same layout, but the code needs to be duplicated because donate and thank-you have a completely different layout.

This is somewhat confusing by itself. An additional, unfortunate side-effect is that the index, settings and tasks share the same project-details component, which internally, defines a joinProjectaction. This action can't be handled at route level, because it's used in 3 different routes. Instead, right now, it's handled by the component internally.

I'm really not sure what the best architecture here is, but it doesn't feel right. I think project.hbs should have the outlet for the varying content, but it should also have the default project layout components such as the header, etc. The subroutes should either share the layout or not be subroutes, or we should find a third way to render it.

That means that our options are either:

  • donate and thank-you should not be part of the project route structure.
  • donate and thank-you can be part of the project route structure, but should then share the project layout
  • we should add a named outlet to our application route. "Layoutless" routes such as donate and thank-you should render directly into this named outlet. This gives us an explicit way to specify a route as layoutless. We could use the route's renderTemplate hook to achieve this behavior
Dominant language
JavaScript
Stars
120
Forks
75
No merged PRs in 30d

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from code-corps/code-corps-ember

All issues in code-corps/code-corps-ember

Similar issues

More JavaScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.