router-linkのto属性でオブジェクトの使用・HyperText型のurl(string型)をpath(RouteLocationNamedRaw)に #336

dye8128 · 2024-07-17T08:26:54Z

User description

close #314
#334 の続きです、対応完了しました

PR Type

enhancement, bug fix

Description

path プロパティの型を string から RouteLocationNamedRaw に変更
header-texts の url プロパティを path に変更し、オブジェクト形式に変更
useParam 関数で undefined の場合にデフォルト値を設定
isActive 計算プロパティのロジックを修正

Changes walkthrough 📝

Relevant files

Enhancement

22 files

PageInfoPanel.vue `path` プロパティの型変更 src/components/Index/PageInfoPanel.vue `path` プロパティの型を `string` から `RouteLocationNamedRaw` に変更	+2/-1
PageInfoPanels.vue `path` プロパティの値をオブジェクト形式に変更 src/components/Index/PageInfoPanels.vue `path` プロパティの値をオブジェクト形式に変更	+1/-1
ContentHeader.vue `url` プロパティを `path` に変更 src/components/Layout/ContentHeader.vue `url` プロパティを `path` に変更し、型を `RouteLocationNamedRaw` に変更	+3/-2
NavigationLinksItem.vue `path` プロパティの型変更と `isActive` ロジック修正 src/components/NavigationBar/NavigationLinksItem.vue `path` プロパティの型を `string` から `RouteLocationNamedRaw` に変更 `isActive` 計算プロパティのロジックを修正	+3/-7
ProjectItem.vue `router-link` の `to` 属性をオブジェクト形式に変更 src/components/Projects/ProjectItem.vue `router-link` の `to` 属性をオブジェクト形式に変更	+4/-1
Contest.vue `header-texts` の `url` プロパティを `path` に変更 src/pages/Contest.vue `header-texts` の `url` プロパティを `path` に変更し、オブジェクト形式に変更	+5/-2
ContestEdit.vue `header-texts` の `url` プロパティを `path` に変更 src/pages/ContestEdit.vue `header-texts` の `url` プロパティを `path` に変更し、オブジェクト形式に変更	+9/-3
ContestNew.vue `header-texts` の `url` プロパティを `path` に変更 src/pages/ContestNew.vue `header-texts` の `url` プロパティを `path` に変更し、オブジェクト形式に変更	+2/-2
ContestTeamEdit.vue `header-texts` の `url` プロパティを `path` に変更 src/pages/ContestTeamEdit.vue `header-texts` の `url` プロパティを `path` に変更し、オブジェクト形式に変更	+14/-5
ContestTeamNew.vue `header-texts` の `url` プロパティを `path` に変更 src/pages/ContestTeamNew.vue `header-texts` の `url` プロパティを `path` に変更し、オブジェクト形式に変更	+10/-4
Contests.vue `header-texts` の `url` プロパティを `path` に変更 src/pages/Contests.vue `header-texts` の `url` プロパティを `path` に変更し、オブジェクト形式に変更	+1/-1
Event.vue `header-texts` の `url` プロパティを `path` に変更 src/pages/Event.vue `header-texts` の `url` プロパティを `path` に変更し、オブジェクト形式に変更	+5/-2
Events.vue `header-texts` の `url` プロパティを `path` に変更 src/pages/Events.vue `header-texts` の `url` プロパティを `path` に変更し、オブジェクト形式に変更	+1/-1
Index.vue `header-texts` の `url` プロパティを `path` に変更 src/pages/Index.vue `header-texts` の `url` プロパティを `path` に変更し、オブジェクト形式に変更	+1/-1
Project.vue `header-texts` の `url` プロパティを `path` に変更 src/pages/Project.vue `header-texts` の `url` プロパティを `path` に変更し、オブジェクト形式に変更	+9/-3
ProjectNew.vue `header-texts` の `url` プロパティを `path` に変更 src/pages/ProjectNew.vue `header-texts` の `url` プロパティを `path` に変更し、オブジェクト形式に変更	+2/-2
Projects.vue `header-texts` の `url` プロパティを `path` に変更 src/pages/Projects.vue `header-texts` の `url` プロパティを `path` に変更し、オブジェクト形式に変更	+1/-1
User.vue `header-texts` の `url` プロパティを `path` に変更 src/pages/User.vue `header-texts` の `url` プロパティを `path` に変更し、オブジェクト形式に変更	+1/-1
UserAccountEdit.vue `header-texts` の `url` プロパティを `path` に変更 src/pages/UserAccountEdit.vue `header-texts` の `url` プロパティを `path` に変更し、オブジェクト形式に変更	+3/-3
UserAccountNew.vue `header-texts` の `url` プロパティを `path` に変更 src/pages/UserAccountNew.vue `header-texts` の `url` プロパティを `path` に変更し、オブジェクト形式に変更	+3/-3
UserAccounts.vue `header-texts` の `url` プロパティを `path` に変更 src/pages/UserAccounts.vue `header-texts` の `url` プロパティを `path` に変更し、オブジェクト形式に変更	+2/-2
routeInfo.ts `path` プロパティの型変更とデフォルト値修正 src/lib/routeInfo.ts `path` プロパティの型を `string` から `RouteLocationNamedRaw` に変更デフォルト値の `path` を空オブジェクトに変更	+7/-6

