Enhance: Application 部分の重複する記述を関数として統一 #697

sahara2006 · 2026-01-06T15:17:35Z

#474 送信などのロジックをusePartitionInformation.tsに分離

sahara2006 · 2026-01-06T15:24:02Z

Copilot · 2026-01-06T15:24:13Z

@sahara2006 I've opened a new pull request, #698, to work on those changes. Once the pull request is ready, I'll request review from you.

Copilot

Pull request overview

This PR refactors duplicate logic in the Application section by extracting common patterns into reusable composables. The main changes follow the established pattern from the partition feature, creating a unified approach for managing edit modes and update operations.

Key changes:

Created useApplicationInformation composable to centralize application editing logic
Renamed EditMode to PartitionEditMode for clarity and consistency
Refactored ApplicationContent.vue to use the new composable pattern with props and events

Reviewed changes

Copilot reviewed 8 out of 8 changed files in this pull request and generated 10 comments.

Show a summary per file

File	Description
`src/features/application/store.ts`	Adds helper function `createDefaultApplicationSeed()` and an incomplete store definition that needs to be removed
`src/components/partitionDetail/composables/usePartitionInformation.ts`	Renames `EditMode` type to `PartitionEditMode` for better clarity, but missing import for `usePartitionStore`
`src/components/partitionDetail/PartitionName.vue`	Updates type import to use renamed `PartitionEditMode`
`src/components/partitionDetail/PartitionGroup.vue`	Updates type import to use renamed `PartitionEditMode`
`src/components/partitionDetail/PartitionBudget.vue`	Updates type import to use renamed `PartitionEditMode`
`src/components/applicationDetail/composables/useApplicationInformation.ts`	New composable following the partition pattern, but contains incorrect error message referencing "partition" instead of "application"
`src/components/applicationDetail/ApplicationLogs.vue`	Integrates the new `useApplicationInformation` composable
`src/components/applicationDetail/ApplicationContent.vue`	Major refactor to use props/events pattern, but has duplicate imports and missing destructured functions from store

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

src/components/applicationDetail/composables/useApplicationInformation.ts

src/components/applicationDetail/ApplicationContent.vue

src/components/partitionDetail/composables/usePartitionInformation.ts

src/features/application/store.ts

src/components/applicationDetail/ApplicationContent.vue

Copilot

Pull request overview

Copilot reviewed 8 out of 8 changed files in this pull request and generated 3 comments.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

src/components/applicationDetail/ApplicationLogs.vue

src/components/applicationDetail/composables/useApplicationInformation.ts

src/features/application/store.ts

Copilot

Pull request overview

Copilot reviewed 8 out of 8 changed files in this pull request and generated 7 comments.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

src/features/application/store.ts

src/components/applicationDetail/composables/useApplicationInformation.ts

src/features/application/store.ts

src/components/applicationDetail/composables/useApplicationInformation.ts

src/components/applicationDetail/ApplicationContent.vue

Copilot · 2026-01-07T10:33:21Z

src/components/applicationDetail/ApplicationLogs.vue

+        <ApplicationContent
+          :is-edit-mode="editMode === 'content'"
+          @change-edit-mode="changeEditMode($event)"
+          @finish-editing="finishEditing" />


ApplicationContent no longer accepts the application prop from its parent, instead reading currentApplication from the store. However, the parent component (ApplicationLogs) still requires an application prop and validates it. This creates a potential inconsistency where the parent has a valid application but the child might render with a different (or null) application from the store. Consider either: 1) passing the application prop to ApplicationContent to ensure consistency, or 2) having ApplicationLogs also read from the store if the intent is to make the store the single source of truth.

重複する記述を削除 Co-authored-by: Copilot <[email protected]>

Copilot

Copilot encountered an error and was unable to review this pull request. You can try again by re-requesting a review.

Copilot

Pull request overview

Copilot reviewed 8 out of 8 changed files in this pull request and generated 3 comments.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

src/features/application/store.ts

src/components/applicationDetail/composables/useApplicationInformation.ts

Copilot · 2026-01-08T04:04:38Z

src/components/applicationDetail/ApplicationContent.vue

