fix(dependencies): attach the feature's current value to the change request

The API refuses a change request with no changes and cannot hold a
dependency change alone until #8449, so the change request carries the
feature's value unchanged. This also ties it to the feature, so its page
shows it and can be published.

Also truncates a long prerequisite name at its end only.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>

Author: talissoncosta

frontend/common/services/useFeatureState.ts

@@ -109,5 +109,6 @@ export async function updateFeatureState(
 export const {
   useGetAllEnvironmentFeatureStatesQuery,
   useGetFeatureStatesQuery,
+  useLazyGetFeatureStatesQuery,
   useUpdateFeatureStateMutation,
 } = featureStateService

frontend/common/types/requests.ts

@@ -1,4 +1,6 @@
 import {
+  ChangeSet,
+  MultivariateFeatureStateValue,
   Account,
   ExternalResource,
   FeatureState,
@@ -893,6 +895,18 @@ export type Req = {
     description: string
     live_from?: string
     approvals: Approval[]
+    change_sets?: (Omit<ChangeSet, 'feature_states_to_update'> & {
+      // New states, so no ids, theirs or their variations'.
+      feature_states_to_update: (Omit<
+        FeatureState,
+        'id' | 'multivariate_feature_state_values'
+      > & {
+        multivariate_feature_state_values?: Omit<
+          MultivariateFeatureStateValue,
+          'id'
+        >[]
+      })[]
+    })[]
   }
   deleteChangeRequest: { id: number }
   getSamlConfiguration: { name: string }

frontend/web/components/modals/create-feature/tabs/FeatureDependenciesTab/PrerequisitesTable/PrerequisitesTable.scss

@@ -15,9 +15,15 @@
   background: var(--color-surface-muted);
 }
 
-// A button only shrinks below its text with a min width.
+// A button only shrinks below its text with a min width, and centres its
+// text, which would clip a long name at both ends.
 .prerequisite-name > .btn {
   min-width: 0;
+  justify-content: flex-start;
+}
+
+.prerequisite-name__text {
+  min-width: 0;
 }
 
 // Held for a change request: still listed, but on its way out. On the inner

frontend/web/components/modals/create-feature/tabs/FeatureDependenciesTab/PrerequisitesTable/PrerequisitesTable.tsx

@@ -127,13 +127,12 @@ const PrerequisitesTable: FC<PrerequisitesTableProps> = ({
             <div className='prerequisite-name d-flex align-items-center gap-2'>
               <Button
                 theme='text'
-                className='text-truncate'
                 onClick={(e: MouseEvent) => {
                   e.stopPropagation()
                   onSelect(edge)
                 }}
               >
-                <span className='prerequisite-name__text'>
+                <span className='prerequisite-name__text text-truncate'>
                   {edge.prerequisite.name}
                 </span>
               </Button>

frontend/web/components/modals/create-feature/tabs/FeatureDependenciesTab/hooks/useStagedPrerequisites.tsx

@@ -13,7 +13,10 @@ import {
   useCreateFeatureDependencyMutation,
   useDeleteFeatureDependencyMutation,
 } from 'common/services/useFeatureDependency'
+import { useLazyGetFeatureStatesQuery } from 'common/services/useFeatureState'
+import { useProjectEnvironments } from 'common/hooks/useProjectEnvironments'
 import ChangeRequestModal from 'components/modals/ChangeRequestModal'
+import { unchangedChangeSet } from 'components/modals/create-feature/tabs/FeatureDependenciesTab/unchangedChangeSet'
 
 export type StagedChange = {
   action: 'add' | 'remove'
@@ -61,6 +64,8 @@ export const useStagedPrerequisites = ({
   const [deleteChangeRequest] = useDeleteChangeRequestMutation()
   const [createDependency] = useCreateFeatureDependencyMutation()
   const [deleteDependency] = useDeleteFeatureDependencyMutation()
+  const [getFeatureStates] = useLazyGetFeatureStatesQuery()
+  const { getEnvironmentIdFromKey } = useProjectEnvironments(projectId)
 
   const drop = (prerequisiteId: number) =>
     setStaged((prev) =>
@@ -117,8 +122,21 @@ export const useStagedPrerequisites = ({
     setError(null)
     let changeRequestId: number | undefined
     try {
+      const featureStates = await getFeatureStates({
+        environment: getEnvironmentIdFromKey(environmentId),
+        feature: projectFlag.id,
+      }).unwrap()
+      const changeSet = unchangedChangeSet(
+        projectFlag.id,
+        featureStates.results,
+        fields.live_from,
+      )
       changeRequestId = (
-        await createChangeRequest({ environmentId, ...fields }).unwrap()
+        await createChangeRequest({
+          environmentId,
+          ...fields,
+          change_sets: changeSet ? [changeSet] : undefined,
+        }).unwrap()
       ).id
       await stage(changeRequestId)
       setStaged([])

frontend/web/components/modals/create-feature/tabs/FeatureDependenciesTab/unchangedChangeSet.ts

@@ -0,0 +1,37 @@
+import { FeatureState } from 'common/types/responses'
+import { Req } from 'common/types/requests'
+
+type ChangeSetBody = NonNullable<
+  Req['createEnvironmentChangeRequest']['change_sets']
+>[number]
+
+// The API refuses a change request with no changes, and cannot hold a
+// dependency change on its own until #8449. Until then, the change request
+// carries the feature's current value unchanged, which also ties it to the
+// feature so its page shows it. Publishing it makes an identical version.
+export const unchangedChangeSet = (
+  featureId: number,
+  featureStates: FeatureState[],
+  liveFrom: string | undefined,
+): ChangeSetBody | undefined => {
+  const current = featureStates.find(
+    (state) => !state.feature_segment && !state.identity,
+  )
+  if (!current) return
+  const { id: _id, multivariate_feature_state_values, ...state } = current
+  return {
+    feature: featureId,
+    feature_states_to_create: [],
+    feature_states_to_update: [
+      {
+        ...state,
+        multivariate_feature_state_values:
+          multivariate_feature_state_values?.map(
+            ({ id: _valueId, ...value }) => value,
+          ),
+      },
+    ],
+    live_from: liveFrom ?? new Date().toISOString(),
+    segment_ids_to_delete_overrides: [],
+  }
+}