Bug fix

1 files

param.ts `useParam` 関数のデフォルト値設定 src/lib/param.ts `useParam` 関数で `undefined` の場合にデフォルト値を設定	+1/-1

💡 PR-Agent usage:
Comment /help on the PR to get a list of all available PR-Agent tools and their descriptions

UserAccountEditの一か所だけ保留

UserAccountEditのリンク訂正 routeinfoの型変更

github-actions · 2024-07-17T08:30:26Z

PR Reviewer Guide 🔍

⏱️ Estimated effort to review: 3 🔵🔵🔵⚪⚪
🧪 No relevant tests
🔒 No security concerns identified
⚡ Key issues to review Default Value Handling `useParam`関数で`undefined`を文字列'undefined'に変換して返すのは不適切かもしれません。通常、`undefined`や`null`は明示的に扱うべきです。デフォルト値として空文字列やnullを返す方が適切かもしれません。

github-actions · 2024-07-17T08:31:33Z

PR Code Suggestions ✨

Category	Suggestion	Score
Possible bug	`isActive`の計算プロパティを修正して、新しい`props.path`オブジェクトに対応させる。 `isActive`の計算プロパティが、`props.path`の変更に対応していません。`props.path`がオブジェクトに変更されたため、`currentRoute.name`と比較するのではなく、`currentRoute.name`と`props.path.name`を比較する必要があります。 src/components/NavigationBar/NavigationLinksItem.vue [19] -return currentRoute.name === props.name +return currentRoute.name === props.path.name Suggestion importance[1-10]: 9 Why: The suggestion correctly identifies a potential bug where the `isActive` computed property should compare `currentRoute.name` with `props.path.name` instead of `props.name`. This change is crucial for the correct functionality of the component.	9
Possible issue	`useParam`関数の戻り値を修正して、`undefined`を文字列ではなくそのまま返すようにする。 `useParam`関数で`toStringIfArray`関数の戻り値が`undefined`の場合に`'undefined'`文字列を返すようにしていますが、これは意図した動作ではない可能性があります。`undefined`をそのまま返すべきです。 src/lib/param.ts [13] -return computed(() => toStringIfArray(route.params[paramName]) ?? 'undefined') +return computed(() => toStringIfArray(route.params[paramName])) Suggestion importance[1-10]: 8 Why: The suggestion addresses a potential issue where returning the string 'undefined' could lead to unexpected behavior. Returning `undefined` directly is more appropriate and aligns with typical JavaScript practices.	8
Enhancement	`Props`インターフェースの`path`プロパティの型をより汎用的なものに変更する。 `Props`インターフェースの`path`プロパティの型を`RouteLocationNamedRaw`から`RouteLocationRaw`に変更することを検討してください。これにより、名前付きルートだけでなく、パスベースのルートも許可されるようになります。 src/components/Index/PageInfoPanel.vue [23] -path: RouteLocationNamedRaw +path: RouteLocationRaw Suggestion importance[1-10]: 7 Why: Changing the type from `RouteLocationNamedRaw` to `RouteLocationRaw` would make the `path` property more flexible, allowing for both named and path-based routes. This is a good enhancement but not critical.	7
Enhancement	`HeaderText`型の`path`プロパティをオプショナルにして柔軟性を向上させる。 `HeaderText`型の`path`プロパティをオプショナルにすることを検討してください。すべてのヘッダーテキストがルートに関連付けられているわけではないため、この変更により柔軟性が向上します。 src/components/Layout/ContentHeader.vue [7] -path: RouteLocationNamedRaw +path?: RouteLocationNamedRaw Suggestion importance[1-10]: 6 Why: Making the `path` property optional in the `HeaderText` type increases flexibility, allowing for header texts that are not necessarily linked to a route. This is a useful enhancement but not essential.	6

mehm8128 · 2024-07-26T07:18:00Z

src/components/NavigationBar/NavigationLinksItem.vue