+  (e: 'changeEditMode', value: ApplicationEditMode): void
+  (e: 'finishEditing'): void
+}>()
+const { currentApplication: application, editedValue } = useApplicationStore()


The component now sources application from the store (line 26) rather than from props, but the parent component ApplicationLogs.vue still passes application as a prop and uses it to compute logs. This creates an inconsistency in the data flow pattern. Either both components should use the store, or both should use props. The current mixed approach could lead to confusion about the source of truth for the application data.

sahara2006 · 2026-01-13T09:06:17Z

src/components/applicationDetail/composables/useApplicationInformation.ts

+
+  const changeEditMode = (mode: ApplicationEditMode) => {
+    if (mode !== '') {
+      editMode.value = mode


後で切り出す

sahara2006 · 2026-01-13T09:37:06Z

src/components/applicationDetail/ApplicationContent.vue

-  }
-  isEditMode.value = false
-}
+const hasAuthority = computed(() => {


auth 切り出し

sahara2006

handleUpdateTargetの検討

Copilot

Pull request overview

Copilot reviewed 14 out of 14 changed files in this pull request and generated 9 comments.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Copilot · 2026-01-13T11:11:57Z

src/components/applicationDetail/ApplicationHeader.vue

+const { editMode, isSending, changeEditMode, finishEditing } =
+  useApplicationInformation()


Multiple components (ApplicationLogs, ApplicationHeader, and ApplicationSidebar) are each creating their own instance of useApplicationInformation(), which means each will have its own separate editMode and isSending state. This causes state synchronization issues where editing in one component won't properly update the edit mode in others. The composable should either be shared at a parent level or the state should be moved to the store.

Copilot · 2026-01-13T11:11:57Z

src/components/applicationDetail/ApplicationSidebar.vue

+const { editMode, isSending, changeEditMode, finishEditing } =
+  useApplicationInformation()


Multiple components (ApplicationLogs, ApplicationHeader, and ApplicationSidebar) are each creating their own instance of useApplicationInformation(), which means each will have its own separate editMode and isSending state. This causes state synchronization issues where editing in one component won't properly update the edit mode in others. The composable should either be shared at a parent level or the state should be moved to the store.

Copilot · 2026-01-13T11:11:57Z

src/components/applicationDetail/ApplicationTargets.vue

  try {
-    await editApplication(props.application.id, {
-      ...props.application,
-      partition: props.application.partition.id,
-      targets: editedTargets.value,
-    })
-    toast.success('更新しました')
+    editedValue.value.targets = editedTargets.value
+    emit('finishEditing')
  } catch {
    toast.error('更新に失敗しました')
  }
-  isEditMode.value = false
 }


The try-catch block here is misleading. The code inside try block (lines 52-53) is a simple assignment that cannot throw an error, making the catch block unreachable. If error handling is needed, it should be around the finishEditing call that will be made by the parent component.

Copilot · 2026-01-13T11:11:57Z

src/components/applicationDetail/composables/useApplicationInformation.ts

+    if (mode !== '') {
+      editMode.value = mode
+      if (currentApplication.value) {
+        editedValue.value = {
+          createdBy: currentApplication.value.createdBy,
+          title: currentApplication.value.title,
+          content: currentApplication.value.content,
+          tags: [...currentApplication.value.tags],
+          partition: currentApplication.value.partition.id,
+          targets: [...currentApplication.value.targets],
+        }
+      }
+    } else {
+      editMode.value = ''
+      if (currentApplication.value) {
+        editedValue.value = {
+          createdBy: currentApplication.value.createdBy,
+          title: currentApplication.value.title,
+          content: currentApplication.value.content,
+          tags: [...currentApplication.value.tags],
+          partition: currentApplication.value.partition.id,
+          targets: [...currentApplication.value.targets],
+        }
+      }


The logic in changeEditMode duplicates the same editedValue assignment in both branches (when mode is empty string and when it's not). This duplication is unnecessary since both branches reset editedValue to the current application values. Consider extracting this logic to avoid duplication.

Suggested change

if (mode !== '') {

editMode.value = mode

if (currentApplication.value) {

editedValue.value = {

createdBy: currentApplication.value.createdBy,

title: currentApplication.value.title,

content: currentApplication.value.content,

tags: [...currentApplication.value.tags],

partition: currentApplication.value.partition.id,

targets: [...currentApplication.value.targets],

}

}

} else {

editMode.value = ''

if (currentApplication.value) {

editedValue.value = {

createdBy: currentApplication.value.createdBy,

title: currentApplication.value.title,

content: currentApplication.value.content,

tags: [...currentApplication.value.tags],

partition: currentApplication.value.partition.id,

targets: [...currentApplication.value.targets],

}

}

editMode.value = mode

if (currentApplication.value) {

editedValue.value = {

createdBy: currentApplication.value.createdBy,

title: currentApplication.value.title,

content: currentApplication.value.content,

tags: [...currentApplication.value.tags],

partition: currentApplication.value.partition.id,

targets: [...currentApplication.value.targets],

}

Copilot · 2026-01-13T11:11:58Z

src/components/applicationDetail/ApplicationTargets.vue

 const editedTargets = ref<ApplicationTargetDetail[]>(
-  props.application.targets.map(t => ({ ...t }))
+  application.value?.targets.map(t => ({ ...t })) ?? []
 )


The editedTargets ref is initialized once when the component is created, but it's not synchronized with the editedValue from the store or updated when edit mode is toggled. When the user clicks edit, changeEditMode updates editedValue.targets in the store, but editedTargets in this component remains with the initial values. This creates a state synchronization issue where changes made in editedTargets won't be reflected in editedValue until handleUpdateTargets is called, and vice versa.

Copilot · 2026-01-13T11:11:58Z

src/components/applicationDetail/ApplicationTargets.vue

-      targets: editedTargets.value,
-    })
-    toast.success('更新しました')
+    editedValue.value.targets = editedTargets.value


There's a type mismatch between ApplicationTargetDetail (which includes id, paidAt, and createdAt fields) being assigned to editedValue.value.targets which expects ApplicationTarget[] (only amount and target fields). This will cause the API to receive unexpected fields, potentially causing issues on the backend.

Suggested change

editedValue.value.targets = editedTargets.value

editedValue.value.targets = editedTargets.value.map(({ amount, target }) => ({

amount,

target

}))

Copilot · 2026-01-13T11:11:58Z

src/components/applicationDetail/composables/useApplicationInformation.ts

+          content: currentApplication.value.content,
+          tags: [...currentApplication.value.tags],
+          partition: currentApplication.value.partition.id,
+          targets: [...currentApplication.value.targets],


Assigning currentApplication.value.targets (ApplicationTargetDetail[]) to editedValue.value.targets (ApplicationTarget[]) creates a type mismatch. ApplicationTargetDetail includes additional fields (id, paidAt, createdAt) that should not be in ApplicationTarget. The targets should be mapped to extract only the amount and target fields needed for ApplicationSeed.

Copilot · 2026-01-13T11:11:59Z

src/components/applicationDetail/ApplicationLogs.vue

+const { isSending, editMode, changeEditMode, finishEditing } =
+  useApplicationInformation()


Multiple components (ApplicationLogs, ApplicationHeader, and ApplicationSidebar) are each creating their own instance of useApplicationInformation(), which means each will have its own separate editMode and isSending state. This causes state synchronization issues where editing in one component won't properly update the edit mode in others. The composable should either be shared at a parent level or the state should be moved to the store.

SAH123-git added 6 commits November 29, 2025 18:00

更新部分を切り出し

947298e

EditModeに語句追加

4c810fe

format

740b0bd

変更管理を一般化

a2d89e8

コピーミスを修正

ad9dd4e

contentに対して関数の切り出しを実行

230a1dd

sahara2006 self-assigned this Jan 6, 2026

Merge branch 'main' into enhance/components-structure

b337834

Copilot AI mentioned this pull request Jan 6, 2026

No actionable changes required - comment was incomplete #698

Closed

sahara2006 requested a review from Copilot January 6, 2026 15:30

Copilot started reviewing on behalf of sahara2006 January 6, 2026 15:31 View session

Copilot AI reviewed Jan 6, 2026

View reviewed changes

SAH123-git added 5 commits January 7, 2026 00:45

format

8494fda

古い形式のdefineStoreを削除

bbbfe57

例外処理を追加

3df7d5c

文言修正

7df6ad7

import修正

ce1e1de

sahara2006 requested a review from Copilot January 6, 2026 16:12

Copilot started reviewing on behalf of sahara2006 January 6, 2026 16:12 View session

Copilot AI reviewed Jan 6, 2026

View reviewed changes

src/components/applicationDetail/ApplicationLogs.vue Outdated Show resolved Hide resolved

src/components/applicationDetail/composables/useApplicationInformation.ts Show resolved Hide resolved

src/features/application/store.ts Show resolved Hide resolved

SAH123-git added 7 commits January 7, 2026 18:05

必要のないプロパティを削除

207a908

v-ifを肯定形に

b86e56b

編集終了時editModeがcurrentApplicationに追従するように

a91103f

currentApplication の fetchと同時に editedValueも更新するように

73d94a1

typeに配慮

a8edd54

返り値としてvoidを返すことを防ぐ

9044561

型を明確化

f6c8e1c

sahara2006 requested a review from Copilot January 7, 2026 10:29

Copilot started reviewing on behalf of sahara2006 January 7, 2026 10:29 View session

Copilot AI reviewed Jan 7, 2026

View reviewed changes

sahara2006 and others added 2 commits January 7, 2026 22:21

Update src/features/application/store.ts

7e3d840

重複する記述を削除 Co-authored-by: Copilot <[email protected]>

issendingを実装

9b3c7e7

sahara2006 requested a review from Copilot January 7, 2026 14:21

Copilot started reviewing on behalf of sahara2006 January 7, 2026 14:22 View session

Copilot AI reviewed Jan 7, 2026

View reviewed changes

sahara2006 requested a review from Copilot January 8, 2026 04:01

Copilot started reviewing on behalf of sahara2006 January 8, 2026 04:01 View session

Copilot AI reviewed Jan 8, 2026

View reviewed changes

fetch時の初期化をなくすように

be8fa68

sahara2006 commented Jan 13, 2026

View reviewed changes

リロード時に編集画面に情報が読み込まれるように

1d0b085

sahara2006 commented Jan 13, 2026

View reviewed changes

SAH123-git added 2 commits January 13, 2026 18:45

useApplicationをTargetsに適用

e7a4cbc

Tagsに適用

72780c4

sahara2006 commented Jan 13, 2026

View reviewed changes

SAH123-git added 2 commits January 13, 2026 19:48

Partitonにも適用

bd08e43

Titleにも適用

b00d8d3

sahara2006 requested a review from Copilot January 13, 2026 11:05

Copilot started reviewing on behalf of sahara2006 January 13, 2026 11:06 View session

Copilot AI reviewed Jan 13, 2026

View reviewed changes

		const { editMode, isSending, changeEditMode, finishEditing } =
		useApplicationInformation()

		const { isSending, editMode, changeEditMode, finishEditing } =
		useApplicationInformation()

Enhance: Application 部分の重複する記述を関数として統一 #697

Are you sure you want to change the base?

Enhance: Application 部分の重複する記述を関数として統一 #697

Uh oh!

Conversation

sahara2006 commented Jan 6, 2026

Uh oh!

sahara2006 commented Jan 6, 2026

Uh oh!

Copilot AI commented Jan 6, 2026

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Copilot AI Jan 7, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

Uh oh!

Uh oh!

Copilot AI Jan 8, 2026

Choose a reason for hiding this comment

Uh oh!

sahara2006 Jan 13, 2026

Choose a reason for hiding this comment

Uh oh!

sahara2006 Jan 13, 2026

Choose a reason for hiding this comment

Uh oh!

sahara2006 left a comment

Choose a reason for hiding this comment

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Uh oh!

Copilot AI Jan 13, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 13, 2026

Choose a reason for hiding this comment

Uh oh!

Copilot AI Jan 13, 2026

Choose a reason for hiding this comment

Uh oh!