feat: add the exportYaml for each exportable resource's list&show pages - #104
jintao2002 wants to merge 4 commits into
Conversation
| } | ||
|
|
||
| // Global state for YAML export dialog - ensures only one instance | ||
| let globalDialogState: YamlExportDialogState = { |
There was a problem hiding this comment.
Why do we need this mechanism instead of having each YAML dialog maintain its own state?
There was a problem hiding this comment.
Because the YAML export dialog was being destroyed when dropdown menus closed after clicking so I maintained a global state outside the component tree to ensure the dialog's lifecycle is independent of its parent component(Dropdown menu). I tried to resolve it with React.createPortal but it didn't work, should I keep trying in other ways for this problem?
| ? globalBreadcrumb | ||
| : breadcrumbFromProps; | ||
|
|
||
| // YAML export dialog state |
There was a problem hiding this comment.
The theme show is open to all resources, but not all resources need to be exported as YAML. Therefore, we can pass them in as extras as needed.
There was a problem hiding this comment.
I determined whether to render the ExportButton by conditions below and it worked. Should I keep it this way or determine the rendering only by extraActions?
{resource?.name && EXPORTABLE_RESOURCES.includes(resource.name as any) && (
<ExportYamlAction
...
/>
)}
2 participants
Global State Management for Dialog Lifecycle
useYamlExportDialog.tsx(src/hooks/use-yaml-export-dialog.ts): Manages global dialog state to solve component unmounting issues when dropdown menus closeGlobalYamlExportDialog.tsx(src/components/business/GlobalYamlExportDialog.tsx): Listens for export events and renders the dialogyaml-utils.ts(src/lib/yaml-utils.ts)Show Pages && List Pages
ShowPage Component(src/components/theme/curds/show/index.tsx)EXPORTABLE-RESOURCES