akanjs 2.1.0-rc.2 → 2.1.0-rc.4

package/client/capacitor.ts

@@ -1,16 +1,145 @@
+export type CapacitorDeviceInfo = {
+  platform: string;
+  isVirtual: boolean;
+  osVersion: string;
+  [key: string]: unknown;
+};
+
+export type CapacitorKeyboardInfo = {
+  keyboardHeight: number;
+};
+
+export type CapacitorPermissionState = "prompt" | "prompt-with-rationale" | "granted" | "denied" | string;
+
+export type CapacitorAppModule = {
+  App: {
+    addListener: (eventName: string, listenerFunc: (...args: unknown[]) => void) => Promise<unknown> | unknown;
+    removeAllListeners: () => Promise<void> | void;
+    getInfo: () => Promise<{ id: string; version: string; build: string; [key: string]: unknown }>;
+  };
+};
+
+export type CapacitorBrowserModule = {
+  Browser: {
+    open: (options: { url: string; presentationStyle?: string }) => Promise<void> | void;
+  };
+};
+
+export type CapacitorCameraModule = {
+  Camera: {
+    checkPermissions: () => Promise<{ camera: CapacitorPermissionState; photos: CapacitorPermissionState }>;
+    requestPermissions: () => Promise<{ camera: CapacitorPermissionState; photos: CapacitorPermissionState }>;
+    getPhoto: (options: Record<string, unknown>) => Promise<{ dataUrl?: string; [key: string]: unknown }>;
+    pickImages: (options: Record<string, unknown>) => Promise<{ photos: unknown[]; [key: string]: unknown }>;
+  };
+  CameraResultType: { DataUrl: string };
+  CameraSource: { Prompt: string; Camera: string; Photos: string };
+};
+
+export type CapacitorContactsModule = {
+  Contacts: {
+    checkPermissions: () => Promise<{ contacts: CapacitorPermissionState }>;
+    requestPermissions: () => Promise<{ contacts: CapacitorPermissionState }>;
+    getContacts: (options: Record<string, unknown>) => Promise<{ contacts: unknown[] }>;
+  };
+};
+
+export type CapacitorCoreModule = {
+  CapacitorCookies: {
+    setCookie: (options: { key: string; value: string; path?: string }) => Promise<void> | void;
+  };
+};
+
+export type CapacitorDeviceModule = {
+  Device: {
+    getInfo: () => Promise<CapacitorDeviceInfo>;
+    getLanguageCode: () => Promise<{ value: string }>;
+  };
+};
+
+export type CapacitorFcmModule = {
+  FCM: {
+    setAutoInit: (options: { enabled: boolean }) => Promise<void> | void;
+    getToken: () => Promise<{ token: string }>;
+  };
+};
+
+export type CapacitorGeolocationModule = {
+  Geolocation: {
+    requestPermissions: () => Promise<{ location: string; coarseLocation: string; [key: string]: string }>;
+    getCurrentPosition: () => Promise<unknown>;
+  };
+};
+
+export type CapacitorHapticsModule = {
+  ImpactStyle: { Light: string; Medium: string; Heavy: string };
+  Haptics: {
+    vibrate: (options: { duration: number }) => Promise<void> | void;
+    impact: (options: { style: string }) => Promise<void> | void;
+    selectionStart: () => Promise<void> | void;
+    selectionChanged: () => Promise<void> | void;
+    selectionEnd: () => Promise<void> | void;
+  };
+};
+
+export type CapacitorKeyboardModule = {
+  Keyboard: {
+    show: () => Promise<void> | void;
+    hide: () => Promise<void> | void;
+    addListener: (eventName: string, listenerFunc: (info: CapacitorKeyboardInfo) => void) => Promise<unknown> | unknown;
+    removeAllListeners: () => Promise<void> | void;
+  };
+};
+
+export type CapacitorPreferencesModule = {
+  Preferences: {
+    get: (options: { key: string }) => Promise<{ value: string | null }>;
+    set: (options: { key: string; value: string }) => Promise<void> | void;
+    remove: (options: { key: string }) => Promise<void> | void;
+  };
+};
+
+export type CapacitorPushNotificationsModule = {
+  PushNotifications: {
+    requestPermissions: () => Promise<{ receive: "granted" | "denied" | string }>;
+    checkPermissions: () => Promise<{ receive: "granted" | "denied" | string }>;
+    register: () => Promise<void> | void;
+  };
+};
+
+export type CapacitorSafeAreaModule = {
+  SafeArea: {
+    getSafeAreaInsets: () => Promise<{ insets: { top: number; bottom: number } }>;
+  };
+};
+
+export type CapacitorUpdaterModule = {
+  CapacitorUpdater: {
+    notifyAppReady: () => Promise<void> | void;
+    getPluginVersion: () => Promise<{ version: string }>;
+    getDeviceId: () => Promise<{ deviceId: string }>;
+    current: () => Promise<{ bundle: { version: string }; native: string }>;
+    getBuiltinVersion: () => Promise<{ version: string }>;
+    download: (options: { url: string; version: string }) => Promise<unknown>;
+    set: (bundle: unknown) => Promise<void> | void;
+  };
+};
+
 type CapacitorModuleMap = {
-  app: typeof import("@capacitor/app");
-  browser: typeof import("@capacitor/browser");
-  camera: typeof import("@capacitor/camera");
-  contacts: typeof import("@capacitor-community/contacts");
-  device: typeof import("@capacitor/device");
-  fcm: typeof import("@capacitor-community/fcm");
-  geolocation: typeof import("@capacitor/geolocation");
-  haptics: typeof import("@capacitor/haptics");
-  keyboard: typeof import("@capacitor/keyboard");
-  pushNotifications: typeof import("@capacitor/push-notifications");
-  safeArea: typeof import("capacitor-plugin-safe-area");
-  updater: typeof import("@capgo/capacitor-updater");
+  app: CapacitorAppModule;
+  browser: CapacitorBrowserModule;
+  camera: CapacitorCameraModule;
+  contacts: CapacitorContactsModule;
+  core: CapacitorCoreModule;
+  device: CapacitorDeviceModule;
+  fcm: CapacitorFcmModule;
+  geolocation: CapacitorGeolocationModule;
+  haptics: CapacitorHapticsModule;
+  keyboard: CapacitorKeyboardModule;
+  preferences: CapacitorPreferencesModule;
+  pushNotifications: CapacitorPushNotificationsModule;
+  safeArea: CapacitorSafeAreaModule;
+  updater: CapacitorUpdaterModule;
 };
 
 type CapacitorImportCache = Partial<{
@@ -40,29 +169,58 @@ const loadCapacitorModule = <K extends keyof CapacitorModuleMap>(
   return loaded;
 };
 
-export const loadCapacitorApp = () => loadCapacitorModule("app", () => import("@capacitor/app"));
+const importNativeModule = <T>(specifier: string) => import(specifier) as Promise<T>;
+
+const capacitorPackage = (name: string) => `@capacitor/${name}`;
 
-export const loadCapacitorBrowser = () => loadCapacitorModule("browser", () => import("@capacitor/browser"));
+const capacitorCommunityPackage = (name: string) => `@capacitor-community/${name}`;
 
-export const loadCapacitorCamera = () => loadCapacitorModule("camera", () => import("@capacitor/camera"));
+export const loadCapacitorApp = () =>
+  loadCapacitorModule("app", () => importNativeModule<CapacitorAppModule>(capacitorPackage("app")));
+
+export const loadCapacitorBrowser = () =>
+  loadCapacitorModule("browser", () => importNativeModule<CapacitorBrowserModule>(capacitorPackage("browser")));
+
+export const loadCapacitorCamera = () =>
+  loadCapacitorModule("camera", () => importNativeModule<CapacitorCameraModule>(capacitorPackage("camera")));
 
 export const loadCapacitorContacts = () =>
-  loadCapacitorModule("contacts", () => import("@capacitor-community/contacts"));
+  loadCapacitorModule("contacts", () =>
+    importNativeModule<CapacitorContactsModule>(capacitorCommunityPackage("contacts")),
+  );
 
-export const loadCapacitorDevice = () => loadCapacitorModule("device", () => import("@capacitor/device"));
+export const loadCapacitorCore = () =>
+  loadCapacitorModule("core", () => importNativeModule<CapacitorCoreModule>(capacitorPackage("core")));
 
-export const loadCapacitorFcm = () => loadCapacitorModule("fcm", () => import("@capacitor-community/fcm"));
+export const loadCapacitorDevice = () =>
+  loadCapacitorModule("device", () => importNativeModule<CapacitorDeviceModule>(capacitorPackage("device")));
+
+export const loadCapacitorFcm = () =>
+  loadCapacitorModule("fcm", () => importNativeModule<CapacitorFcmModule>(capacitorCommunityPackage("fcm")));
 
 export const loadCapacitorGeolocation = () =>
-  loadCapacitorModule("geolocation", () => import("@capacitor/geolocation"));
+  loadCapacitorModule("geolocation", () =>
+    importNativeModule<CapacitorGeolocationModule>(capacitorPackage("geolocation")),
+  );
+
+export const loadCapacitorHaptics = () =>
+  loadCapacitorModule("haptics", () => importNativeModule<CapacitorHapticsModule>(capacitorPackage("haptics")));
 
-export const loadCapacitorHaptics = () => loadCapacitorModule("haptics", () => import("@capacitor/haptics"));
+export const loadCapacitorKeyboard = () =>
+  loadCapacitorModule("keyboard", () => importNativeModule<CapacitorKeyboardModule>(capacitorPackage("keyboard")));
 
-export const loadCapacitorKeyboard = () => loadCapacitorModule("keyboard", () => import("@capacitor/keyboard"));
+export const loadCapacitorPreferences = () =>
+  loadCapacitorModule("preferences", () =>
+    importNativeModule<CapacitorPreferencesModule>(capacitorPackage("preferences")),
+  );
 
 export const loadCapacitorPushNotifications = () =>
-  loadCapacitorModule("pushNotifications", () => import("@capacitor/push-notifications"));
+  loadCapacitorModule("pushNotifications", () =>
+    importNativeModule<CapacitorPushNotificationsModule>(capacitorPackage("push-notifications")),
+  );
 
-export const loadCapacitorSafeArea = () => loadCapacitorModule("safeArea", () => import("capacitor-plugin-safe-area"));
+export const loadCapacitorSafeArea = () =>
+  loadCapacitorModule("safeArea", () => importNativeModule<CapacitorSafeAreaModule>("capacitor-plugin-safe-area"));
 
-export const loadCapacitorUpdater = () => loadCapacitorModule("updater", () => import("@capgo/capacitor-updater"));
+export const loadCapacitorUpdater = () =>
+  loadCapacitorModule("updater", () => importNativeModule<CapacitorUpdaterModule>("@capgo/capacitor-updater"));

package/client/cookie.ts

@@ -2,6 +2,7 @@ import { getEnv } from "akanjs/base";
 import { decodeJwtPayload, Logger } from "akanjs/common";
 import type { Account } from "akanjs/fetch";
 import { requestStorage } from "akanjs/fetch";
+import { loadCapacitorCore } from "./capacitor";
 import { storage } from "./storage";
 import { fetch } from "./useClient";
 
@@ -42,11 +43,18 @@ export const setCookie = (
   value: string,
   options: CookieOptions = { path: "/", sameSite: "none", secure: true },
 ) => {
-  if (getEnv().side === "server") return;
-  else
-    void import("@capacitor/core").then(({ CapacitorCookies }) =>
-      CapacitorCookies.setCookie({ key, value, path: options.path }),
-    );
+  const env = getEnv();
+  if (env.side === "server") return;
+  const encoded = `${key}=${value}`;
+  const path = options.path ? `; path=${options.path}` : "";
+  const sameSite = options.sameSite ? `; SameSite=${options.sameSite}` : "";
+  const secure = options.secure ? "; Secure" : "";
+  
+  document.cookie = `${encoded}${path}${sameSite}${secure}`;
+  if (env.renderMode !== "csr") return;
+  void loadCapacitorCore()
+    .then(({ CapacitorCookies }) => CapacitorCookies.setCookie({ key, value, path: options.path }))
+    .catch(() => undefined);
 };
 
 export const getCookie = (key: string): string | undefined => {
@@ -61,6 +69,7 @@ export const getCookie = (key: string): string | undefined => {
 export const removeCookie = (key: string, options: { path: string } = { path: "/" }) => {
   if (getEnv().side === "server") return cookies().delete(key);
   else {
+    
     document.cookie = `${key}=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;`;
   }
 };

package/client/device.ts

@@ -1,19 +1,82 @@
 "use client";
-import type { DeviceInfo } from "@capacitor/device";
-import type { KeyboardInfo } from "@capacitor/keyboard";
 import type { RefObject } from "react";
-import { isMobile } from "react-device-detect";
-import { loadCapacitorDevice, loadCapacitorHaptics, loadCapacitorKeyboard, loadCapacitorSafeArea } from "./capacitor";
+import type {
+  CapacitorDeviceInfo,
+  CapacitorHapticsModule,
+  CapacitorKeyboardInfo,
+  CapacitorKeyboardModule,
+} from "./capacitor";
+
+type DeviceInfo = CapacitorDeviceInfo;
+type Keyboard = CapacitorKeyboardModule["Keyboard"];
+type Haptics = CapacitorHapticsModule["Haptics"];
+type ImpactStyle = CapacitorHapticsModule["ImpactStyle"];
+type ProcessEnvLike = { env?: Record<string, string | undefined> };
+
+const globalWithProcess = globalThis as typeof globalThis & { process?: ProcessEnvLike };
 
 interface DeviceInitOption {
   lang: string;
   info: DeviceInfo;
   topSafeArea: number;
   bottomSafeArea: number;
-  keyboard: Awaited<ReturnType<typeof loadCapacitorKeyboard>>["Keyboard"];
-  haptics: Awaited<ReturnType<typeof loadCapacitorHaptics>>["Haptics"];
-  impactStyle: Awaited<ReturnType<typeof loadCapacitorHaptics>>["ImpactStyle"];
+  keyboard: Keyboard;
+  haptics: Haptics;
+  impactStyle: ImpactStyle;
 }
+
+const noopKeyboard: Keyboard = {
+  show: async () => undefined,
+  hide: async () => undefined,
+  addListener: async () => undefined,
+  removeAllListeners: async () => undefined,
+};
+
+const noopHaptics: Haptics = {
+  vibrate: async () => undefined,
+  impact: async () => undefined,
+  selectionStart: async () => undefined,
+  selectionChanged: async () => undefined,
+  selectionEnd: async () => undefined,
+};
+
+const noopImpactStyle: ImpactStyle = {
+  Light: "light",
+  Medium: "medium",
+  Heavy: "heavy",
+};
+
+const getRenderMode = () => globalWithProcess.process?.env?.AKAN_PUBLIC_RENDER_ENV ?? "csr";
+
+const getBrowserLanguage = () => globalThis.navigator?.language?.split("-")[0] ?? "en";
+
+export const isMobileDevice = () => {
+  if (typeof navigator === "undefined") return false;
+  if (typeof window !== "undefined" && window.matchMedia?.("(hover: none) and (pointer: coarse)")?.matches) return true;
+  return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
+};
+
+const createWebDevice = ({
+  lang,
+  supportLanguages,
+}: {
+  lang?: string;
+  supportLanguages: string[] | readonly string[];
+}) => {
+  const pathname = typeof window === "undefined" ? "" : window.location.pathname;
+  const predefinedLangPath = pathname.split("/")[1]?.split("?")[0];
+  const predefinedLang = supportLanguages.find((language) => language === predefinedLangPath);
+  return new Device({
+    lang: lang ?? predefinedLang ?? getBrowserLanguage(),
+    info: { platform: "web", isVirtual: false, osVersion: "" },
+    topSafeArea: 0,
+    bottomSafeArea: 0,
+    keyboard: noopKeyboard,
+    haptics: noopHaptics,
+    impactStyle: noopImpactStyle,
+  });
+};
+
 /** Capacitor-aware device helper for platform info, safe areas, keyboard, haptics, and scroll state. */
 export class Device {
   static instance: Device | null = null;
@@ -25,6 +88,14 @@ export class Device {
     supportLanguages?: string[] | readonly string[];
   }) {
     if (Device.instance) return Device.instance;
+    if (getRenderMode() !== "csr") {
+      const device = createWebDevice({ lang, supportLanguages });
+      Device.instance = device;
+      return device;
+    }
+    const { loadCapacitorDevice, loadCapacitorHaptics, loadCapacitorKeyboard, loadCapacitorSafeArea } = await import(
+      "./capacitor"
+    );
     const [{ Device: CapacitorDevice }, { Keyboard }, { Haptics, ImpactStyle }, { SafeArea }] = await Promise.all([
       loadCapacitorDevice(),
       loadCapacitorKeyboard(),
@@ -61,7 +132,7 @@ export class Device {
   lang: string;
   topSafeArea: number;
   bottomSafeArea: number;
-  isMobile = isMobile;
+  isMobile = isMobileDevice();
   #keyboard: DeviceInitOption["keyboard"];
   #haptics: DeviceInitOption["haptics"];
   #impactStyle: DeviceInitOption["impactStyle"];
@@ -89,10 +160,10 @@ export class Device {
   }
   listenKeyboardChanged(onKeyboardChanged: (height: number) => void) {
     if (this.info.platform === "web") return;
-    void this.#keyboard.addListener("keyboardWillShow", (keyboard: KeyboardInfo) => {
+    void this.#keyboard.addListener("keyboardWillShow", (keyboard: CapacitorKeyboardInfo) => {
       onKeyboardChanged(keyboard.keyboardHeight);
     });
-    void this.#keyboard.addListener("keyboardDidShow", (keyboard: KeyboardInfo) => {
+    void this.#keyboard.addListener("keyboardDidShow", (keyboard: CapacitorKeyboardInfo) => {
       onKeyboardChanged(keyboard.keyboardHeight);
     });
     void this.#keyboard.addListener("keyboardWillHide", () => {

package/client/index.ts

@@ -1,4 +1,3 @@
-export * from "./capacitor";
 export * from "./clientRuntime";
 export * from "./cookie";
 export * from "./createFont";

package/client/storage.ts

@@ -1,33 +1,57 @@
 import { getEnv } from "akanjs/base";
+import { loadCapacitorPreferences } from "./capacitor";
+
+const getLocalStorageItem = (key: string) => localStorage.getItem(key);
+
+const setLocalStorageItem = (key: string, value: string) => {
+  localStorage.setItem(key, value);
+};
+
+const removeLocalStorageItem = (key: string) => {
+  localStorage.removeItem(key);
+};
 
 export const storage = {
   getItem: async (key: string) => {
-    if (getEnv().side === "server") return;
-    if (getEnv().renderMode === "ssr") return localStorage.getItem(key);
-    else {
-      const { Preferences } = await import("@capacitor/preferences");
+    const env = getEnv();
+    if (env.side === "server") return;
+    if (env.renderMode === "ssr") return getLocalStorageItem(key);
+    try {
+      const { Preferences } = await loadCapacitorPreferences();
       return (await Preferences.get({ key })).value;
+    } catch {
+      return getLocalStorageItem(key);
     }
   },
   setItem: async (key: string, value: string) => {
-    if (getEnv().side === "server") return;
-    if (getEnv().renderMode === "ssr") {
-      localStorage.setItem(key, value);
+    const env = getEnv();
+    if (env.side === "server") return;
+    if (env.renderMode === "ssr") {
+      setLocalStorageItem(key, value);
       return;
-    } else {
-      const { Preferences } = await import("@capacitor/preferences");
+    }
+    try {
+      const { Preferences } = await loadCapacitorPreferences();
       await Preferences.set({ key, value });
       return;
+    } catch {
+      setLocalStorageItem(key, value);
+      return;
     }
   },
   removeItem: async (key: string) => {
-    if (getEnv().side === "server") return;
-    if (getEnv().renderMode === "ssr") {
-      localStorage.removeItem(key);
+    const env = getEnv();
+    if (env.side === "server") return;
+    if (env.renderMode === "ssr") {
+      removeLocalStorageItem(key);
       return;
-    } else {
-      const { Preferences } = await import("@capacitor/preferences");
+    }
+    try {
+      const { Preferences } = await loadCapacitorPreferences();
       return Preferences.remove({ key });
+    } catch {
+      removeLocalStorageItem(key);
+      return;
     }
   },
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "akanjs",
-  "version": "2.1.0-rc.2",
+  "version": "2.1.0-rc.4",
   "sourceType": "module",
   "type": "module",
   "publishConfig": {
@@ -90,6 +90,11 @@
       "import": "./client/index.ts",
       "default": "./client/index.ts"
     },
+    "./client/capacitor": {
+      "types": "./types/client/capacitor.d.ts",
+      "import": "./client/capacitor.ts",
+      "default": "./client/capacitor.ts"
+    },
     "./webkit": {
       "types": "./types/webkit/index.d.ts",
       "import": "./webkit/index.ts",
@@ -173,15 +178,12 @@
     "cordova-plugin-purchase": "^13.16.0",
     "croner": "^10.0.1",
     "daisyui": "^5.5.20",
-    "file-saver": "^2.0.5",
     "ioredis": "^5.10.1",
     "mermaid": "^11.15.0",
     "postgres": "^3.4.9",
     "protobufjs": "^8.4.0",
     "react": "19.2.6",
-    "react-copy-to-clipboard": "^5.1.1",
     "react-datepicker": "^9.1.0",
-    "react-device-detect": "^2.2.3",
     "react-dom": "19.2.6",
     "react-icons": "^5.6.0",
     "react-refresh": "^0.18.0",
@@ -266,9 +268,6 @@
     "daisyui": {
       "optional": true
     },
-    "file-saver": {
-      "optional": true
-    },
     "ioredis": {
       "optional": true
     },
@@ -284,15 +283,9 @@
     "react": {
       "optional": true
     },
-    "react-copy-to-clipboard": {
-      "optional": true
-    },
     "react-datepicker": {
       "optional": true
     },
-    "react-device-detect": {
-      "optional": true
-    },
     "react-dom": {
       "optional": true
     },

package/server/di/predefinedAdaptor.ts

@@ -14,7 +14,7 @@ import {
   type LoggingAdaptor,
   LoggingAdaptorRole,
   PostgresDatabase,
-  ProtobufCompressor,
+  JsonCompressor,
   type QueueAdaptor,
   QueueAdaptorRole,
   RedisCache,
@@ -62,7 +62,7 @@ export const predefinedAdaptor = {
   schedule: Scheduler,
   logging: ConsoleLogger,
   websocket: SolidPubSub,
-  compress: ProtobufCompressor,
+  compress: JsonCompressor,
 };
 
 export const getPredefinedAdaptor = (mode: DatabaseMode = "single"): PredefinedAdaptor => {