[UI] Restructure Phase 5.b.3 - Migrate design modals to shared modal primitives · meshery/meshery#18756

(2 评论) (0 反应) (1 负责人)HTML (10,013 star) (3,101 fork)batch import

component/uiframework/reacthelp wantedkind/enhancementlanguage/javascript

描述

Current Behavior

Design-related modal flows are split across separate implementations in ui/components/ExportModal.tsx, ui/components/General/Modals/ImportModal.tsx, and ui/components/General/Modals/PublishModal.tsx.

Desired Behavior

Move design modal flows onto the shared modal foundation from #18751 and relocate them into their target design-domain homes without changing their user-facing behavior.

Implementation

Parent issue: #18661
Foundation issue: #18751
Companion tasks are tracked in the checklist on #18661.
Migrate and/or relocate:
- ui/components/ExportModal.tsx → ui/components/designs/export/ExportDesignModal.tsx as a FormModal-based implementation
- ui/components/General/Modals/ImportModal.tsx → ui/components/designs/ImportDesignModal.tsx
- ui/components/General/Modals/PublishModal.tsx → ui/components/designs/PublishDesignModal.tsx
Update imports, helpers, and nearby callers so design flows depend on the shared modal API instead of legacy general-purpose modal wrappers.

Acceptance Tests

Design import, publish, and export flows render through the shared modal primitives from #18751.
The migrated files live under the design-domain locations called out in #18661.
Legacy implementations under ui/components/ and ui/components/General/Modals/ are removed after their replacements are wired.

Mockups

N/A. Reuse the behavior and structure described in #18661.

贡献者指南

技术栈: typescriptreact
领域: frontend
议题类型: refactor
难度: 3
预计时间: half day
活动状态: active
清晰度: clear
前置要求: ReactTypeScriptModal componentsMeshery codebase
新手友好度: 65
研究方向: First, examine the current modal implementations in `ui/components/ExportModal.tsx`, `ui/components/General/Modals/ImportModal.tsx`, and `ui/components/General/Modals/PublishModal.tsx`. Study the shared modal foundation introduced in #18751 to understand the API. Follow the migration plan from parent issue #18661, moving each file to its target location (e.g., `ExportModal.tsx` → `ui/components/designs/export/ExportDesignModal.tsx`) and converting them to use `FormModal` based implementations. Update imports and callers so design flows depend on the shared modal API. Finally, remove the legacy files after verification. No need to alter user facing behavior.