fix: 🐛 Fix curly brackets

phun-ky · Oct 18, 2023 · 430dc4a · 430dc4a
1 parent 95669a6
commit 430dc4a
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 10 deletions.
diff --git a/src/features/dissect/index.ts b/src/features/dissect/index.ts
@@ -115,7 +115,7 @@ export const element = (sectionEl: HTMLElement): Promise<void> => {
 
       await add(_dissection_el, _dissection_styles);
 
-      if (useSVG(_areas_string)) {
+      if (useSVG(_areas_string) && !isCurly(_areas_string)) {
         new DrawSVGLine(targetEl, _dissection_el);
       } else if (isCurly(_areas_string)) {
         new DrawSVGCurlyBracket(targetEl, _dissection_el);

diff --git a/src/utils/__tests__/area.ts b/src/utils/__tests__/area.ts
@@ -90,7 +90,7 @@ describe('area', () => {
   describe('useSVG', () => {
     it('should return true if SVG-related areas are in the area string', () => {
       expect(useSVG('svg')).toBe(true);
-      expect(useSVG('full curly')).toBe(true);
+      expect(useSVG('full curly')).toBe(false);
       expect(useSVG('left right')).toBe(false);
     });
   });

diff --git a/src/utils/area.ts b/src/utils/area.ts
@@ -118,10 +118,7 @@ export const isWidthArea = (areaString: string): boolean => {
  * @returns `true` if any SVG-related area is present, otherwise `false`.
  */
 export const useSVG = (areaString: string): boolean =>
-  areaString.includes(DissectAreaEnum.SVG) ||
-  areaString.includes(DissectAreaEnum.Curly) ||
-  areaString.includes(DissectAreaEnum.Full) ||
-  areaString.includes(DissectAreaEnum.Enclose);
+  areaString.includes(DissectAreaEnum.SVG);
 
 /**
  * Checks if the provided areaString contains 'curly' and 'full' areas.

diff --git a/src/utils/classes/DrawSVGCurlyBracket.ts b/src/utils/classes/DrawSVGCurlyBracket.ts
@@ -3,6 +3,7 @@
 import { uniqueID } from '../id';
 import { getCurlySVGPath, getPositionsForCurlySVGPath } from '../bezier';
 import { direction_of_element } from '../direction-of-element';
+import { add as addStyle } from '../styles';
 
 /**
  * Class representing a DrawSVGCurlyBracket instance.
@@ -55,6 +56,10 @@ export class DrawSVGCurlyBracket {
       );
     }
 
+    addStyle(this.#canvas, {
+      height: `${document.body.scrollHeight}px`
+    });
+
     this.connect();
   }
 
@@ -79,11 +84,10 @@ export class DrawSVGCurlyBracket {
     const _id = uniqueID();
     const _path_el_id = `ph_draw_path-path-${_id}`;
     const _new_path = path.cloneNode(false) as SVGPathElement;
+    const dataStartElID = this.startElement.getAttribute('id') || uniqueID();
 
-    _new_path.setAttribute(
-      'data-start-el',
-      this.startElement.getAttribute('id') || 'no-id-found'
-    );
+    this.startElement.setAttribute('id', dataStartElID);
+    _new_path.setAttribute('data-start-el', dataStartElID);
     _new_path.setAttribute('id', _path_el_id);
     _new_path.classList.remove('original');
     _new_path.classList.add('speccer');