From ae08a381426d6583fb51f4fa7a42abad6e4efba7 Mon Sep 17 00:00:00 2001 From: Noah Onyejese <129368606+noahonyejese@users.noreply.github.com> Date: Thu, 30 Jan 2025 08:20:09 +0100 Subject: [PATCH] fix: changed naming & adjusted api calls --- app/config-types.ts | 6 ++- app/db/palettes.ts | 4 +- app/palettes.ts | 77 ++++++++++++++++++++++------------- app/prisma/schema.prisma | 2 +- app/server/user-controller.ts | 4 -- 5 files changed, 55 insertions(+), 38 deletions(-) diff --git a/app/config-types.ts b/app/config-types.ts index 712a379dc..f8c59bc23 100644 --- a/app/config-types.ts +++ b/app/config-types.ts @@ -553,7 +553,8 @@ export const convertPaletteTypeToDBType = ( case "categorical": return "CATEGORICAL"; default: - return "CATEGORICAL"; + const _exhaustiveCheck: never = type; + return _exhaustiveCheck; } }; @@ -568,7 +569,8 @@ export const convertDBTypeToPaletteType = ( case "CATEGORICAL": return "categorical"; default: - return "categorical"; + const _exhaustiveCheck: never = type; + return _exhaustiveCheck; } }; diff --git a/app/db/palettes.ts b/app/db/palettes.ts index 2d5cc8cd2..f07f9b949 100644 --- a/app/db/palettes.ts +++ b/app/db/palettes.ts @@ -30,7 +30,7 @@ export const createPaletteForUser = async ( }; export const getPalettesForUser = async ( - user_id: number + user_id?: number ): Promise => { const palettes = await prisma.palette.findMany({ where: { @@ -49,7 +49,7 @@ export const getPalettesForUser = async ( }; export const deletePaletteForUser = async (paletteId: string) => { - return await prisma.palette.delete({ + await prisma.palette.delete({ where: { paletteId, }, diff --git a/app/palettes.ts b/app/palettes.ts index 1e8936987..01cacca3d 100644 --- a/app/palettes.ts +++ b/app/palettes.ts @@ -26,7 +26,6 @@ import { schemeSet3, schemeTableau10, } from "d3-scale-chromatic"; -import { nanoid } from "nanoid"; import { hasDimensionColors } from "./charts/shared/colors"; import { @@ -37,6 +36,7 @@ import { SequentialPaletteType, } from "./config-types"; import { Component } from "./domain/data"; +import { createColorId } from "./utils/color-palette-utils"; // Colors export const getDefaultCategoricalPaletteId = ( @@ -149,7 +149,7 @@ export const categoricalPalettes: Array = [ export const DEFAULT_CATEGORICAL_PALETTE_ID = categoricalPalettes[0].value; -type Palette = { +export type Palette = { label: string; value: T; interpolator: (t: number) => string; @@ -232,43 +232,57 @@ const MIN_SATURATION = 0.15; const MAX_LIGHTNESS = 0.95; type InterpolationOptions = { - midColor?: string; + midColorHex?: string; }; type InterpolatorResult = { interpolator: (t: number) => string; - startingColor?: string; + startingColorHex?: string; }; -export const createSequentialInterpolator = ( - endColor: string, - startColor?: string -): InterpolatorResult => { - const endHsl = hsl(endColor); - const startHsl = startColor - ? hsl(startColor) +type SequentialInterpolatorProps = { + endColorHex: string; + startColorHex?: string; +}; + +type DivergingInterpolatorProps = { + endColorHex: string; + startColorHex: string; + options?: InterpolationOptions; +}; + +export const createSequentialInterpolator = ({ + endColorHex, + startColorHex, +}: SequentialInterpolatorProps): InterpolatorResult => { + const endHsl = hsl(endColorHex); + const startHsl = startColorHex + ? hsl(startColorHex) : hsl( endHsl.h, Math.max(MIN_SATURATION, endHsl.s * 0.3), Math.min(MAX_LIGHTNESS, endHsl.l + LIGHTNESS_INCREASE) ); + const startColorRgb = startHsl.toString(); + const startingColorHex = rgbToHex(startColorRgb); + return { - interpolator: interpolateRgb(startHsl.toString(), endColor), - startingColor: rgbToHex(startHsl.toString()), + interpolator: interpolateRgb(startingColorHex, endColorHex), + startingColorHex, }; }; -export const createDivergingInterpolator = ( - startColor: string, - endColor: string, - options: InterpolationOptions = {} -): InterpolatorResult => { - const { midColor } = options; +export const createDivergingInterpolator = ({ + startColorHex, + endColorHex, + options = {}, +}: DivergingInterpolatorProps): InterpolatorResult => { + const { midColorHex } = options; - if (midColor) { - const leftInterpolator = interpolateRgb(startColor, midColor); - const rightInterpolator = interpolateRgb(midColor, endColor); + if (midColorHex) { + const leftInterpolator = interpolateRgb(startColorHex, midColorHex); + const rightInterpolator = interpolateRgb(midColorHex, endColorHex); return { interpolator: (t: number): string => { @@ -281,7 +295,7 @@ export const createDivergingInterpolator = ( } return { - interpolator: interpolateRgb(startColor, endColor), + interpolator: interpolateRgb(startColorHex, endColorHex), }; }; @@ -296,7 +310,7 @@ export type ColorsByType = { diverging: ColorItem[]; }; -export const defaultColorValues = ( +export const getDefaultColorValues = ( type: CustomPaletteType["type"], colors: string[] ): ColorItem[] => { @@ -304,16 +318,21 @@ export const defaultColorValues = ( switch (type) { case "sequential": - return [{ color: colorExist ? colors[0] : "#000000", id: nanoid(4) }]; + return [ + { color: colorExist ? colors[0] : "#000000", id: createColorId() }, + ]; case "diverging": return [ - { color: colorExist ? colors[0] : "#000000", id: nanoid(4) }, - { color: colorExist ? colors[1] : "#cccccc", id: nanoid(4) }, - { color: colorExist ? colors[2] : "#777777", id: nanoid(4) }, + { color: colorExist ? colors[0] : "#000000", id: createColorId() }, + { color: colorExist ? colors[1] : "#cccccc", id: createColorId() }, + { color: colorExist ? colors[2] : "#777777", id: createColorId() }, ]; case "categorical": return colorExist - ? colors.map((color) => ({ color, id: nanoid(4) })) + ? colors.map((color) => ({ color, id: createColorId() })) : []; + default: + const _exhaustiveCheck: never = type; + return _exhaustiveCheck; } }; diff --git a/app/prisma/schema.prisma b/app/prisma/schema.prisma index 93fea1733..70075e56a 100644 --- a/app/prisma/schema.prisma +++ b/app/prisma/schema.prisma @@ -68,7 +68,7 @@ enum PALETTE_TYPE { model Palette { paletteId String @id @default(uuid()) name String @unique @db.VarChar(100) - type PALETTE_TYPE @default(CATEGORICAL) + type PALETTE_TYPE colors String[] created_at DateTime @default(now()) @db.Timestamp(6) updated_at DateTime @default(now()) @db.Timestamp(6) diff --git a/app/server/user-controller.ts b/app/server/user-controller.ts index 1cb9872db..6728f4989 100644 --- a/app/server/user-controller.ts +++ b/app/server/user-controller.ts @@ -29,10 +29,6 @@ const UserController = controller({ const session = await getServerSession(req, res, nextAuthOptions); const userId = session?.user?.id; - if (!userId) { - return []; - } - return await getPalettesForUser(userId); }, deletePalette: async ({ req }) => {