diff options
| author | aidahosa1 <aisosa_idahosa@brown.edu> | 2024-08-22 03:03:03 -0400 |
|---|---|---|
| committer | aidahosa1 <aisosa_idahosa@brown.edu> | 2024-08-22 03:03:03 -0400 |
| commit | 3ab5b620e462a35d0dc23f67014fc5aa9ef4803c (patch) | |
| tree | e0e7bdd82778e64c625f080b3ebcee958d44b738 /src/client/views/nodes | |
| parent | a882dc6899a6b11e2e972f3e2a2ae991caeea094 (diff) | |
liberty
Diffstat (limited to 'src/client/views/nodes')
| -rw-r--r-- | src/client/views/nodes/IconTagBox.tsx | 75 |
1 files changed, 66 insertions, 9 deletions
diff --git a/src/client/views/nodes/IconTagBox.tsx b/src/client/views/nodes/IconTagBox.tsx index 73360b684..cdf2075cb 100644 --- a/src/client/views/nodes/IconTagBox.tsx +++ b/src/client/views/nodes/IconTagBox.tsx @@ -16,6 +16,15 @@ import { BoolCast } from "../../../fields/Types"; import { DocCast } from "../../../fields/Types"; import './IconTagBox.scss'; import { AclAdmin, AclAugment, AclEdit, DocData } from '../../../fields/DocSymbols'; +import { StrListCast } from "../../../fields/Doc"; +import { StrCast } from "../../../fields/Types"; +import { DocListCast } from "../../../fields/Doc"; +import { List } from "../../../fields/List"; +import { action } from "mobx"; +import { DragManager } from "../../util/DragManager"; +import { setupMoveUpEvents } from "../../../ClientUtils"; +import { returnFalse } from "../../../ClientUtils"; +import { emptyFunction } from "../../../Utils"; export interface IconTagProps { @@ -61,6 +70,53 @@ export class IconTagBox extends ObservableReactComponent<IconTagProps> { this._props.doc[DocData].tagHeight = 36*this.currentScale; } + // createCollection = () => { + // // Get the documents that contain the keyword. + // const selected = DocListCast(this.getKeywordCollectionDocs()!); + // const newEmbeddings = selected.map(doc => Doc.MakeEmbedding(doc)); + + // // Create a new collection and set up configurations. + // const newCollection = ((doc: Doc) => { + // const docData = doc[DocData]; + // docData.data = new List<Doc>(newEmbeddings); + // docData.title = this._props.keyword; + // doc._freeform_panX = doc._freeform_panY = 0; + // return doc; + // })(Doc.MakeCopy(Doc.UserDoc().emptyCollection as Doc, true)); + // newEmbeddings.forEach(embed => (embed.embedContainer = newCollection)); + // newCollection._width = 900; + // newCollection._height = 900; + // newCollection.layout_fitWidth = true; + + // // Add the collection to the keyword document's list of associated smart collections. + // this._props.keywordDoc.collections = new List<Doc>([...DocListCast(this._props.keywordDoc.collections), newCollection]); + // newCollection[DocData].data_labels = new List<string>([this._props.keyword]); + // newCollection[DocData][`${this._props.keyword}`] = true; + // newCollection[DocData].showLabels = true; + // return newCollection; + // }; + + // @action + // handleDragStart = (e: React.PointerEvent) => { + // if (this._props.isEditing) { + // const clone = this.ref.current?.cloneNode(true) as HTMLElement; + // if (!clone) return; + + // setupMoveUpEvents( + // this, + // e, + // () => { + // const dragData = new DragManager.DocumentDragData([this.createCollection()]); + // DragManager.StartDocumentDrag([this.ref.current!], dragData, e.clientX, e.clientY, {}); + // return true; + // }, + // returnFalse, + // emptyFunction + // ); + // e.preventDefault(); + // } + // }; + /** * Renders the buttons to customize sorting depending on which group the card belongs to and the amount of total groups * @param doc @@ -70,7 +126,10 @@ export class IconTagBox extends ObservableReactComponent<IconTagProps> { renderButtons = (doc: Doc): JSX.Element | null => { // if (cardSort !== cardSortings.Custom) return null; - const amButtons = 4 + const amButtons = StrListCast(Doc.UserDoc().myFilterHotKeyTitles).length + + const keys = StrListCast(Doc.UserDoc().myFilterHotKeyTitles) + // const amButtons = Math.max( // 4, @@ -86,11 +145,9 @@ export class IconTagBox extends ObservableReactComponent<IconTagProps> { const totalWidth = amButtons * 35 + amButtons * 2 * 5 + 6; - const iconMap: { [key: number]: any } = { - 0: 'star', - 1: 'heart', - 2: 'cloud', - 3: 'bolt' + const iconMap = (buttonID: number) => { + return StrCast(Doc.UserDoc()[keys[buttonID]]) + }; @@ -108,9 +165,9 @@ export class IconTagBox extends ObservableReactComponent<IconTagProps> { }} > {numberRange(amButtons).map(i => ( - <Tooltip key={i} title={<div className="dash-tooltip">Click to add/remove this card from the {iconMap[i]} group</div>}> - <button key = {i} type="button" onClick={() => this.toggleButton(doc, iconMap[i] )}> - {this.getButtonIcon(doc, iconMap[i])} + <Tooltip key={i} title={<div className="dash-tooltip">Click to add/remove this card from the {iconMap(i)} group</div>}> + <button key = {i} type="button" onClick={() => this.toggleButton(doc, iconMap(i) )}> + {this.getButtonIcon(doc, iconMap(i))} </button> </Tooltip> ))} |
