code-corps / code-corps/code-corps-ember

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

未關閉
#1,122 1 則留言 0 個 reaction 已指派 0 人 在 GitHub 檢視
Difficulty: Medium
主要語言
JavaScript
星號
120
分支
75
PR 合併指標
30 天內沒有已合併 PR

描述

# 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 `joinProject`action. 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](http://emberjs.com/api/classes/Ember.Route.html#method_renderTemplate) to achieve this behavior

貢獻指南

開啟貢獻指南

研究方向

檢視列出的 project.hbs 與 project/{index,settings,tasks,donate,thank-you}.hbs 結構,著重於重複的 layout 以及 project-details 元件的 joinProject action。閱讀 Ember 的 renderTemplate hook 文件,並比較 issue 中的三種 routing 選項。完成的定義是選擇並記錄一種能避免重複 layout 程式碼,並為該 action 明確指定負責人的 route/layout 結構。

由索引模型根據 Issue 內容生成。

評估

技術堆疊
javascript
領域
frontend
Issue 類型
重構
難度
5/5
預估耗時
一週以上
活躍度
停滯
描述清晰度
需要釐清
新手友好度
20/100

把新 issue 寄到你的電子郵件信箱

精選適合新手參與的 GitHub issue 摘要。