linter fixes

coinbase · Dec 2, 2024 · aac49cc · aac49cc
1 parent 3d8603a
commit aac49cc
Show file tree

Hide file tree

Showing 10 changed files with 68 additions and 61 deletions.
diff --git a/src/internal/components/QrCode/QrCodeSvg.tsx b/src/internal/components/QrCode/QrCodeSvg.tsx
@@ -59,7 +59,9 @@ export function QRCodeSVG({
   const { linearColors } = useLinearGradient();
   const isRadialGradient = gradientType === 'radial';
   const fillColor = isRadialGradient ? 'url(#radialGrad)' : 'black';
-  const bgColor = isRadialGradient ? backgroundColor : `url(#${gradientType}Grad)`;
+  const bgColor = isRadialGradient
+    ? backgroundColor
+    : `url(#${gradientType}Grad)`;
   const gradientRadiusMax = size * 0.55;
   const gradientRadiusMin = logoSize / 2;
   const gradientCenterPoint = size / 2;
@@ -76,7 +78,12 @@ export function QRCodeSVG({
   const { x: x2, y: y2 } = GRADIENT_END_COORDINATES;
 
   const viewBox = useMemo(() => {
-    return [-quietZone, -quietZone, size + quietZone * 2, size + quietZone * 2].join(' ');
+    return [
+      -quietZone,
+      -quietZone,
+      size + quietZone * 2,
+      size + quietZone * 2,
+    ].join(' ');
   }, [quietZone, size]);
 
   const svgLogo = useLogo({
@@ -97,20 +104,16 @@ export function QRCodeSVG({
     hasLogo: !!logo,
   });
 
-  // const growGradient = useCallback(() => {
-  //   Animated.timing(gradientAnim, {
-  //     toValue: gradientRadiusMax,
-  //     duration: durations.slow4 * 2,
-  //     useNativeDriver: false,
-  //     easing: Easing.bezier(...curves.enterExpressive),
-  //   }).start();
-  // }, [gradientAnim, gradientRadiusMax]);
-
   useEffect(() => {
     if (isAsyncDataFetched && gradientRadius === gradientRadiusMin) {
       setGradientRadius(gradientRadiusMax);
     }
-  }, [isAsyncDataFetched, gradientRadius, gradientRadiusMin, gradientRadiusMax]);
+  }, [
+    isAsyncDataFetched,
+    gradientRadius,
+    gradientRadiusMin,
+    gradientRadiusMax,
+  ]);
 
   console.log({ value, path, color, isRadialGradient, bgColor, fillColor });
 

diff --git a/src/internal/components/QrCode/useCorners.tsx b/src/internal/components/QrCode/useCorners.tsx
@@ -72,7 +72,14 @@ export function useCorners(
         />
       </g>
     ),
-    [backgroundColor, circleRadius, circleStrokeWidth, fillColor, rectSize, size],
+    [
+      backgroundColor,
+      circleRadius,
+      circleStrokeWidth,
+      fillColor,
+      rectSize,
+      size,
+    ],
   );
   return corners;
 }
diff --git a/src/internal/components/QrCode/useLinearGradient.ts b/src/internal/components/QrCode/useLinearGradient.ts
@@ -1,11 +1,6 @@
 import { useMemo } from 'react';
-// import { MiamiThemeColorPreference } from 'cb-wallet-data/stores/ThemeColors/themeColorConfigs';
-// import { PartialPaletteConfig, usePaletteConfig, useSpectrum } from '@cbhq/cds-common';
-
-// import { useThemeColorPreference } from ':rn/app/hooks/useThemeColorPreference';
-import { useTheme } from '../../../useTheme';
 import { background } from '../../../styles/theme';
-
+import { useTheme } from '../../../useTheme';
 import { linearGradientStops } from './gradientConstants';
 
 export function useLinearGradient() {

diff --git a/src/internal/components/QrCode/useLogo.tsx b/src/internal/components/QrCode/useLogo.tsx
@@ -38,7 +38,12 @@ export function useLogo({
             />
           </clipPath>
           <clipPath id="clip-logo">
-            <rect width={logoSize} height={logoSize} rx={logoBorderRadius} ry={logoBorderRadius} />
+            <rect
+              width={logoSize}
+              height={logoSize}
+              rx={logoBorderRadius}
+              ry={logoBorderRadius}
+            />
           </clipPath>
         </defs>
         <g>

diff --git a/src/internal/components/QrCode/useMatrix.ts b/src/internal/components/QrCode/useMatrix.ts
@@ -1,7 +1,10 @@
-import { useMemo } from 'react';
 import QRCode from 'qrcode';
+import { useMemo } from 'react';
 
-export function useMatrix(value: string, errorCorrectionLevel: 'L' | 'M' | 'Q' | 'H') {
+export function useMatrix(
+  value: string,
+  errorCorrectionLevel: 'L' | 'M' | 'Q' | 'H',
+) {
   const matrix = useMemo(() => {
     const arr = Array.prototype.slice.call(
       QRCode.create(value, { errorCorrectionLevel }).modules.data,
@@ -10,7 +13,9 @@ export function useMatrix(value: string, errorCorrectionLevel: 'L' | 'M' | 'Q' |
     const sqrt = Math.sqrt(arr.length);
     return arr.reduce(
       (rows, key, index) =>
-        (index % sqrt === 0 ? rows.push([key]) : rows[rows.length - 1].push(key)) && rows,
+        (index % sqrt === 0
+          ? rows.push([key])
+          : rows[rows.length - 1].push(key)) && rows,
       [],
     );
   }, [errorCorrectionLevel, value]);

diff --git a/src/internal/components/QrCode/usePresetGradientForColor.ts b/src/internal/components/QrCode/usePresetGradientForColor.ts
@@ -42,32 +42,6 @@ function isInRange(x: number, min: number, max: number) {
   return x >= min && x <= max;
 }
 
-// function useHueToGradient(hueDegree: number) {
-//   const gradient = useMemo(() => {
-//     if (isInRange(hueDegree, 0, 30) || isInRange(hueDegree, 333, 360)) {
-//       return presetGradients.red;
-//     }
-//     if (isInRange(hueDegree, 30, 85)) {
-//       return presetGradients.yellow;
-//     }
-//     if (isInRange(hueDegree, 85, 165)) {
-//       return presetGradients.green;
-//     }
-//     if (isInRange(hueDegree, 165, 210)) {
-//       return presetGradients.cyan;
-//     }
-//     if (isInRange(hueDegree, 210, 256)) {
-//       return presetGradients.blue;
-//     }
-//     if (isInRange(hueDegree, 256, 333)) {
-//       return presetGradients.magenta;
-//     }
-
-//     return presetGradients.default;
-//   }, [hueDegree]);
-//   return gradient;
-// }
-
 function useHueToGradient(hueDegree: number) {
   const gradient = useMemo(() => {
     const hueRanges = [
@@ -81,8 +55,8 @@ function useHueToGradient(hueDegree: number) {
     ];
 
     return (
-      hueRanges.find(({ min, max }) => isInRange(hueDegree, min, max))?.gradient ??
-      presetGradients.default
+      hueRanges.find(({ min, max }) => isInRange(hueDegree, min, max))
+        ?.gradient ?? presetGradients.default
     );
   }, [hueDegree]);
   return gradient;
@@ -101,7 +75,12 @@ export function usePresetGradientForColor(color?: string) {
     }
 
     // default if undefined, near black, near white, or near grey
-    if (!color || colorInfo.l < 0.1 || colorInfo.l > 0.9 || colorInfo.s < 0.05) {
+    if (
+      !color ||
+      colorInfo.l < 0.1 ||
+      colorInfo.l > 0.9 ||
+      colorInfo.s < 0.05
+    ) {
       return presetGradients.default;
     }
 

diff --git a/src/wallet/components/Wallet.tsx b/src/wallet/components/Wallet.tsx
@@ -1,9 +1,9 @@
 import { useEffect, useRef } from 'react';
-import { useIsMounted } from '../../useIsMounted';
-import type { WalletReact } from '../types';
-import { useWalletContext, WalletProvider } from './WalletProvider';
 import { cn } from '../../styles/theme';
+import { useIsMounted } from '../../useIsMounted';
 import { useTheme } from '../../useTheme';
+import type { WalletReact } from '../types';
+import { WalletProvider, useWalletContext } from './WalletProvider';
 
 function WalletContent({ children, className }: WalletReact) {
   const componentTheme = useTheme();

diff --git a/src/wallet/components/island/WalletIsland.tsx b/src/wallet/components/island/WalletIsland.tsx
@@ -5,8 +5,8 @@ import { useTheme } from '../../../useTheme';
 import type { WalletIslandProps } from '../../types';
 import { useWalletContext } from '../WalletProvider';
 import {
-  useWalletIslandContext,
   WalletIslandProvider,
+  useWalletIslandContext,
 } from './WalletIslandProvider';
 import { WalletIslandQrReceive } from './WalletIslandQrReceive';
 

diff --git a/src/wallet/components/island/WalletIslandProvider.tsx b/src/wallet/components/island/WalletIslandProvider.tsx
@@ -1,4 +1,11 @@
-import { createContext, type Dispatch, type ReactNode, type SetStateAction, useContext, useState } from 'react';
+import {
+  type Dispatch,
+  type ReactNode,
+  type SetStateAction,
+  createContext,
+  useContext,
+  useState,
+} from 'react';
 import { useValue } from '../../../internal/hooks/useValue';
 
 export type WalletIslandContextType = {
@@ -12,7 +19,9 @@ type WalletIslandProviderReact = {
   children: ReactNode;
 };
 
-const WalletIslandContext = createContext<WalletIslandContextType>({} as WalletIslandContextType);
+const WalletIslandContext = createContext<WalletIslandContextType>(
+  {} as WalletIslandContextType,
+);
 
 export function WalletIslandProvider({ children }: WalletIslandProviderReact) {
   const [showSwap, setShowSwap] = useState(false);
@@ -25,7 +34,11 @@ export function WalletIslandProvider({ children }: WalletIslandProviderReact) {
     setShowQr,
   });
 
-  return <WalletIslandContext.Provider value={value}>{children}</WalletIslandContext.Provider>;
+  return (
+    <WalletIslandContext.Provider value={value}>
+      {children}
+    </WalletIslandContext.Provider>
+  );
 }
 
 export function useWalletIslandContext() {

diff --git a/src/wallet/components/island/WalletIslandQrReceive.tsx b/src/wallet/components/island/WalletIslandQrReceive.tsx
@@ -1,10 +1,10 @@
 import { useCallback } from 'react';
+import { QRCodeComponent } from '../../../internal/components/QrCode/QrCode';
 import { backArrowSvg } from '../../../internal/svg/backArrowSvg';
 import { copySvg } from '../../../internal/svg/copySvg';
-import { useWalletIslandContext } from './WalletIslandProvider';
 import { border, cn, color, pressable, text } from '../../../styles/theme';
 import { useWalletContext } from '../WalletProvider';
-import { QRCodeComponent } from '../../../internal/components/QrCode/QrCode';
+import { useWalletIslandContext } from './WalletIslandProvider';
 
 export function WalletIslandQrReceive() {
   const { address } = useWalletContext();