New components build.

package.components.json

@@ -6,5 +6,19 @@
   "license": "MIT",
   "type": "module",
   "main": "./index.js",
-  "types": "./index.d.ts"
+  "types": "./index.d.ts",
+  "dependencies": {
+    "chart.js": "^4.5.0",
+    "chartjs-adapter-date-fns": "^3.0.0",
+    "colord": "^2.9.2",
+    "jsonwebtoken": "^9.0.2",
+    "lucide-react": "^0.542.0",
+    "pure-rand": "^7.0.1",
+    "react-simple-maps": "^2.3.0",
+    "react-use-measure": "^2.0.4",
+    "react-window": "^1.8.6",
+    "serialize-error": "^12.0.0",
+    "thenby": "^1.3.4",
+    "uuid": "^11.1.0"
+  }
 }

package.json

@@ -112,7 +112,6 @@
     "kafkajs": "^2.1.0",
     "lucide-react": "^0.542.0",
     "maxmind": "^5.0.0",
-    "md5": "^2.3.0",
     "next": "15.5.2",
     "node-fetch": "^3.2.8",
     "npm-run-all": "^4.1.5",

pnpm-lock.yaml

@@ -134,9 +134,6 @@ importers:
       maxmind:
         specifier: ^5.0.0
         version: 5.0.0
-      md5:
-        specifier: ^2.3.0
-        version: 2.3.0
       next:
         specifier: 15.5.2
         version: 15.5.2(@babel/core@7.28.3)(babel-plugin-react-compiler@19.1.0-rc.2)(react-dom@19.1.1(react@19.1.1))(react@19.1.1)
@@ -367,8 +364,6 @@ importers:
         specifier: ^5.9.2
         version: 5.9.2
 
-  dist: {}
-
 packages:
 
   '@ampproject/remapping@2.3.0':
@@ -3229,9 +3224,6 @@ packages:
     resolution: {integrity: sha512-kWWXztvZ5SBQV+eRgKFeh8q5sLuZY2+8WUIzlxWVTg+oGwY14qylx1KbKzHd8P6ZYkAg0xyIDU9JMHhyJMZ1jw==}
     engines: {node: '>=10'}
 
-  charenc@0.0.2:
-    resolution: {integrity: sha512-yrLQ/yVUFXkzg7EDQsPieE/53+0RlaWTs+wBrvW36cyilJ2SaDWfl4Yj7MtLTXleV9uEKefbAGUPv2/iWSooRA==}
-
   chart.js@4.5.0:
     resolution: {integrity: sha512-aYeC/jDgSEx8SHWZvANYMioYMZ2KX02W6f6uVfyteuCGcadDLcYVHdfdygsTQkQ4TKn5lghoojAsPj5pu0SnvQ==}
     engines: {pnpm: '>=8'}
@@ -3443,9 +3435,6 @@ packages:
     resolution: {integrity: sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==}
     engines: {node: '>= 8'}
 
-  crypt@0.0.2:
-    resolution: {integrity: sha512-mCxBlsHFYh9C+HVpiEacem8FEBnMXgU9gy4zmNC+SXAZNB/1idgp/aulFJ4FgCi7GPEVbfyng092GqL2k2rmow==}
-
   css-blank-pseudo@3.0.3:
     resolution: {integrity: sha512-VS90XWtsHGqoM0t4KpH053c4ehxZ2E6HtGI7x68YFV0pTo/QmkV/YFA+NnlvK8guxZVNWGQhVNJGC39Q8XF4OQ==}
     engines: {node: ^12 || ^14 || >=16}
@@ -4596,9 +4585,6 @@ packages:
     resolution: {integrity: sha512-wa56o2/ElJMYqjCjGkXri7it5FbebW5usLw/nPmCMs5DeZ7eziSYZhSmPRn0txqeW4LnAmQQU7FgqLpsEFKM4A==}
     engines: {node: '>= 0.4'}
 
-  is-buffer@1.1.6:
-    resolution: {integrity: sha512-NcdALwpXkTm5Zvvbk7owOUSvVvBKDgKP5/ewfXEznmQFfs4ZRmanOeKBTjRVjka3QFoN6XJ+9F3USqfHqTaU5w==}
-
   is-bun-module@2.0.0:
     resolution: {integrity: sha512-gNCGbnnnnFAUGKeZ9PdbyeGYJqewpmc2aKHUEMO5nQPWU9lOmv7jcmQIv+qHD8fXW6W7qfuCwX4rY9LNRjXrkQ==}
 
