Fix build, packages sync, pnpm support

instrumentation.node.ts

@@ -22,7 +22,7 @@ const sdk = new NodeSDK({
     [SEMRESATTRS_SERVICE_VERSION]: process.env.NEXT_PUBLIC_GIT_TAG || process.env.NEXT_PUBLIC_GIT_COMMIT_SHA || 'unknown_version',
     [SEMRESATTRS_SERVICE_INSTANCE_ID]:
         process.env.NEXT_PUBLIC_APP_INSTANCE ||
-        process.env.NEXT_PUBLIC_APP_HOST?.replace('.blockscout.com', '').replaceAll('-', '_') ||
+        process.env.NEXT_PUBLIC_APP_HOST?.replace('.lux.network', '').replaceAll('-', '_') ||
         'unknown_app',
   }),
   spanProcessor: new SimpleSpanProcessor(traceExporter),

nextjs/nextjs-routes.d.ts

@@ -5,6 +5,11 @@
 
 // prettier-ignore
 declare module "nextjs-routes" {
+  import type {
+    GetServerSidePropsContext as NextGetServerSidePropsContext,
+    GetServerSidePropsResult as NextGetServerSidePropsResult
+  } from "nextjs";
+
   export type Route =
     | StaticRoute<"/404">
     | StaticRoute<"/account/api-key">
@@ -100,6 +105,33 @@ declare module "nextjs-routes" {
    * route({ pathname: "/foos/[foo]", query: { foo: "bar" }}) will produce "/foos/bar".
    */
   export declare function route(r: Route): string;
+
+  /**
+   * Nearly identical to GetServerSidePropsContext from next, but further narrows
+   * types based on nextjs-route's route data.
+   */
+  export type GetServerSidePropsContext<
+    Pathname extends Route["pathname"] = Route["pathname"],
+    Preview extends NextGetServerSidePropsContext["previewData"] = NextGetServerSidePropsContext["previewData"]
+  > = Omit<NextGetServerSidePropsContext, 'params' | 'query' | 'defaultLocale' | 'locale' | 'locales'> & {
+    params: Extract<Route, { pathname: Pathname }>["query"];
+    query: Query;
+    defaultLocale?: undefined;
+    locale?: Locale;
+    locales?: undefined;
+  };
+
+  /**
+   * Nearly identical to GetServerSideProps from next, but further narrows
+   * types based on nextjs-route's route data.
+   */
+  export type GetServerSideProps<
+    Props extends { [key: string]: any } = { [key: string]: any },
+    Pathname extends Route["pathname"] = Route["pathname"],
+    Preview extends NextGetServerSideProps["previewData"] = NextGetServerSideProps["previewData"]
+  > = (
+    context: GetServerSidePropsContext<Pathname, Preview>
+  ) => Promise<NextGetServerSidePropsResult<Props>>
 }
 
 // prettier-ignore
@@ -114,13 +146,12 @@ declare module "next/link" {
   } from "react";
   export * from "next/dist/client/link";
 
-  type Query = { query?: { [key: string]: string | string[] | undefined } };
   type StaticRoute = Exclude<Route, { query: any }>["pathname"];
 
   export interface LinkProps
     extends Omit<NextLinkProps, "href" | "locale">,
       AnchorHTMLAttributes<HTMLAnchorElement> {
-    href: Route | StaticRoute | Query;
+    href: Route | StaticRoute | Omit<Route, "pathname">
     locale?: false;
   }
 
@@ -148,7 +179,6 @@ declare module "next/router" {
 
   type NextTransitionOptions = NonNullable<Parameters<Router["push"]>[2]>;
   type StaticRoute = Exclude<Route, { query: any }>["pathname"];
-  type Query = { query?: { [key: string]: string | string[] | undefined } };
 
   interface TransitionOptions extends Omit<NextTransitionOptions, "locale"> {
     locale?: false;
@@ -170,12 +200,12 @@ declare module "next/router" {
         locale?: Locale;
         locales?: undefined;
         push(
-          url: Route | StaticRoute | Query,
+          url: Route | StaticRoute | Omit<Route, "pathname">,
           as?: string,
           options?: TransitionOptions
         ): Promise<boolean>;
         replace(
-          url: Route | StaticRoute | Query,
+          url: Route | StaticRoute | Omit<Route, "pathname">,
           as?: string,
           options?: TransitionOptions
         ): Promise<boolean>;

package.json

@@ -42,7 +42,11 @@
     "@blockscout/bens-types": "1.4.1",
     "@blockscout/stats-types": "2.0.0",
     "@blockscout/visualizer-types": "0.2.0",
+    "@chakra-ui/anatomy": "^2.2.2",
+    "@chakra-ui/lazy-utils": "2.0.5",
     "@chakra-ui/react": "2.7.1",
+    "@chakra-ui/styled-system": "^2.9.2",
+    "@chakra-ui/system": "^2.6.2",
     "@chakra-ui/theme-tools": "^2.0.18",
     "@cloudnouns/kit": "1.1.6",
     "@emotion/react": "^11.10.4",
@@ -137,6 +141,7 @@
     "@types/dom-to-image": "^2.6.4",
     "@types/jest": "^29.2.0",
     "@types/js-cookie": "^3.0.2",
+    "@types/lodash": "^4.17.7",
     "@types/mixpanel-browser": "^2.38.1",
     "@types/node": "20.16.7",
     "@types/phoenix": "^1.5.4",

ui/shared/chart/ChartSelectionX.tsx

@@ -33,31 +33,31 @@ const ChartSelectionX = ({ anchorEl, height, scale, data, onSelect }: Props) =>
   const drawSelection = React.useCallback((x0: number, x1: number) => {
     const diffX = x1 - x0;
 
-    d3.select(ref.current)
-      .attr('opacity', 1);
+    d3.select(ref.current).attr('opacity', 1);
 
-    d3.select(ref.current)
-      .select('.ChartSelectionX__line_left')
-      .attr('x1', x0)
-      .attr('x2', x0);
+    d3.select(ref.current).select('.ChartSelectionX__line_left').attr('x1', x0).attr('x2', x0);
 
-    d3.select(ref.current)
-      .select('.ChartSelectionX__line_right')
-      .attr('x1', x1)
-      .attr('x2', x1);
+    d3.select(ref.current).select('.ChartSelectionX__line_right').attr('x1', x1).attr('x2', x1);
 
-    d3.select(ref.current)
-      .select('.ChartSelectionX__rect')
-      .attr('x', diffX > 0 ? x0 : diffX + x0)
-      .attr('width', Math.abs(diffX));
+    d3.select(ref.current).select('.ChartSelectionX__rect').attr('x', diffX > 0 ? x0 : diffX + x0).attr('width', Math.abs(diffX));
   }, []);
 
   const handleSelect = React.useCallback((x0: number, x1: number) => {
     const startDate = scale.invert(x0);
     const endDate = scale.invert(x1);
 
-    if (Math.abs(dayjs(startDate).diff(endDate, 'day')) > SELECTION_THRESHOLD) {
-      onSelect([ dayjs.min(dayjs(startDate), dayjs(endDate)).toDate(), dayjs.max(dayjs(startDate), dayjs(endDate)).toDate() ]);
+    if (startDate && endDate && Math.abs(dayjs(startDate).diff(endDate, 'day')) > SELECTION_THRESHOLD) {
+      const startDayjs = dayjs(startDate);
+      const endDayjs = dayjs(endDate);
+
+      if (startDayjs.isValid() && endDayjs.isValid()) {
+        const minDate = dayjs.min(startDayjs, endDayjs);
+        const maxDate = dayjs.max(startDayjs, endDayjs);
+
+        if (minDate && maxDate) {
+          onSelect([ minDate.toDate(), maxDate.toDate() ]);
+        }
+      }
     }
   }, [ onSelect, scale ]);
 
@@ -66,14 +66,14 @@ const ChartSelectionX = ({ anchorEl, height, scale, data, onSelect }: Props) =>
     startX.current = undefined;
     endX.current = undefined;
     d3.select(ref.current).attr('opacity', 0);
-  }, [ ]);
+  }, []);
 
   const handelMouseUp = React.useCallback(() => {
     if (!isActive.current) {
       return;
     }
 
-    if (startX.current && endX.current) {
+    if (startX.current !== undefined && endX.current !== undefined) {
       handleSelect(startX.current, endX.current);
     }
 

ui/shared/forms/inputs/file/utils.ts

@@ -53,7 +53,9 @@ async function readEntriesPromise(directoryReader: FileSystemDirectoryReader): P
         reject,
       );
     });
-  } catch (err) {}
+  } catch (err) {
+    return undefined;
+  }
 }
 
 export function convertFileEntryToFile(entry: FileSystemFileEntry, fullFilePath?: boolean): Promise<File> {

ui/shared/forms/inputs/select/utils.ts

@@ -57,17 +57,23 @@ const getChakraStyles: (colorMode: ColorMode) => ChakraStylesConfig<Option> = (c
       py: 0,
       mx: 0,
     }),
-    valueContainer: (provided, state) => ({
-      ...provided,
-      ...getValueContainerStyles(state.selectProps.size),
-      py: 0,
-    }),
-    singleValue: (provided, state) => ({
-      ...provided,
-      mx: 0,
-      transform: 'none',
-      ...getSingleValueStyles(state.selectProps.size),
-    }),
+    valueContainer: (provided, state) => {
+      const size = state.selectProps.size as Size | undefined;
+      return {
+        ...provided,
+        ...getValueContainerStyles(size),
+        py: 0,
+      };
+    },
+    singleValue: (provided, state) => {
+      const size = state.selectProps.size as Size | undefined;
+      return {
+        ...provided,
+        mx: 0,
+        transform: 'none',
+        ...getSingleValueStyles(size),
+      };
+    },
   };
 };