Start on plugin ctx API (#64)

src-web/lib/keyValueStore.ts

@@ -17,6 +17,20 @@ export async function setKeyValue<T>({
   });
 }
 
+export async function getKeyValueRaw({
+  namespace = 'global',
+  key,
+}: {
+  namespace?: string;
+  key: string | string[];
+}) {
+  const kv = (await invokeCmd('cmd_get_key_value', {
+    namespace,
+    key: buildKeyValueKey(key),
+  })) as KeyValue | null;
+  return kv;
+}
+
 export async function getKeyValue<T>({
   namespace = 'global',
   key,
@@ -26,14 +40,11 @@ export async function getKeyValue<T>({
   key: string | string[];
   fallback: T;
 }) {
-  const kv = (await invokeCmd('cmd_get_key_value', {
-    namespace,
-    key: buildKeyValueKey(key),
-  })) as KeyValue | null;
+  const kv = await getKeyValueRaw({ namespace, key });
   return extractKeyValueOrFallback(kv, fallback);
 }
 
-function extractKeyValue<T>(kv: KeyValue | null): T | undefined {
+export function extractKeyValue<T>(kv: KeyValue | null): T | undefined {
   if (kv === null) return undefined;
   try {
     return JSON.parse(kv.value) as T;

src-web/lib/models.ts

@@ -36,6 +36,9 @@ export function isResponseLoading(response: HttpResponse | GrpcConnection): bool
 }
 
 export function modelsEq(a: Model, b: Model) {
+  if (a.model != b.model) {
+    return false;
+  }
   if (a.model === 'key_value' && b.model === 'key_value') {
     return a.key === b.key && a.namespace === b.namespace;
   }

src-web/lib/theme/appearance.ts

@@ -1,6 +1,6 @@
 import { getCurrentWebviewWindow } from '@tauri-apps/api/webviewWindow';
 
-type Appearance = 'light' | 'dark';
+export type Appearance = 'light' | 'dark';
 
 export function getCSSAppearance(): Appearance {
   return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';

src-web/lib/theme/window.ts

@@ -310,7 +310,6 @@ export function completeTheme(theme: YaakTheme): YaakTheme {
 
   theme.border = theme.border ?? theme.surface?.lift(0.12);
   theme.borderSubtle = theme.borderSubtle ?? theme.border?.lower(0.08);
-  console.log('HELLO', { theme });
 
   theme.text = theme.text ?? theme.border?.lift(1).lower(0.2);
   theme.textSubtle = theme.textSubtle ?? theme.text?.lower(0.3);

src-web/lib/theme/yaakColor.ts

@@ -104,6 +104,15 @@ export class YaakColor {
     return rgbaToHex(r, g, b, a);
   }
 
+  hexNoAlpha(): string {
+    const h = this.hue;
+    const s = this.saturation;
+    const l = this.lightness;
+
+    const [r, g, b] = parseColor(`hsl(${h},${s}%,${l}%)`).rgb;
+    return rgbaToHexNoAlpha(r, g, b);
+  }
+
   private _lighten(mod: number): YaakColor {
     const c = this.clone();
     c.lightness = this.lightness + (100 - this.lightness) * mod;
@@ -125,6 +134,14 @@ function rgbaToHex(r: number, g: number, b: number, a: number): string {
   return '#' + [toHex(r), toHex(g), toHex(b), toHex(a * 255)].join('').toUpperCase();
 }
 
+function rgbaToHexNoAlpha(r: number, g: number, b: number): string {
+  const toHex = (n: number): string => {
+    const hex = Number(Math.round(n)).toString(16);
+    return hex.length === 1 ? `0${hex}` : hex;
+  };
+  return '#' + [toHex(r), toHex(g), toHex(b)].join('').toUpperCase();
+}
+
 function hexToRgba(hex: string): [number, number, number, number] {
   const fromHex = (h: string): number => {
     if (h === '') return 255;