aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/nodes')
-rw-r--r--src/client/views/nodes/FontIconBox/FontIconBox.tsx2
-rw-r--r--src/client/views/nodes/IconTagBox.tsx120
2 files changed, 52 insertions, 70 deletions
diff --git a/src/client/views/nodes/FontIconBox/FontIconBox.tsx b/src/client/views/nodes/FontIconBox/FontIconBox.tsx
index 0fe112634..7feb17df1 100644
--- a/src/client/views/nodes/FontIconBox/FontIconBox.tsx
+++ b/src/client/views/nodes/FontIconBox/FontIconBox.tsx
@@ -157,7 +157,7 @@ export class FontIconBox extends ViewBoxBaseComponent<ButtonProps>() {
let noviceList: string[] = [];
let text: string | undefined;
- let getStyle: (val: string) => { [key: string]: string } = () => ({});
+ const getStyle: (val: string) => { [key: string]: string } = () => ({});
let icon: IconProp = 'caret-down';
const isViewDropdown = script?.script.originalScript.startsWith('{ return setView');
if (isViewDropdown) {
diff --git a/src/client/views/nodes/IconTagBox.tsx b/src/client/views/nodes/IconTagBox.tsx
index 370ce51d1..e6c0961ed 100644
--- a/src/client/views/nodes/IconTagBox.tsx
+++ b/src/client/views/nodes/IconTagBox.tsx
@@ -1,31 +1,30 @@
-import React from "react";
-import { observer } from "mobx-react";
-import { computed } from "mobx";
-import { ObservableReactComponent } from "../ObservableReactComponent";
-import { NumCast } from "../../../fields/Types";
-import { Doc } from "../../../fields/Doc";
-import { numberRange } from "../../../Utils";
-import { Tooltip } from "@mui/material";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { undoable } from "../../util/UndoManager";
-import { BoolCast } from "../../../fields/Types";
-import { DocCast } from "../../../fields/Types";
+import React from 'react';
+import { observer } from 'mobx-react';
+import { computed } from 'mobx';
+import { ObservableReactComponent } from '../ObservableReactComponent';
+import { NumCast } from '../../../fields/Types';
+import { Doc } from '../../../fields/Doc';
+import { numberRange } from '../../../Utils';
+import { Tooltip } from '@mui/material';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import { undoable } from '../../util/UndoManager';
+import { BoolCast } from '../../../fields/Types';
+import { DocCast } from '../../../fields/Types';
import './IconTagBox.scss';
-import {DocData } from '../../../fields/DocSymbols';
-import { StrListCast } from "../../../fields/Doc";
-import { StrCast } from "../../../fields/Types";
-import { CollectionViewType } from "../../documents/DocumentTypes";
-import { SnappingManager } from "../../util/SnappingManager";
-import { MainView } from "../MainView";
-import { PropertiesView } from "../PropertiesView";
-
+import { DocData } from '../../../fields/DocSymbols';
+import { StrListCast } from '../../../fields/Doc';
+import { StrCast } from '../../../fields/Types';
+import { CollectionViewType } from '../../documents/DocumentTypes';
+import { SnappingManager } from '../../util/SnappingManager';
+import { MainView } from '../MainView';
+import { PropertiesView } from '../PropertiesView';
export interface IconTagProps {
doc: Doc;
}
/**
- * Renders the icon tags that rest under the document. The icons rendered are determined by the values of
+ * Renders the icon tags that rest under the document. The icons rendered are determined by the values of
* each icon in the userdoc.
*/
@observer
@@ -33,7 +32,6 @@ export class IconTagBox extends ObservableReactComponent<IconTagProps> {
@computed
get currentScale() {
return NumCast((this._props.doc.embedContainer as Doc)?._freeform_scale, 1);
-
}
constructor(props: any) {
@@ -41,10 +39,9 @@ export class IconTagBox extends ObservableReactComponent<IconTagProps> {
}
componentDidUpdate(prevProps: Readonly<IconTagProps>): void {
- this._props.doc[DocData].tagHeight = 36*this.currentScale;
+ this._props.doc[DocData].tagHeight = 36 * this.currentScale;
}
-
/**
* Renders the buttons to customize sorting depending on which group the card belongs to and the amount of total groups
* @param doc
@@ -52,36 +49,32 @@ export class IconTagBox extends ObservableReactComponent<IconTagProps> {
* @returns
*/
renderButtons = (doc: Doc): JSX.Element | null => {
- const amButtons = (StrListCast(Doc.UserDoc().myFilterHotKeyTitles).length) + 1
+ const amButtons = StrListCast(Doc.UserDoc().myFilterHotKeyTitles).length + 1;
- const keys = StrListCast(Doc.UserDoc().myFilterHotKeyTitles)
-
- const totalWidth = (amButtons -1) * 35 + (amButtons -1) * 2 * 5 + 6;
+ const keys = StrListCast(Doc.UserDoc().myFilterHotKeyTitles);
- const iconMap = (buttonID: number) => {
- return StrCast(Doc.UserDoc()[keys[buttonID]])
+ const totalWidth = (amButtons - 1) * 35 + (amButtons - 1) * 2 * 5 + 6;
+ const iconMap = (buttonID: number) => {
+ return StrCast(Doc.UserDoc()[keys[buttonID]]);
};
- const isCard = DocCast(this._props.doc.embedContainer).type_collection === CollectionViewType.Card
-
-
+ const isCard = DocCast(this._props.doc.embedContainer).type_collection === CollectionViewType.Card;
return (
<div
- className="card-button-container"
- style={{
- transformOrigin: 'top left',
- transform: `scale(${ isCard ? 2 : 0.6 / this.currentScale})
- translateY(${doc[DocData].showLabels ? ((NumCast(doc[DocData].keywordHeight)*(1-this.currentScale))) : 0}px)
+ className="card-button-container"
+ style={{
+ transformOrigin: 'top left',
+ transform: `scale(${isCard ? 2 : 0.6 / this.currentScale})
+ translateY(${doc[DocData].showLabels ? NumCast(doc[DocData].keywordHeight) * (1 - this.currentScale) : 0}px)
`,
- width: `${totalWidth}px`,
- fontSize: '50px'
- }}
- >
- {numberRange(amButtons-1).map(i => (
+ width: `${totalWidth}px`,
+ fontSize: '50px',
+ }}>
+ {numberRange(amButtons - 1).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) )}>
+ <button key={i} type="button" onClick={() => this.toggleButton(doc, iconMap(i))}>
{this.getButtonIcon(doc, iconMap(i))}
</button>
</Tooltip>
@@ -96,47 +89,36 @@ export class IconTagBox extends ObservableReactComponent<IconTagProps> {
openHotKeyMenu = () => {
SnappingManager.PropertiesWidth < 5 && SnappingManager.SetPropertiesWidth(0);
- SnappingManager.SetPropertiesWidth(MainView.Instance.propertiesWidth() < 15 ? Math.min(MainView.Instance._dashUIWidth - 50, 250) : 0);
+ SnappingManager.SetPropertiesWidth(MainView.Instance.propertiesWidth() < 15 ? 250 : 0);
- PropertiesView.Instance.CloseAll()
- PropertiesView.Instance.openFilters = true
- }
+ PropertiesView.Instance.CloseAll();
+ PropertiesView.Instance.openFilters = true;
+ };
- /**
+ /**
* Toggles the buttons between on and off when creating custom sort groupings/changing those created by gpt
* @param childPairIndex
* @param buttonID
* @param doc
*/
- toggleButton = undoable((doc: Doc, icon: string) => {
- BoolCast(doc[icon]) ? doc[icon] = false : doc[icon] = true
-
+ toggleButton = undoable((doc: Doc, icon: string) => {
+ BoolCast(doc[icon]) ? (doc[icon] = false) : (doc[icon] = true);
}, 'toggle card tag');
-
/**
* Determines whether or not the given icon is active depending on the doc's data
- * @param doc
- * @param icon
- * @returns
+ * @param doc
+ * @param icon
+ * @returns
*/
getButtonIcon = (doc: Doc, icon: any): JSX.Element => {
- const isActive = doc[icon]
+ const isActive = doc[icon];
const color = isActive ? '#4476f7' : '#323232';
- return <FontAwesomeIcon icon={icon} style={{ color , height: '30px', width: '30px'}} />;
+ return <FontAwesomeIcon icon={icon} style={{ color, height: '30px', width: '30px' }} />;
};
- render (){
- return (
- <>
- {this.renderButtons(this._props.doc)}
-
- </>
- )
-
+ render() {
+ return <>{this.renderButtons(this._props.doc)}</>;
}
-
}
-
-
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-11-20 21:46:42 +0000