chore: make key naming simpler in LineWidth Enum (#6450)

toeverything · Mar 11, 2024 · d992456 · d992456
1 parent 85cd8af
commit d992456
Show file tree

Hide file tree

Showing 9 changed files with 32 additions and 34 deletions.
diff --git a/packages/blocks/src/_common/types.ts b/packages/blocks/src/_common/types.ts
@@ -163,16 +163,14 @@ export type ShapeTool = {
 };
 
 export enum LineWidth {
-  LINE_WIDTH_TWO = 2,
-  LINE_WIDTH_FOUR = 4,
-  LINE_WIDTH_SIX = 6,
-  LINE_WIDTH_EIGHT = 8,
-  LINE_WIDTH_TEN = 10,
-  LINE_WIDTH_TWELVE = 12,
-  // eslint-disable-next-line @typescript-eslint/no-duplicate-enum-values
-  Thin = 4,
-  // eslint-disable-next-line @typescript-eslint/no-duplicate-enum-values
-  Thick = 10,
+  Two = 2,
+  // Thin
+  Four = 4,
+  Six = 6,
+  Eight = 8,
+  // Thick
+  Ten = 10,
+  Twelve = 12,
 }
 
 export type TextTool = {

diff --git a/packages/blocks/src/root-block/edgeless/components/component-toolbar/change-brush-button.ts b/packages/blocks/src/root-block/edgeless/components/component-toolbar/change-brush-button.ts
@@ -35,7 +35,7 @@ function getMostCommonSize(elements: BrushElementModel[]): LineWidth {
     (ele: BrushElementModel) => ele.lineWidth
   );
   const max = maxBy(Object.entries(shapeTypes), ([_k, count]) => count);
-  return max ? (Number(max[0]) as LineWidth) : LineWidth.LINE_WIDTH_FOUR;
+  return max ? (Number(max[0]) as LineWidth) : LineWidth.Four;
 }
 
 @customElement('edgeless-change-brush-button')
@@ -108,7 +108,7 @@ export class EdgelessChangeBrushButton extends WithDisposable(LitElement) {
   private _selectedColor: string | null = null;
 
   @state()
-  private _selectedSize: LineWidth | null = LineWidth.LINE_WIDTH_FOUR;
+  private _selectedSize: LineWidth | null = LineWidth.Four;
 
   @query('.color-panel-container')
   private _colorPanel!: EdgelessColorPanel;

diff --git a/...es/blocks/src/root-block/edgeless/components/component-toolbar/change-connector-button.ts b/...es/blocks/src/root-block/edgeless/components/component-toolbar/change-connector-button.ts
@@ -71,7 +71,7 @@ function getMostCommonLineWidth(elements: ConnectorElementModel[]): LineWidth {
     return ele.strokeWidth;
   });
   const max = maxBy(Object.entries(sizes), ([_k, count]) => count);
-  return max ? (Number(max[0]) as LineWidth) : LineWidth.LINE_WIDTH_FOUR;
+  return max ? (Number(max[0]) as LineWidth) : LineWidth.Four;
 }
 
 export function getMostCommonLineStyle(
@@ -284,7 +284,7 @@ export class EdgelessChangeConnectorButton extends WithDisposable(LitElement) {
     const selectedColor = getMostCommonColor(this.elements);
     const selectedMode = getMostCommonMode(this.elements);
     const selectedLineSize =
-      getMostCommonLineWidth(this.elements) ?? LineWidth.LINE_WIDTH_FOUR;
+      getMostCommonLineWidth(this.elements) ?? LineWidth.Four;
     const selectedRough = getMostCommonRough(this.elements);
     const selectedLineStyle = getMostCommonLineStyle(this.elements);
     const selectedStartPointStyle =

diff --git a/packages/blocks/src/root-block/edgeless/components/component-toolbar/change-shape-button.ts b/packages/blocks/src/root-block/edgeless/components/component-toolbar/change-shape-button.ts
@@ -89,7 +89,7 @@ function getMostCommonLineSize(elements: ShapeElementModel[]): LineWidth {
     return ele.strokeWidth;
   });
   const max = maxBy(Object.entries(sizes), ([_k, count]) => count);
-  return max ? (Number(max[0]) as LineWidth) : LineWidth.LINE_WIDTH_FOUR;
+  return max ? (Number(max[0]) as LineWidth) : LineWidth.Four;
 }
 
 function getMostCommonLineStyle(
@@ -436,7 +436,7 @@ export class EdgelessChangeShapeButton extends WithDisposable(LitElement) {
     const selectedStrokeColor =
       getMostCommonStrokeColor(this.elements) ?? STROKE_COLORS[0];
     const selectedLineSize =
-      getMostCommonLineSize(this.elements) ?? LineWidth.LINE_WIDTH_FOUR;
+      getMostCommonLineSize(this.elements) ?? LineWidth.Four;
     const selectedLineStyle = getMostCommonLineStyle(this.elements) ?? 'solid';
     const selectedShapeStyle =
       getMostCommonShapeStyle(this.elements) ?? ShapeStyle.Scribbled;

diff --git a/packages/blocks/src/root-block/edgeless/components/panel/line-width-panel.ts b/packages/blocks/src/root-block/edgeless/components/panel/line-width-panel.ts
@@ -106,7 +106,7 @@ export class EdgelessLineWidthPanel extends WithDisposable(LitElement) {
   `;
 
   @property({ attribute: false })
-  selectedSize: LineWidth = LineWidth.LINE_WIDTH_TWO;
+  selectedSize: LineWidth = LineWidth.Two;
 
   @property({ attribute: false })
   hasTooltip = true;
@@ -136,22 +136,22 @@ export class EdgelessLineWidthPanel extends WithDisposable(LitElement) {
     let width = 0;
     let dragHandleOffsetX = 0;
     switch (selectedSize) {
-      case LineWidth.LINE_WIDTH_TWO:
+      case LineWidth.Two:
         width = 0;
         break;
-      case LineWidth.LINE_WIDTH_FOUR:
+      case LineWidth.Four:
         width = 16;
         dragHandleOffsetX = 1;
         break;
-      case LineWidth.LINE_WIDTH_SIX:
+      case LineWidth.Six:
         width = 32;
         dragHandleOffsetX = 2;
         break;
-      case LineWidth.LINE_WIDTH_EIGHT:
+      case LineWidth.Eight:
         width = 48;
         dragHandleOffsetX = 3;
         break;
-      case LineWidth.LINE_WIDTH_TEN:
+      case LineWidth.Ten:
         width = 64;
         dragHandleOffsetX = 4;
         break;
@@ -224,17 +224,17 @@ export class EdgelessLineWidthPanel extends WithDisposable(LitElement) {
     // Need to select the nearest size.
     let selectedSize = this.selectedSize;
     if (dragHandlerPosition <= 12) {
-      selectedSize = LineWidth.LINE_WIDTH_TWO;
+      selectedSize = LineWidth.Two;
     } else if (dragHandlerPosition > 12 && dragHandlerPosition <= 26) {
-      selectedSize = LineWidth.LINE_WIDTH_FOUR;
+      selectedSize = LineWidth.Four;
     } else if (dragHandlerPosition > 26 && dragHandlerPosition <= 40) {
-      selectedSize = LineWidth.LINE_WIDTH_SIX;
+      selectedSize = LineWidth.Six;
     } else if (dragHandlerPosition > 40 && dragHandlerPosition <= 54) {
-      selectedSize = LineWidth.LINE_WIDTH_EIGHT;
+      selectedSize = LineWidth.Eight;
     } else if (dragHandlerPosition > 54 && dragHandlerPosition <= 68) {
-      selectedSize = LineWidth.LINE_WIDTH_TEN;
+      selectedSize = LineWidth.Ten;
     } else {
-      selectedSize = LineWidth.LINE_WIDTH_TWELVE;
+      selectedSize = LineWidth.Twelve;
     }
     this._updateLineWidthPanel(selectedSize);
     this._onSelect(selectedSize);

diff --git a/packages/blocks/src/root-block/edgeless/components/toolbar/brush/brush-tool-button.ts b/packages/blocks/src/root-block/edgeless/components/toolbar/brush/brush-tool-button.ts
@@ -53,7 +53,7 @@ export class EdgelessBrushToolButton extends EdgelessToolButton<
   color: string = DEFAULT_BRUSH_COLOR;
 
   @state()
-  lineWidth = LineWidth.LINE_WIDTH_FOUR;
+  lineWidth = LineWidth.Four;
 
   protected override _type = 'brush' as const;
   protected override readonly _states = ['color', 'lineWidth'] as const;

diff --git a/...ages/blocks/src/root-block/edgeless/components/toolbar/connector/connector-tool-button.ts b/...ages/blocks/src/root-block/edgeless/components/toolbar/connector/connector-tool-button.ts
@@ -46,7 +46,7 @@ export class EdgelessConnectorToolButton extends EdgelessToolButton<
   stroke = GET_DEFAULT_LINE_COLOR();
 
   @state()
-  strokeWidth = LineWidth.LINE_WIDTH_TWO;
+  strokeWidth = LineWidth.Two;
 
   protected override _type = 'connector' as const;
   protected override readonly _states = [

diff --git a/packages/blocks/src/root-block/edgeless/utils/consts.ts b/packages/blocks/src/root-block/edgeless/utils/consts.ts
@@ -32,7 +32,7 @@ export const SHAPE_OVERLAY_OPTIONS = {
   strokeStyle: StrokeStyle.Solid,
   strokeLineDash: [] as number[],
   stroke: 'black',
-  strokeWidth: LineWidth.LINE_WIDTH_TWO,
+  strokeWidth: LineWidth.Two,
   fill: 'transparent',
 };
 

diff --git a/packages/blocks/src/surface-block/managers/edit-session.ts b/packages/blocks/src/surface-block/managers/edit-session.ts
@@ -148,20 +148,20 @@ export class EditSessionStorage {
       rearEndpointStyle: DEFAULT_REAR_END_POINT_STYLE,
       stroke: GET_DEFAULT_LINE_COLOR(),
       strokeStyle: StrokeStyle.Solid,
-      strokeWidth: LineWidth.LINE_WIDTH_TWO,
+      strokeWidth: LineWidth.Two,
       rough: false,
     },
     brush: {
       color: GET_DEFAULT_LINE_COLOR(),
-      lineWidth: LineWidth.Thin,
+      lineWidth: LineWidth.Four,
     },
     shape: {
       color: DEFAULT_SHAPE_TEXT_COLOR,
       shapeType: ShapeType.Rect,
       fillColor: DEFAULT_SHAPE_FILL_COLOR,
       strokeColor: DEFAULT_SHAPE_STROKE_COLOR,
       strokeStyle: StrokeStyle.Solid,
-      strokeWidth: LineWidth.LINE_WIDTH_TWO,
+      strokeWidth: LineWidth.Two,
       shapeStyle: ShapeStyle.General,
       filled: true,
       radius: 0,