@@ -5293,9 +5279,6 @@ packages:
     resolution: {integrity: sha512-ndhnbeQWKuiBU17BJ6cybUnvcyvNXaK+1VM5n9/I7+TIqAYFLDvX1DSoVfE1hgvZfudvAU9Ts1CW5sxYq/M8dA==}
     engines: {node: '>=12', npm: '>=6'}
 
-  md5@2.3.0:
-    resolution: {integrity: sha512-T1GITYmFaKuO91vxyoQMFETst+O71VUPEU3ze5GNzDm0OWdP8v1ziTaAEPUr/3kLsY3Sftgz242A1SetQiDL7g==}
-
   mdn-data@2.0.14:
     resolution: {integrity: sha512-dn6wd0uw5GsdswPFfsgMp5NSB0/aDe6fK94YJV/AJDYXL6HVLWBsxeq7js7Ad+mU2K9LAlwpk6kN2D5mwCPVow==}
 
@@ -10897,8 +10880,6 @@ snapshots:
 
   char-regex@1.0.2: {}
 
-  charenc@0.0.2: {}
-
   chart.js@4.5.0:
     dependencies:
       '@kurkle/color': 0.3.4
@@ -11090,8 +11071,6 @@ snapshots:
       shebang-command: 2.0.0
       which: 2.0.2
 
-  crypt@0.0.2: {}
-
   css-blank-pseudo@3.0.3(postcss@8.5.6):
     dependencies:
       postcss: 8.5.6
@@ -12517,8 +12496,6 @@ snapshots:
       call-bound: 1.0.4
       has-tostringtag: 1.0.2
 
-  is-buffer@1.1.6: {}
-
   is-bun-module@2.0.0:
     dependencies:
       semver: 7.7.2
@@ -13409,12 +13386,6 @@ snapshots:
       mmdb-lib: 3.0.1
       tiny-lru: 11.3.4
 
-  md5@2.3.0:
-    dependencies:
-      charenc: 0.0.2
-      crypt: 0.0.2
-      is-buffer: 1.1.6
-
   mdn-data@2.0.14: {}
 
   mdn-data@2.0.28: {}

src/app/login/LoginForm.tsx

@@ -16,7 +16,7 @@ import { setClientAuthToken } from '@/lib/client';
 import { Logo } from '@/components/icons';
 
 export function LoginForm() {
-  const { formatMessage, labels, getMessage } = useMessages();
+  const { formatMessage, labels } = useMessages();
   const router = useRouter();
   const { mutate, error, isPending } = useUpdateQuery('/auth/login');
 
@@ -37,7 +37,7 @@ export function LoginForm() {
         <Logo />
       </Icon>
       <Heading>umami</Heading>
-      <Form onSubmit={handleSubmit} error={getMessage(error)}>
+      <Form onSubmit={handleSubmit} error={error}>
         <FormField
           label={formatMessage(labels.username)}
           data-test="input-username"

src/components/common/Panel.tsx

@@ -50,7 +50,6 @@ export function Panel({
       borderRadius="3"
       backgroundColor
       position="relative"
-      overflowX="hidden"
       gap
       {...props}
       style={{ ...style, ...(isFullscreen ? fullscreenStyles : {}) }}

src/lib/colors.ts

@@ -1,6 +1,15 @@
-import md5 from 'md5';
-import { THEME_COLORS } from '@/lib/constants';
 import { colord } from 'colord';
+import { THEME_COLORS } from '@/lib/constants';
+
+export function hex6(str: string) {
+  let h = 0x811c9dc5; // FNV-1a 32-bit offset
+  for (let i = 0; i < str.length; i++) {
+    h ^= str.charCodeAt(i);
+    h = (h >>> 0) * 0x01000193; // FNV prime
+  }
+  // use lower 24 bits; pad to 6 hex chars
+  return ((h >>> 0) & 0xffffff).toString(16).padStart(6, '0');
+}
 
 export const pick = (num: number, arr: any[]) => {
   return arr[num % arr.length];
@@ -40,7 +49,7 @@ export function getPastel(color: string, factor: number = 0.5, prefix = '') {
 }
 
 export function getColor(seed: string, min: number = 0, max: number = 255) {
-  const color = md5(seed).substring(0, 6);
+  const color = hex6(seed);
   const { r, g, b } = hex2RGB(color, min, max);
 
   return rgb2Hex(r, g, b);