From ad4d67f2ace0b658917ff63e2ff83f95022cc2d4 Mon Sep 17 00:00:00 2001
From: aidahosa1 <aisosa_idahosa@brown.edu>
Date: Mon, 17 Jun 2024 12:02:14 -0400
Subject: things are getting silly

---
 src/client/views/collections/CollectionCardDeckView.tsx | 3 +++
 1 file changed, 3 insertions(+)

(limited to 'src/client/views/collections/CollectionCardDeckView.tsx')

diff --git a/src/client/views/collections/CollectionCardDeckView.tsx b/src/client/views/collections/CollectionCardDeckView.tsx
index 7ea345e10..bf814cb31 100644
--- a/src/client/views/collections/CollectionCardDeckView.tsx
+++ b/src/client/views/collections/CollectionCardDeckView.tsx
@@ -46,7 +46,9 @@ export class CollectionCardView extends CollectionSubView() {
     @observable _isLoading = false;
     @observable _hoveredNodeIndex = -1;
     @observable _docRefs = new ObservableMap<Doc, DocumentView>();
+    _draggerRef = React.createRef<HTMLDivElement>();
     @observable _maxRowCount = 10;
+    @observable docsBeingDragged: number[] = [];
 
     static getButtonGroup(groupFieldKey: 'chat' | 'star' | 'idea' | 'like', doc: Doc): number | undefined {
         return Cast(doc[groupFieldKey], 'number', null);
@@ -508,6 +510,7 @@ export class CollectionCardView extends CollectionSubView() {
             const amCards = this.overflowAmCardsCalc(realIndex);
             const isSelected = DocumentView.SelectedDocs().includes(doc);
 
+
             const childScreenToLocal = () => {
                 this._forceChildXf;
                 const dref = this._docRefs.get(doc);
-- 
cgit v1.2.3-70-g09d2


From d6ad264a940b4d3db87c10d9a872968d83d63b10 Mon Sep 17 00:00:00 2001
From: aidahosa1 <aisosa_idahosa@brown.edu>
Date: Mon, 17 Jun 2024 12:33:51 -0400
Subject: sigh

---
 .../views/collections/CollectionCardDeckView.tsx   | 33 +++++++++++++++++++++-
 1 file changed, 32 insertions(+), 1 deletion(-)

(limited to 'src/client/views/collections/CollectionCardDeckView.tsx')

diff --git a/src/client/views/collections/CollectionCardDeckView.tsx b/src/client/views/collections/CollectionCardDeckView.tsx
index bf814cb31..7362a65ae 100644
--- a/src/client/views/collections/CollectionCardDeckView.tsx
+++ b/src/client/views/collections/CollectionCardDeckView.tsx
@@ -49,6 +49,8 @@ export class CollectionCardView extends CollectionSubView() {
     _draggerRef = React.createRef<HTMLDivElement>();
     @observable _maxRowCount = 10;
     @observable docsBeingDragged: number[] = [];
+    @observable draggedIndex: number = -1;
+    @observable overIndex: number = -1;
 
     static getButtonGroup(groupFieldKey: 'chat' | 'star' | 'idea' | 'like', doc: Doc): number | undefined {
         return Cast(doc[groupFieldKey], 'number', null);
@@ -491,6 +493,35 @@ export class CollectionCardView extends CollectionSubView() {
                 return <FontAwesomeIcon icon = 'star' size= 'lg' style = {{color: isActive ? '#4476f7' : '#323232'}}/>;
         }
     };
+
+    @action
+onDragStart = (index: number) => {
+    this.draggedIndex = index;
+};
+
+@action
+onDragOver = (index: number) => {
+    if (this.draggedIndex !== index) {
+        this.overIndex = index;
+    }
+};
+
+@action
+onDrop = () => {
+    if (this.draggedIndex !== -1 && this.overIndex !== -1) {
+        const draggedDoc = this.sortedDocs[this.draggedIndex];
+        this.sortedDocs.splice(this.draggedIndex, 1);
+        this.sortedDocs.splice(this.overIndex, 0, draggedDoc);
+        this.draggedIndex = -1;
+        this.overIndex = -1;
+    }
+};
+
+@action
+onDragEnd = () => {
+    this.draggedIndex = -1;
+    this.overIndex = -1;
+};
     /**
      * Actually renders all the cards
      */
@@ -523,7 +554,7 @@ export class CollectionCardView extends CollectionSubView() {
             return (
                 <div
                     key={doc[Id]}
-                    className={`card-item${isSelected ? '-active' : anySelected ? '-inactive' : ''}`}
+                    className={`card-item${isSelected ? '-active' : anySelected ? '-inactive' : ''}`}                    
                     onPointerUp={() => {
                         // this turns off documentDecorations during a transition, then turns them back on afterward.
                         SnappingManager.SetIsResizing(this.Document[Id]);
-- 
cgit v1.2.3-70-g09d2


From 6a3eaaea335440371698bec409952d4c82d7d628 Mon Sep 17 00:00:00 2001
From: aidahosa1 <aisosa_idahosa@brown.edu>
Date: Mon, 17 Jun 2024 13:05:48 -0400
Subject: yay concise code

---
 .../views/collections/CollectionCardDeckView.tsx   | 114 +++++++++++----------
 1 file changed, 59 insertions(+), 55 deletions(-)

(limited to 'src/client/views/collections/CollectionCardDeckView.tsx')

diff --git a/src/client/views/collections/CollectionCardDeckView.tsx b/src/client/views/collections/CollectionCardDeckView.tsx
index 7362a65ae..f50ca6349 100644
--- a/src/client/views/collections/CollectionCardDeckView.tsx
+++ b/src/client/views/collections/CollectionCardDeckView.tsx
@@ -451,77 +451,81 @@ export class CollectionCardView extends CollectionSubView() {
         GPTPopup.Instance.onSortComplete = (sortResult: string) => this.processGptOutput(sortResult);
     };
 
-    /**
+  /**
      * Renders the buttons to customize sorting depending on which group the card belongs to and the amount of total groups
-     * @param childPairIndex
      * @param doc
+     * @param cardSort
      * @returns
      */
-    renderButtons = (doc: Doc, cardSort: cardSortings) => {
-        if (cardSort !== cardSortings.Custom) return '';
-        const amButtons = Math.max(4, this.childDocs?.reduce((set, d) => this.cardSort_customField && set.add(NumCast(d[this.cardSort_customField])), new Set<number>()).size ?? 0);
-        const activeButtonIndex = CollectionCardView.getButtonGroup(this.cardSort_customField, doc);
-        const totalWidth = amButtons * 72 + amButtons * 2 * 5 + 6;
-        return (
-            <div className="card-button-container" style={{ width: `${totalWidth}px`, fontSize: '50px' }} >
-                {numberRange(amButtons).map(i => (
-                    // eslint-disable-next-line jsx-a11y/control-has-associated-label
-                    <Tooltip title={<div key = {i} className="dash-tooltip">Click to add/ remove this card from group {i +1}</div>}>
+  renderButtons = (doc: Doc, cardSort: cardSortings): JSX.Element | null => {
+    if (cardSort !== cardSortings.Custom) return null;
+
+    const amButtons = Math.max(4, this.childDocs?.reduce((set, d) => {
+        if (this.cardSort_customField) {
+            set.add(NumCast(d[this.cardSort_customField]));
+        }
+        return set;
+    }, new Set<number>()).size ?? 0);
+
+    const activeButtonIndex = CollectionCardView.getButtonGroup(this.cardSort_customField, doc);
+    const totalWidth = amButtons * 72 + amButtons * 2 * 5 + 6;
+
+    return (
+        <div className="card-button-container" style={{ width: `${totalWidth}px`, fontSize: '50px' }}>
+            {numberRange(amButtons).map(i => (
+                <Tooltip key={i} title={<div className="dash-tooltip">Click to add/remove this card from group {i + 1}</div>}>
+                    <button type="button" onClick={() => this.toggleButton(i, doc)}>
+                        {this.getButtonIcon(activeButtonIndex === i)}
+                    </button>
+                </Tooltip>
+            ))}
+        </div>
+    );
+};
 
-                        <button key={i} type="button" 
-                        // style={{ backgroundColor: activeButtonIndex === i ? '#4476f7' : '#323232' }} 
-                        onClick={() => this.toggleButton(i, doc)}>
-                            {this.getButtonIcons(activeButtonIndex === i)}
-                        </button>
+    getButtonIcon = (isActive: boolean): JSX.Element => {
+        const iconMap: { [key: string]: any } = {
+            like: 'heart',
+            chat: 'robot',
+            idea: 'cloud'
+        };
 
-                    </Tooltip>
+        const icon = iconMap[this.cardSort_customField ?? ''] || 'star';
+        const color = isActive ? '#4476f7' : '#323232';
 
-                ))}
-            </div>
-        );
+        return <FontAwesomeIcon icon={icon} size='lg' style={{ color }} />;
     };
 
-    getButtonIcons = (isActive: boolean) => {
-        switch (this.cardSort_customField) {
-            case 'like':
-                return <FontAwesomeIcon icon = 'heart' size= 'lg' style = {{color: isActive ? '#4476f7' : '#323232'}}/>;
-            case 'chat':
-                return <FontAwesomeIcon icon = 'robot' size= 'lg' style = {{color: isActive ? '#4476f7' : '#323232'}}/>;
-            case 'idea':
-                return <FontAwesomeIcon icon = 'cloud' size= 'lg' style = {{color: isActive ? '#4476f7' : '#323232'}}/>;
-            default:
-                return <FontAwesomeIcon icon = 'star' size= 'lg' style = {{color: isActive ? '#4476f7' : '#323232'}}/>;
-        }
+
+
+        @action
+    onDragStart = (index: number) => {
+        this.draggedIndex = index;
     };
 
     @action
-onDragStart = (index: number) => {
-    this.draggedIndex = index;
-};
+    onDragOver = (index: number) => {
+        if (this.draggedIndex !== index) {
+            this.overIndex = index;
+        }
+    };
 
-@action
-onDragOver = (index: number) => {
-    if (this.draggedIndex !== index) {
-        this.overIndex = index;
-    }
-};
+    @action
+    onDrop = () => {
+        if (this.draggedIndex !== -1 && this.overIndex !== -1) {
+            const draggedDoc = this.sortedDocs[this.draggedIndex];
+            this.sortedDocs.splice(this.draggedIndex, 1);
+            this.sortedDocs.splice(this.overIndex, 0, draggedDoc);
+            this.draggedIndex = -1;
+            this.overIndex = -1;
+        }
+    };
 
-@action
-onDrop = () => {
-    if (this.draggedIndex !== -1 && this.overIndex !== -1) {
-        const draggedDoc = this.sortedDocs[this.draggedIndex];
-        this.sortedDocs.splice(this.draggedIndex, 1);
-        this.sortedDocs.splice(this.overIndex, 0, draggedDoc);
+    @action
+    onDragEnd = () => {
         this.draggedIndex = -1;
         this.overIndex = -1;
-    }
-};
-
-@action
-onDragEnd = () => {
-    this.draggedIndex = -1;
-    this.overIndex = -1;
-};
+    };
     /**
      * Actually renders all the cards
      */
-- 
cgit v1.2.3-70-g09d2

