* kanban: refactor, move linksEditor to links.

easysoft · May 28, 2024 · 64d0a96 · 64d0a96
1 parent d4f7335
commit 64d0a96
Show file tree

Hide file tree

Showing 4 changed files with 14 additions and 5 deletions.
diff --git a/lib/kanban/src/component/kanban-links.tsx b/lib/kanban/src/component/kanban-links.tsx
@@ -1,6 +1,7 @@
 import {Component, createRef} from 'preact';
 import {$} from '@zui/core';
 import {KanbanLink} from './kanban-link';
+import {KanbanLinkEditor} from './kanban-link-editor';
 
 import type {ComponentChild, RenderableProps} from 'preact';
 import type {KanbanLinkOptions, KanbanLinksProps, KanbanLinksState} from '../types';
@@ -95,11 +96,20 @@ export class KanbanLinks extends Component<KanbanLinksProps, KanbanLinksState> {
         }, [] as ComponentChild[]);
     }
 
+    _renderEditor(props: RenderableProps<KanbanLinksProps>) {
+        const {editLinks, onAddLink} = props;
+        if (editLinks) {
+            return <KanbanLinkEditor key="editor" onAddLink={onAddLink} />;
+        }
+        return null;
+    }
+
     render(props: RenderableProps<KanbanLinksProps>) {
         this._idSet.clear();
         return (
             <div className="kanban-links" ref={this._ref}>
                 {this._renderLinks(props)}
+                {this._renderEditor(props)}
             </div>
         );
     }

diff --git a/lib/kanban/src/component/kanban.tsx b/lib/kanban/src/component/kanban.tsx
@@ -3,7 +3,6 @@ import {Draggable, DraggableOptions} from '@zui/dnd';
 import {KanbanHeader} from './kanban-header';
 import {KanbanBody} from './kanban-body';
 import {KanbanLinks} from './kanban-links';
-import {KanbanLinkEditor} from './kanban-link-editor';
 import {getCols, mergeData, getLanes, getColItems, normalizeData} from '../helpers/kanban-helpers';
 
 import type {ComponentChildren, RenderableProps} from 'preact';
@@ -758,14 +757,14 @@ export class Kanban<P extends KanbanProps = KanbanProps, S extends KanbanState =
         }
 
         return (
-            <KanbanLinks key="links" links={links} filters={filters} onDeleteLink={editLinks ? (this._onDeleteLink as (link: KanbanLinkOptions) => void) : undefined} />
+            <KanbanLinks key="links" links={links} filters={filters} editLinks={editLinks} onDeleteLink={editLinks ? (this._onDeleteLink as (link: KanbanLinkOptions) => void) : undefined} onAddLink={editLinks ? this._onAddLink : undefined} />
         );
     }
 
     protected _getChildren(props: RenderableProps<P>): ComponentChildren {
         const data = this._data.value;
         const {cols, lanes, items} = data;
-        const {editLinks, laneNameWidth} = props;
+        const {laneNameWidth} = props;
         const layoutCols = this._layoutCols(cols, props);
         const layoutLanes = this._layoutLanes(lanes, props);
         return [
@@ -780,7 +779,6 @@ export class Kanban<P extends KanbanProps = KanbanProps, S extends KanbanState =
                 hideLaneName={laneNameWidth === 0}
             />,
             this._renderLinks(props),
-            editLinks ? <KanbanLinkEditor key="linkEditor" onAddLink={this._onAddLink} /> : null,
             props.children,
         ];
     }

diff --git a/lib/kanban/src/types/kanban-link-editor-props.ts b/lib/kanban/src/types/kanban-link-editor-props.ts
@@ -1,4 +1,3 @@
 export interface KanbanLinkEditorProps {
-    hover?: string;
     onAddLink?: (from: string, to: string) => void;
 }
diff --git a/lib/kanban/src/types/kanban-links-props.ts b/lib/kanban/src/types/kanban-links-props.ts
@@ -3,5 +3,7 @@ import type {KanbanLinkOptions} from './kanban-link-options';
 export interface KanbanLinksProps {
     links: KanbanLinkOptions[];
     filters?: string[];
+    editLinks?: boolean;
     onDeleteLink?: (link: KanbanLinkOptions) => void;
+    onAddLink?: (from: string, to: string) => void;
 }