-    currentRoute.path === props.path ||
-    currentRoute.path.startsWith(`${props.path}/`)
-  )
+  return currentRoute.name === props.name


ロジックが変わっちゃってそうです

/にアクセスしてるときにTopリンクがactiveにならなくなってしまってそうです

コンテストの詳細など、コンテスト一覧より下のページを見ているときにContestリンクがactiveにならなくなってしまってそうです(プロフィールやプロジェクトも同様)

mehm8128 · 2024-08-16T16:04:53Z

src/components/NavigationBar/NavigationLinksItem.vue

+const findPath = (name: string): string => {
+  for (const route of routes) {
+    if (route.name === name) {
+      return route.path
+    }
+  }
+  return 'Undefined'
+}
+
 const isActive = computed(() => {
-  if (props.path === '/') return currentRoute.path === props.path
+  const path = findPath(String(props.path.name))


こんな感じにfindPathがもっと簡潔にできそうです

const isActive = computed(() => { const path = routes.find(route => route.name === props.path.name)?.path if (path === undefined) { return false } return ( ...

mehm8128 · 2024-08-17T14:28:02Z

src/components/NavigationBar/NavigationLinksItem.vue

-    currentRoute.path === props.path ||
-    currentRoute.path.startsWith(`${props.path}/`)
+    currentRoute.name === props.path.name ||
+    currentRoute.path.startsWith(`${path}/`)


これでも多分動きはするのですが、pathがundefinedだったときにstartsWith('undefined/')になっちゃってあんまりきれいじゃないので僕が書いたようにundefinedのときは明示的にfalseを返すようにした方がよさそうです(テンプレートリテラル内にstring型以外を入れられないようにするeslintのルールも確かあったはずです)

mehm8128

↑以外は問題なさそうなので、直したらマージしちゃってOKです

dye8128 · 2024-08-19T02:01:30Z

確認抜けでした、ごめんなさい...!
訂正＆マージしました！

dye8128 added 3 commits July 11, 2024 18:55

HyperTextのurlをオブジェクトに変更

e9d5ea4

UserAccountEditの一か所だけ保留

useParam()のundefined対応

a99e279

UserAccountEditのリンク訂正 routeinfoの型変更

getMessageのDefault値の設定

1a66443

dye8128 requested a review from Pugma July 17, 2024 08:27

github-actions bot added the Review effort [1-5]: 3 label Jul 17, 2024

mehm8128 reviewed Jul 26, 2024

View reviewed changes

isActiveの訂正

fcb237d

mehm8128 reviewed Aug 16, 2024

View reviewed changes

findPathの修正

dd5b671

mehm8128 reviewed Aug 17, 2024

View reviewed changes

mehm8128 approved these changes Aug 17, 2024

View reviewed changes

undefinedに対応

b65ef2d

dye8128 merged commit 017c5c5 into main Aug 19, 2024
9 checks passed

dye8128 deleted the fix/url-type branch August 19, 2024 02:01

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

router-linkのto属性でオブジェクトの使用・HyperText型のurl(string型)をpath(RouteLocationNamedRaw)に #336

router-linkのto属性でオブジェクトの使用・HyperText型のurl(string型)をpath(RouteLocationNamedRaw)に #336

dye8128 commented Jul 17, 2024 •

edited by github-actions bot

Loading

github-actions bot commented Jul 17, 2024

github-actions bot commented Jul 17, 2024

mehm8128 Jul 26, 2024

mehm8128 Aug 16, 2024

mehm8128 Aug 17, 2024

mehm8128 left a comment

dye8128 commented Aug 19, 2024

router-linkのto属性でオブジェクトの使用・HyperText型のurl(string型)をpath(RouteLocationNamedRaw)に #336

router-linkのto属性でオブジェクトの使用・HyperText型のurl(string型)をpath(RouteLocationNamedRaw)に #336

Conversation

dye8128 commented Jul 17, 2024 • edited by github-actions bot Loading

User description

PR Type

Description

Changes walkthrough 📝

github-actions bot commented Jul 17, 2024

PR Reviewer Guide 🔍

github-actions bot commented Jul 17, 2024

PR Code Suggestions ✨

mehm8128 Jul 26, 2024

Choose a reason for hiding this comment

mehm8128 Aug 16, 2024

Choose a reason for hiding this comment

mehm8128 Aug 17, 2024

Choose a reason for hiding this comment

mehm8128 left a comment

Choose a reason for hiding this comment

dye8128 commented Aug 19, 2024

dye8128 commented Jul 17, 2024 •

edited by github-actions bot

Loading