mirror of
https://github.com/Unleash/unleash.git
synced 2025-02-28 00:17:12 +01:00
59a6ef46e8
## Problem The ConstraintAccordionList component was used in multiple places: * Playground * Segment form * StrategyExecution * Change requests * Create strategy * Edit strategy This is problematic because some of the views are just pure visual representations, and other views allow you to interact with and edit the constraints. This causes a situation where the visual representation needs to be aware of the implementation details of editing and mutating constraints. In addition the ConstraintAccordionList is not just a pure rendering of the list, it also keeps internal state on when to show the create button and optional headers. This is makes it hard to make changes when stylings need to be subtly different across components. ## Solution Taking on the full refactor for this is out of scope, but it's unfortunate that the ConstraintAccordionList needs all this internal state. For now I split out the list into it's own component called ConstraintList. I gathered the functions needed for editing and mutating the constraints in a reusable hook and isolated the version of the list used in the new feature strategy edit / create components into it's own component so that the changes in layout will not affect anything else. Ideally we should try to move towards a future where the components don't keep internal state like this but clear boundaries and purposes for the use. |
||
|---|---|---|
| .. | ||
| api | ||
| useChangeRequestAddStrategy.ts | ||
| useChangeRequestInReviewWarning.tsx | ||
| useChangeRequestsEnabled.test.tsx | ||
| useChangeRequestsEnabled.ts | ||
| useChangeRequestToggle.ts | ||
| useCollaborateData.tsx | ||
| useConditionallyHiddenColumns.ts | ||
| useDefaultProjectSettings.ts | ||
| useDragItem.ts | ||
| useEventSettings.ts | ||
| useFormErrors.ts | ||
| useGlobalLocalStorage.ts | ||
| useGlobalState.ts | ||
| useHasAccess.ts | ||
| useHiddenEnvironments.ts | ||
| useHighestPermissionChangeRequestEnvironment.test.ts | ||
| useHighestPermissionChangeRequestEnvironment.ts | ||
| useId.test.ts | ||
| useId.ts | ||
| useIsAppleDevice.ts | ||
| useKeyboardShortcut.ts | ||
| useLastViewedProject.ts | ||
| useLoading.ts | ||
| useLocationSettings.ts | ||
| useOnBlur.test.tsx | ||
| useOnBlur.ts | ||
| useOnClickOutside.test.tsx | ||
| useOnClickOutside.ts | ||
| useOnVisible.ts | ||
| useOptionalPathParam.ts | ||
| usePageTitle.ts | ||
| usePagination.ts | ||
| usePersistentGlobalState.ts | ||
| usePersistentTableState.test.tsx | ||
| usePersistentTableState.ts | ||
| usePinnedFavorites.test.ts | ||
| usePinnedFavorites.ts | ||
| usePlausibleTracker.ts | ||
| useQueryParams.ts | ||
| useQueryStringNumberState.ts | ||
| useQueryStringState.ts | ||
| useRequiredPathParam.ts | ||
| useRequiredQueryParam.ts | ||
| useSearch.test.tsx | ||
| useSearch.ts | ||
| useTabs.ts | ||
| useThemeMode.ts | ||
| useToast.tsx | ||
| useUiFlag.ts | ||
| useUsersPlan.ts | ||
| useVariant.ts | ||
| useVirtualizedRange.ts | ||
| useWeakMap.ts | ||