forked from jsnbuchanan/crowd-funder-for-time-pwa
Fix worker-only database architecture and Vue Proxy serialization
- Implement worker-only database access to eliminate double migrations - Add parameter serialization in usePlatformService to prevent Capacitor "object could not be cloned" errors - Fix infinite logging loop with circuit breaker in databaseUtil - Use dynamic imports in WebPlatformService to prevent worker thread errors - Add higher-level database methods (getContacts, getSettings) to composable - Eliminate Vue Proxy objects through JSON serialization and Object.freeze protection Resolves Proxy(Array) serialization failures and worker context conflicts across Web/Capacitor/Electron platforms.
This commit is contained in:
Matthew Raymer
@@ -16,7 +16,10 @@
|
||||
import { Component, Vue, Prop } from "vue-facing-decorator";
|
||||
|
||||
import { AppString, NotificationIface } from "../constants/app";
|
||||
import * as databaseUtil from "../db/databaseUtil";
|
||||
import { MASTER_SETTINGS_KEY } from "../db/tables/settings";
|
||||
import { DEFAULT_ENDORSER_API_SERVER } from "../constants/app";
|
||||
import { usePlatformService } from "../utils/usePlatformService";
|
||||
import { mapColumnsToValues, parseJsonField } from "../db/databaseUtil";
|
||||
|
||||
@Component
|
||||
export default class TopMessage extends Vue {
|
||||
@@ -28,7 +31,7 @@ export default class TopMessage extends Vue {
|
||||
|
||||
async mounted() {
|
||||
try {
|
||||
const settings = await databaseUtil.retrieveSettingsForActiveAccount();
|
||||
const settings = await this.getActiveAccountSettings();
|
||||
if (
|
||||
settings.warnIfTestServer &&
|
||||
settings.apiServer !== AppString.PROD_ENDORSER_API_SERVER
|
||||
@@ -54,5 +57,95 @@ export default class TopMessage extends Vue {
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Get settings for the active account using the platform service composable.
|
||||
* This replaces the direct call to databaseUtil.retrieveSettingsForActiveAccount()
|
||||
* and demonstrates the new composable pattern.
|
||||
*/
|
||||
private async getActiveAccountSettings() {
|
||||
const { dbQuery } = usePlatformService();
|
||||
|
||||
try {
|
||||
// Get default settings first
|
||||
const defaultSettings = await this.getDefaultSettings();
|
||||
|
||||
// If no active DID, return defaults
|
||||
if (!defaultSettings.activeDid) {
|
||||
return defaultSettings;
|
||||
}
|
||||
|
||||
// Get account-specific settings using the composable
|
||||
const result = await dbQuery(
|
||||
"SELECT * FROM settings WHERE accountDid = ?",
|
||||
[defaultSettings.activeDid],
|
||||
);
|
||||
|
||||
if (!result?.values?.length) {
|
||||
return defaultSettings;
|
||||
}
|
||||
|
||||
// Map and filter settings
|
||||
const overrideSettings = mapColumnsToValues(
|
||||
result.columns,
|
||||
result.values,
|
||||
)[0] as any;
|
||||
|
||||
const overrideSettingsFiltered = Object.fromEntries(
|
||||
Object.entries(overrideSettings).filter(([_, v]) => v !== null),
|
||||
);
|
||||
|
||||
// Merge settings
|
||||
const settings = { ...defaultSettings, ...overrideSettingsFiltered };
|
||||
|
||||
// Handle searchBoxes parsing
|
||||
if (settings.searchBoxes) {
|
||||
settings.searchBoxes = parseJsonField(settings.searchBoxes, []);
|
||||
}
|
||||
|
||||
return settings;
|
||||
} catch (error) {
|
||||
console.error(`Failed to retrieve account settings for ${defaultSettings.activeDid}:`, error);
|
||||
return defaultSettings;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Get default settings using the platform service composable
|
||||
*/
|
||||
private async getDefaultSettings() {
|
||||
const { dbQuery } = usePlatformService();
|
||||
|
||||
try {
|
||||
const result = await dbQuery(
|
||||
"SELECT * FROM settings WHERE id = ?",
|
||||
[MASTER_SETTINGS_KEY],
|
||||
);
|
||||
|
||||
if (!result?.values?.length) {
|
||||
return {
|
||||
id: MASTER_SETTINGS_KEY,
|
||||
activeDid: undefined,
|
||||
apiServer: DEFAULT_ENDORSER_API_SERVER,
|
||||
};
|
||||
}
|
||||
|
||||
const settings = mapColumnsToValues(result.columns, result.values)[0] as any;
|
||||
|
||||
// Handle searchBoxes parsing
|
||||
if (settings.searchBoxes) {
|
||||
settings.searchBoxes = parseJsonField(settings.searchBoxes, []);
|
||||
}
|
||||
|
||||
return settings;
|
||||
} catch (error) {
|
||||
console.error("Failed to retrieve default settings:", error);
|
||||
return {
|
||||
id: MASTER_SETTINGS_KEY,
|
||||
activeDid: undefined,
|
||||
apiServer: DEFAULT_ENDORSER_API_SERVER,
|
||||
};
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -169,6 +169,9 @@ export async function retrieveSettingsForActiveAccount(): Promise<Settings> {
|
||||
let lastCleanupDate: string | null = null;
|
||||
export let memoryLogs: string[] = [];
|
||||
|
||||
// Flag to prevent infinite logging loops during database operations
|
||||
let isLoggingToDatabase = false;
|
||||
|
||||
/**
|
||||
* Logs a message to the database with proper handling of concurrent writes
|
||||
* @param message - The message to log
|
||||
@@ -179,36 +182,44 @@ export async function logToDb(
|
||||
message: string,
|
||||
level: string = "info",
|
||||
): Promise<void> {
|
||||
const platform = PlatformServiceFactory.getInstance();
|
||||
const todayKey = new Date().toDateString();
|
||||
// Prevent infinite logging loops - if we're already trying to log to database,
|
||||
// just log to console instead to break circular dependency
|
||||
if (isLoggingToDatabase) {
|
||||
console.log(`[DB-PREVENTED-${level.toUpperCase()}] ${message}`);
|
||||
return;
|
||||
}
|
||||
|
||||
// Set flag to prevent circular logging
|
||||
isLoggingToDatabase = true;
|
||||
|
||||
try {
|
||||
memoryLogs.push(`${new Date().toISOString()} ${message}`);
|
||||
// Insert using actual schema: date, message (no level column)
|
||||
await platform.dbExec("INSERT INTO logs (date, message) VALUES (?, ?)", [
|
||||
todayKey, // Use date string to match schema
|
||||
`[${level.toUpperCase()}] ${message}`, // Include level in message
|
||||
]);
|
||||
const platform = PlatformServiceFactory.getInstance();
|
||||
const todayKey = new Date().toDateString();
|
||||
|
||||
// Clean up old logs (keep only last 7 days) - do this less frequently
|
||||
// Only clean up if the date is different from the last cleanup
|
||||
if (!lastCleanupDate || lastCleanupDate !== todayKey) {
|
||||
const sevenDaysAgo = new Date(
|
||||
new Date().getTime() - 7 * 24 * 60 * 60 * 1000,
|
||||
).toDateString(); // Use date string to match schema
|
||||
memoryLogs = memoryLogs.filter((log) => log.split(" ")[0] > sevenDaysAgo);
|
||||
await platform.dbExec("DELETE FROM logs WHERE date < ?", [sevenDaysAgo]);
|
||||
lastCleanupDate = todayKey;
|
||||
try {
|
||||
memoryLogs.push(`${new Date().toISOString()} ${message}`);
|
||||
// Insert using actual schema: date, message (no level column)
|
||||
await platform.dbExec("INSERT INTO logs (date, message) VALUES (?, ?)", [
|
||||
todayKey, // Use date string to match schema
|
||||
`[${level.toUpperCase()}] ${message}`, // Include level in message
|
||||
]);
|
||||
|
||||
// Clean up old logs (keep only last 7 days) - do this less frequently
|
||||
// Only clean up if the date is different from the last cleanup
|
||||
if (!lastCleanupDate || lastCleanupDate !== todayKey) {
|
||||
const sevenDaysAgo = new Date(
|
||||
new Date().getTime() - 7 * 24 * 60 * 60 * 1000,
|
||||
).toDateString(); // Use date string to match schema
|
||||
memoryLogs = memoryLogs.filter((log) => log.split(" ")[0] > sevenDaysAgo);
|
||||
await platform.dbExec("DELETE FROM logs WHERE date < ?", [sevenDaysAgo]);
|
||||
lastCleanupDate = todayKey;
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error logging to database:", error, " ... for original message:", message);
|
||||
}
|
||||
} catch (error) {
|
||||
// Log to console as fallback
|
||||
// eslint-disable-next-line no-console
|
||||
console.error(
|
||||
"Error logging to database:",
|
||||
error,
|
||||
" ... for original message:",
|
||||
message,
|
||||
);
|
||||
} finally {
|
||||
// Always reset the flag to prevent permanent blocking of database logging
|
||||
isLoggingToDatabase = false;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -217,13 +228,13 @@ export async function logConsoleAndDb(
|
||||
message: string,
|
||||
isError = false,
|
||||
): Promise<void> {
|
||||
const level = isError ? "error" : "info";
|
||||
if (isError) {
|
||||
logger.error(`${new Date().toISOString()}`, message);
|
||||
console.error(message);
|
||||
} else {
|
||||
logger.log(`${new Date().toISOString()}`, message);
|
||||
console.log(message);
|
||||
}
|
||||
await logToDb(message, level);
|
||||
|
||||
await logToDb(message, isError ? "error" : "info");
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
128
src/interfaces/worker-messages.ts
Normal file
128
src/interfaces/worker-messages.ts
Normal file
@@ -0,0 +1,128 @@
|
||||
/**
|
||||
* Worker Message Interface for Database Operations
|
||||
*
|
||||
* Defines the communication protocol between the main thread and the
|
||||
* SQL worker thread for TimeSafari web platform.
|
||||
*
|
||||
* @author Matthew Raymer
|
||||
* @version 1.0.0
|
||||
* @since 2025-07-02
|
||||
*/
|
||||
|
||||
import type { QueryExecResult } from "./database";
|
||||
|
||||
/**
|
||||
* Base interface for all worker messages
|
||||
*/
|
||||
interface BaseWorkerMessage {
|
||||
id: string;
|
||||
type: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* Database query request message
|
||||
*/
|
||||
export interface QueryRequest extends BaseWorkerMessage {
|
||||
type: "query";
|
||||
sql: string;
|
||||
params?: unknown[];
|
||||
}
|
||||
|
||||
/**
|
||||
* Database execution request message (INSERT, UPDATE, DELETE, etc.)
|
||||
*/
|
||||
export interface ExecRequest extends BaseWorkerMessage {
|
||||
type: "exec";
|
||||
sql: string;
|
||||
params?: unknown[];
|
||||
}
|
||||
|
||||
/**
|
||||
* Database get one row request message
|
||||
*/
|
||||
export interface GetOneRowRequest extends BaseWorkerMessage {
|
||||
type: "getOneRow";
|
||||
sql: string;
|
||||
params?: unknown[];
|
||||
}
|
||||
|
||||
/**
|
||||
* Database initialization request message
|
||||
*/
|
||||
export interface InitRequest extends BaseWorkerMessage {
|
||||
type: "init";
|
||||
}
|
||||
|
||||
/**
|
||||
* Health check request message
|
||||
*/
|
||||
export interface PingRequest extends BaseWorkerMessage {
|
||||
type: "ping";
|
||||
}
|
||||
|
||||
/**
|
||||
* Union type of all possible request messages
|
||||
*/
|
||||
export type WorkerRequest =
|
||||
| QueryRequest
|
||||
| ExecRequest
|
||||
| GetOneRowRequest
|
||||
| InitRequest
|
||||
| PingRequest;
|
||||
|
||||
/**
|
||||
* Success response from worker
|
||||
*/
|
||||
export interface SuccessResponse extends BaseWorkerMessage {
|
||||
type: "success";
|
||||
data: unknown;
|
||||
}
|
||||
|
||||
/**
|
||||
* Error response from worker
|
||||
*/
|
||||
export interface ErrorResponse extends BaseWorkerMessage {
|
||||
type: "error";
|
||||
error: {
|
||||
message: string;
|
||||
stack?: string;
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Initialization complete response
|
||||
*/
|
||||
export interface InitCompleteResponse extends BaseWorkerMessage {
|
||||
type: "init-complete";
|
||||
}
|
||||
|
||||
/**
|
||||
* Ping response
|
||||
*/
|
||||
export interface PongResponse extends BaseWorkerMessage {
|
||||
type: "pong";
|
||||
}
|
||||
|
||||
/**
|
||||
* Union type of all possible response messages
|
||||
*/
|
||||
export type WorkerResponse =
|
||||
| SuccessResponse
|
||||
| ErrorResponse
|
||||
| InitCompleteResponse
|
||||
| PongResponse;
|
||||
|
||||
/**
|
||||
* Query result type specifically for database queries
|
||||
*/
|
||||
export interface QueryResult {
|
||||
result: QueryExecResult[];
|
||||
}
|
||||
|
||||
/**
|
||||
* Execution result type for database modifications
|
||||
*/
|
||||
export interface ExecResult {
|
||||
changes: number;
|
||||
lastId?: number;
|
||||
}
|
||||
@@ -1,10 +1,14 @@
|
||||
import { initBackend } from "absurd-sql/dist/indexeddb-main-thread";
|
||||
import { initializeApp } from "./main.common";
|
||||
import { logger } from "./utils/logger";
|
||||
// import { logger } from "./utils/logger"; // DISABLED FOR DEBUGGING
|
||||
|
||||
const platform = process.env.VITE_PLATFORM;
|
||||
const pwa_enabled = process.env.VITE_PWA_ENABLED === "true";
|
||||
|
||||
// Debug: Check SharedArrayBuffer availability
|
||||
console.log(`[SharedArrayBuffer] Available: ${typeof SharedArrayBuffer !== 'undefined'}`);
|
||||
console.log(`[Browser] User Agent: ${navigator.userAgent}`);
|
||||
console.log(`[Headers] Check COOP/COEP in Network tab if SharedArrayBuffer is false`);
|
||||
|
||||
// Only import service worker for web builds
|
||||
if (pwa_enabled) {
|
||||
import("./registerServiceWorker"); // Web PWA support
|
||||
@@ -12,23 +16,18 @@ if (pwa_enabled) {
|
||||
|
||||
const app = initializeApp();
|
||||
|
||||
function sqlInit() {
|
||||
// see https://github.com/jlongster/absurd-sql
|
||||
const worker = new Worker(
|
||||
new URL("./registerSQLWorker.js", import.meta.url),
|
||||
{
|
||||
type: "module",
|
||||
},
|
||||
);
|
||||
// This is only required because Safari doesn't support nested
|
||||
// workers. This installs a handler that will proxy creating web
|
||||
// workers through the main thread
|
||||
initBackend(worker);
|
||||
}
|
||||
// Note: Worker initialization is now handled by WebPlatformService
|
||||
// This ensures single-point database access and prevents double migrations
|
||||
if (platform === "web" || platform === "development") {
|
||||
sqlInit();
|
||||
// logger.log( // DISABLED
|
||||
// "[Web] Database initialization will be handled by WebPlatformService",
|
||||
// );
|
||||
console.log(
|
||||
"[Web] Database initialization will be handled by WebPlatformService",
|
||||
);
|
||||
} else {
|
||||
logger.warn("[Web] SQL not initialized for platform", { platform });
|
||||
// logger.warn("[Web] SQL not initialized for platform", { platform }); // DISABLED
|
||||
console.warn("[Web] SQL not initialized for platform", { platform });
|
||||
}
|
||||
|
||||
app.mount("#app");
|
||||
|
||||
@@ -1,6 +1,236 @@
|
||||
import databaseService from "./services/AbsurdSqlDatabaseService";
|
||||
/**
|
||||
* SQL Worker Thread Handler for TimeSafari Web Platform
|
||||
*
|
||||
* This worker handles all database operations for the web platform,
|
||||
* ensuring single-threaded database access and preventing double migrations.
|
||||
*
|
||||
* Architecture:
|
||||
* - Main thread sends messages to this worker
|
||||
* - Worker initializes database once and handles all SQL operations
|
||||
* - Results are sent back to main thread via postMessage
|
||||
*
|
||||
* @author Matthew Raymer
|
||||
* @version 1.0.0
|
||||
* @since 2025-07-02
|
||||
*/
|
||||
|
||||
async function run() {
|
||||
await databaseService.initialize();
|
||||
// import { logger } from "./utils/logger"; // DISABLED FOR DEBUGGING
|
||||
|
||||
/**
|
||||
* Worker state management
|
||||
*/
|
||||
let isInitialized = false;
|
||||
let initializationPromise = null;
|
||||
let databaseService = null;
|
||||
|
||||
/**
|
||||
* Lazy load database service to prevent circular dependencies
|
||||
*/
|
||||
async function getDatabaseService() {
|
||||
if (!databaseService) {
|
||||
// Dynamic import to prevent circular dependency
|
||||
const { default: service } = await import("./services/AbsurdSqlDatabaseService");
|
||||
databaseService = service;
|
||||
}
|
||||
return databaseService;
|
||||
}
|
||||
run();
|
||||
|
||||
/**
|
||||
* Send response back to main thread
|
||||
*/
|
||||
function sendResponse(id, type, data = null, error = null) {
|
||||
const response = {
|
||||
id,
|
||||
type,
|
||||
...(data && { data }),
|
||||
...(error && { error }),
|
||||
};
|
||||
postMessage(response);
|
||||
}
|
||||
|
||||
/**
|
||||
* Initialize database service
|
||||
*/
|
||||
async function initializeDatabase() {
|
||||
if (isInitialized) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (initializationPromise) {
|
||||
return initializationPromise;
|
||||
}
|
||||
|
||||
initializationPromise = (async () => {
|
||||
try {
|
||||
// logger.log("[SQLWorker] Starting database initialization..."); // DISABLED
|
||||
const dbService = await getDatabaseService();
|
||||
await dbService.initialize();
|
||||
isInitialized = true;
|
||||
// logger.log("[SQLWorker] Database initialization completed successfully"); // DISABLED
|
||||
} catch (error) {
|
||||
// logger.error("[SQLWorker] Database initialization failed:", error); // DISABLED
|
||||
console.error("[SQLWorker] Database initialization failed:", error); // Keep only critical errors
|
||||
isInitialized = false;
|
||||
initializationPromise = null;
|
||||
throw error;
|
||||
}
|
||||
})();
|
||||
|
||||
return initializationPromise;
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle database query operations
|
||||
*/
|
||||
async function handleQuery(id, sql, params = []) {
|
||||
try {
|
||||
await initializeDatabase();
|
||||
// logger.log(`[SQLWorker] Executing query: ${sql}`, params); // DISABLED
|
||||
|
||||
const dbService = await getDatabaseService();
|
||||
const result = await dbService.query(sql, params);
|
||||
// logger.log(`[SQLWorker] Query completed successfully`); // DISABLED
|
||||
|
||||
sendResponse(id, "success", { result });
|
||||
} catch (error) {
|
||||
// logger.error(`[SQLWorker] Query failed:`, error); // DISABLED
|
||||
console.error(`[SQLWorker] Query failed:`, error); // Keep only critical errors
|
||||
sendResponse(id, "error", null, {
|
||||
message: error.message,
|
||||
stack: error.stack,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle database execution operations (INSERT, UPDATE, DELETE)
|
||||
*/
|
||||
async function handleExec(id, sql, params = []) {
|
||||
try {
|
||||
await initializeDatabase();
|
||||
// logger.log(`[SQLWorker] Executing statement: ${sql}`, params); // DISABLED
|
||||
|
||||
const dbService = await getDatabaseService();
|
||||
const result = await dbService.run(sql, params);
|
||||
// logger.log(`[SQLWorker] Statement executed successfully:`, result); // DISABLED
|
||||
|
||||
sendResponse(id, "success", result);
|
||||
} catch (error) {
|
||||
// logger.error(`[SQLWorker] Statement execution failed:`, error); // DISABLED
|
||||
console.error(`[SQLWorker] Statement execution failed:`, error); // Keep only critical errors
|
||||
sendResponse(id, "error", null, {
|
||||
message: error.message,
|
||||
stack: error.stack,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle database get one row operations
|
||||
*/
|
||||
async function handleGetOneRow(id, sql, params = []) {
|
||||
try {
|
||||
await initializeDatabase();
|
||||
// logger.log(`[SQLWorker] Executing getOneRow: ${sql}`, params); // DISABLED
|
||||
|
||||
const dbService = await getDatabaseService();
|
||||
const result = await dbService.query(sql, params);
|
||||
const oneRow = result?.[0]?.values?.[0];
|
||||
// logger.log(`[SQLWorker] GetOneRow completed successfully`); // DISABLED
|
||||
|
||||
sendResponse(id, "success", oneRow);
|
||||
} catch (error) {
|
||||
// logger.error(`[SQLWorker] GetOneRow failed:`, error); // DISABLED
|
||||
console.error(`[SQLWorker] GetOneRow failed:`, error); // Keep only critical errors
|
||||
sendResponse(id, "error", null, {
|
||||
message: error.message,
|
||||
stack: error.stack,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle initialization request
|
||||
*/
|
||||
async function handleInit(id) {
|
||||
try {
|
||||
await initializeDatabase();
|
||||
// logger.log("[SQLWorker] Initialization request completed"); // DISABLED
|
||||
sendResponse(id, "init-complete");
|
||||
} catch (error) {
|
||||
// logger.error("[SQLWorker] Initialization request failed:", error); // DISABLED
|
||||
console.error("[SQLWorker] Initialization request failed:", error); // Keep only critical errors
|
||||
sendResponse(id, "error", null, {
|
||||
message: error.message,
|
||||
stack: error.stack,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle ping request for health check
|
||||
*/
|
||||
function handlePing(id) {
|
||||
// logger.log("[SQLWorker] Ping received"); // DISABLED
|
||||
sendResponse(id, "pong");
|
||||
}
|
||||
|
||||
/**
|
||||
* Main message handler
|
||||
*/
|
||||
onmessage = function (event) {
|
||||
const { id, type, sql, params } = event.data;
|
||||
|
||||
if (!id || !type) {
|
||||
// logger.error("[SQLWorker] Invalid message received:", event.data); // DISABLED
|
||||
console.error("[SQLWorker] Invalid message received:", event.data);
|
||||
return;
|
||||
}
|
||||
|
||||
// logger.log(`[SQLWorker] Received message: ${type} (${id})`); // DISABLED
|
||||
|
||||
switch (type) {
|
||||
case "query":
|
||||
handleQuery(id, sql, params);
|
||||
break;
|
||||
|
||||
case "exec":
|
||||
handleExec(id, sql, params);
|
||||
break;
|
||||
|
||||
case "getOneRow":
|
||||
handleGetOneRow(id, sql, params);
|
||||
break;
|
||||
|
||||
case "init":
|
||||
handleInit(id);
|
||||
break;
|
||||
|
||||
case "ping":
|
||||
handlePing(id);
|
||||
break;
|
||||
|
||||
default:
|
||||
// logger.error(`[SQLWorker] Unknown message type: ${type}`); // DISABLED
|
||||
console.error(`[SQLWorker] Unknown message type: ${type}`);
|
||||
sendResponse(id, "error", null, {
|
||||
message: `Unknown message type: ${type}`,
|
||||
});
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Handle worker errors
|
||||
*/
|
||||
onerror = function (error) {
|
||||
// logger.error("[SQLWorker] Worker error:", error); // DISABLED
|
||||
console.error("[SQLWorker] Worker error:", error);
|
||||
};
|
||||
|
||||
/**
|
||||
* Auto-initialize on worker startup (removed to prevent circular dependency)
|
||||
* Initialization now happens on first database operation
|
||||
*/
|
||||
// logger.log("[SQLWorker] Worker loaded, ready to receive messages"); // DISABLED
|
||||
console.log("[SQLWorker] Worker loaded, ready to receive messages");
|
||||
|
||||
@@ -58,7 +58,8 @@ class AbsurdSqlDatabaseService implements DatabaseService {
|
||||
try {
|
||||
await this.initializationPromise;
|
||||
} catch (error) {
|
||||
logger.error(`AbsurdSqlDatabaseService initialize method failed:`, error);
|
||||
// logger.error(`AbsurdSqlDatabaseService initialize method failed:`, error); // DISABLED
|
||||
console.error(`AbsurdSqlDatabaseService initialize method failed:`, error);
|
||||
this.initializationPromise = null; // Reset on failure
|
||||
throw error;
|
||||
}
|
||||
@@ -144,7 +145,15 @@ class AbsurdSqlDatabaseService implements DatabaseService {
|
||||
}
|
||||
operation.resolve(result);
|
||||
} catch (error) {
|
||||
logger.error(
|
||||
// logger.error( // DISABLED
|
||||
// "Error while processing SQL queue:",
|
||||
// error,
|
||||
// " ... for sql:",
|
||||
// operation.sql,
|
||||
// " ... with params:",
|
||||
// operation.params,
|
||||
// );
|
||||
console.error(
|
||||
"Error while processing SQL queue:",
|
||||
error,
|
||||
" ... for sql:",
|
||||
@@ -196,7 +205,10 @@ class AbsurdSqlDatabaseService implements DatabaseService {
|
||||
|
||||
// If initialized but no db, something went wrong
|
||||
if (!this.db) {
|
||||
logger.error(
|
||||
// logger.error( // DISABLED
|
||||
// `Database not properly initialized after await waitForInitialization() - initialized flag is true but db is null`,
|
||||
// );
|
||||
console.error(
|
||||
`Database not properly initialized after await waitForInitialization() - initialized flag is true but db is null`,
|
||||
);
|
||||
throw new Error(
|
||||
|
||||
@@ -130,4 +130,15 @@ export interface PlatformService {
|
||||
sql: string,
|
||||
params?: unknown[],
|
||||
): Promise<{ changes: number; lastId?: number }>;
|
||||
|
||||
/**
|
||||
* Executes a SQL query and returns the first row as an array.
|
||||
* @param sql - The SQL query to execute
|
||||
* @param params - The parameters to pass to the query
|
||||
* @returns Promise resolving to the first row as an array, or undefined if no results
|
||||
*/
|
||||
dbGetOneRow(
|
||||
sql: string,
|
||||
params?: unknown[],
|
||||
): Promise<unknown[] | undefined>;
|
||||
}
|
||||
|
||||
@@ -19,6 +19,8 @@ import { CapacitorPlatformService } from "./platforms/CapacitorPlatformService";
|
||||
*/
|
||||
export class PlatformServiceFactory {
|
||||
private static instance: PlatformService | null = null;
|
||||
private static callCount = 0; // Debug counter
|
||||
private static creationLogged = false; // Only log creation once
|
||||
|
||||
/**
|
||||
* Gets or creates the singleton instance of PlatformService.
|
||||
@@ -27,11 +29,20 @@ export class PlatformServiceFactory {
|
||||
* @returns {PlatformService} The singleton instance of PlatformService
|
||||
*/
|
||||
public static getInstance(): PlatformService {
|
||||
PlatformServiceFactory.callCount++;
|
||||
|
||||
if (PlatformServiceFactory.instance) {
|
||||
// Normal case - return existing instance silently
|
||||
return PlatformServiceFactory.instance;
|
||||
}
|
||||
|
||||
// Only log when actually creating the instance
|
||||
const platform = process.env.VITE_PLATFORM || "web";
|
||||
|
||||
if (!PlatformServiceFactory.creationLogged) {
|
||||
console.log(`[PlatformServiceFactory] Creating singleton instance for platform: ${platform}`);
|
||||
PlatformServiceFactory.creationLogged = true;
|
||||
}
|
||||
|
||||
switch (platform) {
|
||||
case "capacitor":
|
||||
@@ -45,4 +56,14 @@ export class PlatformServiceFactory {
|
||||
|
||||
return PlatformServiceFactory.instance;
|
||||
}
|
||||
|
||||
/**
|
||||
* Debug method to check singleton usage stats
|
||||
*/
|
||||
public static getStats(): { callCount: number; instanceExists: boolean } {
|
||||
return {
|
||||
callCount: PlatformServiceFactory.callCount,
|
||||
instanceExists: PlatformServiceFactory.instance !== null
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
@@ -167,6 +167,13 @@ export class CapacitorPlatformService implements PlatformService {
|
||||
"[CapacitorPlatformService] Error while processing SQL queue:",
|
||||
error,
|
||||
);
|
||||
logger.error(
|
||||
`[CapacitorPlatformService] Failed operation - Type: ${operation.type}, SQL: ${operation.sql}`,
|
||||
);
|
||||
logger.error(
|
||||
`[CapacitorPlatformService] Failed operation - Params:`,
|
||||
operation.params,
|
||||
);
|
||||
operation.reject(error);
|
||||
}
|
||||
}
|
||||
@@ -179,31 +186,140 @@ export class CapacitorPlatformService implements PlatformService {
|
||||
sql: string,
|
||||
params: unknown[] = [],
|
||||
): Promise<R> {
|
||||
// Convert parameters to SQLite-compatible types
|
||||
const convertedParams = params.map((param) => {
|
||||
// Log incoming parameters for debugging (HIGH PRIORITY)
|
||||
logger.warn(`[CapacitorPlatformService] queueOperation - SQL: ${sql}, Params:`, params);
|
||||
|
||||
// Convert parameters to SQLite-compatible types with robust serialization
|
||||
const convertedParams = params.map((param, index) => {
|
||||
if (param === null || param === undefined) {
|
||||
return null;
|
||||
}
|
||||
if (typeof param === "object" && param !== null) {
|
||||
// Convert objects and arrays to JSON strings
|
||||
return JSON.stringify(param);
|
||||
// Enhanced debug logging for all objects (HIGH PRIORITY)
|
||||
logger.warn(`[CapacitorPlatformService] Object param at index ${index}:`, {
|
||||
type: typeof param,
|
||||
toString: param.toString(),
|
||||
constructorName: param.constructor?.name,
|
||||
isArray: Array.isArray(param),
|
||||
keys: Object.keys(param),
|
||||
stringRep: String(param)
|
||||
});
|
||||
|
||||
// Special handling for Proxy objects (common cause of "An object could not be cloned")
|
||||
const isProxy = this.isProxyObject(param);
|
||||
logger.warn(`[CapacitorPlatformService] isProxy result for index ${index}:`, isProxy);
|
||||
|
||||
// AGGRESSIVE: If toString contains "Proxy", treat as Proxy even if isProxyObject returns false
|
||||
const stringRep = String(param);
|
||||
const forceProxyDetection = stringRep.includes('Proxy(') || stringRep.startsWith('Proxy');
|
||||
logger.warn(`[CapacitorPlatformService] Force proxy detection for index ${index}:`, forceProxyDetection);
|
||||
|
||||
if (isProxy || forceProxyDetection) {
|
||||
logger.warn(`[CapacitorPlatformService] Proxy object detected at index ${index} (method: ${isProxy ? 'isProxyObject' : 'stringDetection'}), toString: ${stringRep}`);
|
||||
try {
|
||||
// AGGRESSIVE EXTRACTION: Try multiple methods to extract actual values
|
||||
if (Array.isArray(param)) {
|
||||
// Method 1: Array.from() to extract from Proxy(Array)
|
||||
const actualArray = Array.from(param);
|
||||
logger.info(`[CapacitorPlatformService] Extracted array from Proxy via Array.from():`, actualArray);
|
||||
|
||||
// Method 2: Manual element extraction for safety
|
||||
const manualArray: unknown[] = [];
|
||||
for (let i = 0; i < param.length; i++) {
|
||||
manualArray.push(param[i]);
|
||||
}
|
||||
logger.info(`[CapacitorPlatformService] Manual array extraction:`, manualArray);
|
||||
|
||||
// Use the manual extraction as it's more reliable
|
||||
return manualArray;
|
||||
} else {
|
||||
// For Proxy(Object), try to extract actual object
|
||||
const actualObject = Object.assign({}, param);
|
||||
logger.info(`[CapacitorPlatformService] Extracted object from Proxy:`, actualObject);
|
||||
return actualObject;
|
||||
}
|
||||
} catch (proxyError) {
|
||||
logger.error(`[CapacitorPlatformService] Failed to extract from Proxy at index ${index}:`, proxyError);
|
||||
|
||||
// FALLBACK: Try to extract primitive values manually
|
||||
if (Array.isArray(param)) {
|
||||
try {
|
||||
const fallbackArray: unknown[] = [];
|
||||
for (let i = 0; i < param.length; i++) {
|
||||
fallbackArray.push(param[i]);
|
||||
}
|
||||
logger.info(`[CapacitorPlatformService] Fallback array extraction successful:`, fallbackArray);
|
||||
return fallbackArray;
|
||||
} catch (fallbackError) {
|
||||
logger.error(`[CapacitorPlatformService] Fallback array extraction failed:`, fallbackError);
|
||||
return `[Proxy Array - Could not extract]`;
|
||||
}
|
||||
}
|
||||
return `[Proxy Object - Could not extract]`;
|
||||
}
|
||||
}
|
||||
|
||||
try {
|
||||
// Safely convert objects and arrays to JSON strings
|
||||
return JSON.stringify(param);
|
||||
} catch (error) {
|
||||
// Handle non-serializable objects
|
||||
logger.error(`[CapacitorPlatformService] Failed to serialize parameter at index ${index}:`, error);
|
||||
logger.error(`[CapacitorPlatformService] Problematic parameter:`, param);
|
||||
|
||||
// Fallback: Convert to string representation
|
||||
if (Array.isArray(param)) {
|
||||
return `[Array(${param.length})]`;
|
||||
}
|
||||
return `[Object ${param.constructor?.name || 'Unknown'}]`;
|
||||
}
|
||||
}
|
||||
if (typeof param === "boolean") {
|
||||
// Convert boolean to integer (0 or 1)
|
||||
return param ? 1 : 0;
|
||||
}
|
||||
// Numbers, strings, bigints, and buffers are already supported
|
||||
if (typeof param === "function") {
|
||||
// Functions can't be serialized - convert to string representation
|
||||
logger.warn(`[CapacitorPlatformService] Function parameter detected and converted to string at index ${index}`);
|
||||
return `[Function ${param.name || 'Anonymous'}]`;
|
||||
}
|
||||
if (typeof param === "symbol") {
|
||||
// Symbols can't be serialized - convert to string representation
|
||||
logger.warn(`[CapacitorPlatformService] Symbol parameter detected and converted to string at index ${index}`);
|
||||
return param.toString();
|
||||
}
|
||||
// Numbers, strings, bigints are supported, but ensure bigints are converted to strings
|
||||
if (typeof param === "bigint") {
|
||||
return param.toString();
|
||||
}
|
||||
return param;
|
||||
});
|
||||
|
||||
// Log converted parameters for debugging (HIGH PRIORITY)
|
||||
logger.warn(`[CapacitorPlatformService] Converted params:`, convertedParams);
|
||||
|
||||
return new Promise<R>((resolve, reject) => {
|
||||
const operation: QueuedOperation = {
|
||||
type,
|
||||
sql,
|
||||
params: convertedParams,
|
||||
resolve: (value: unknown) => resolve(value as R),
|
||||
reject,
|
||||
};
|
||||
// Create completely plain objects that Vue cannot make reactive
|
||||
// Step 1: Deep clone the converted params to ensure they're plain objects
|
||||
const plainParams = JSON.parse(JSON.stringify(convertedParams));
|
||||
|
||||
// Step 2: Create operation object using Object.create(null) for no prototype
|
||||
const operation = Object.create(null) as QueuedOperation;
|
||||
operation.type = type;
|
||||
operation.sql = sql;
|
||||
operation.params = plainParams;
|
||||
operation.resolve = (value: unknown) => resolve(value as R);
|
||||
operation.reject = reject;
|
||||
|
||||
// Step 3: Freeze everything to prevent modification
|
||||
Object.freeze(operation.params);
|
||||
Object.freeze(operation);
|
||||
|
||||
// Add enhanced logging to verify our fix
|
||||
logger.warn(`[CapacitorPlatformService] Final operation.params type:`, typeof operation.params);
|
||||
logger.warn(`[CapacitorPlatformService] Final operation.params toString:`, operation.params.toString());
|
||||
logger.warn(`[CapacitorPlatformService] Final operation.params constructor:`, operation.params.constructor?.name);
|
||||
|
||||
this.operationQueue.push(operation);
|
||||
|
||||
// If we're already initialized, start processing the queue
|
||||
@@ -237,6 +353,75 @@ export class CapacitorPlatformService implements PlatformService {
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Detect if an object is a Proxy object that cannot be serialized
|
||||
* Proxy objects cause "An object could not be cloned" errors in Capacitor
|
||||
* @param obj - Object to test
|
||||
* @returns true if the object appears to be a Proxy
|
||||
*/
|
||||
private isProxyObject(obj: unknown): boolean {
|
||||
if (typeof obj !== "object" || obj === null) {
|
||||
return false;
|
||||
}
|
||||
|
||||
try {
|
||||
// Method 1: Check toString representation
|
||||
const objString = obj.toString();
|
||||
if (objString.includes('Proxy(') || objString.startsWith('Proxy')) {
|
||||
logger.debug("[CapacitorPlatformService] Proxy detected via toString:", objString);
|
||||
return true;
|
||||
}
|
||||
|
||||
// Method 2: Check constructor name
|
||||
const constructorName = obj.constructor?.name;
|
||||
if (constructorName === 'Proxy') {
|
||||
logger.debug("[CapacitorPlatformService] Proxy detected via constructor name");
|
||||
return true;
|
||||
}
|
||||
|
||||
// Method 3: Check Object.prototype.toString
|
||||
const objToString = Object.prototype.toString.call(obj);
|
||||
if (objToString.includes('Proxy')) {
|
||||
logger.debug("[CapacitorPlatformService] Proxy detected via Object.prototype.toString");
|
||||
return true;
|
||||
}
|
||||
|
||||
// Method 4: Vue/Reactive Proxy detection - check for __v_ properties
|
||||
if (typeof obj === 'object' && obj !== null) {
|
||||
// Check for Vue reactive proxy indicators
|
||||
const hasVueProxy = Object.getOwnPropertyNames(obj).some(prop =>
|
||||
prop.startsWith('__v_') || prop.startsWith('__r_')
|
||||
);
|
||||
if (hasVueProxy) {
|
||||
logger.debug("[CapacitorPlatformService] Vue reactive Proxy detected");
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
// Method 5: Try JSON.stringify and check for Proxy in error or result
|
||||
try {
|
||||
const jsonString = JSON.stringify(obj);
|
||||
if (jsonString.includes('Proxy')) {
|
||||
logger.debug("[CapacitorPlatformService] Proxy detected in JSON serialization");
|
||||
return true;
|
||||
}
|
||||
} catch (jsonError) {
|
||||
// If JSON.stringify fails, it might be a non-serializable Proxy
|
||||
const errorMessage = jsonError instanceof Error ? jsonError.message : String(jsonError);
|
||||
if (errorMessage.includes('Proxy') || errorMessage.includes('circular') || errorMessage.includes('clone')) {
|
||||
logger.debug("[CapacitorPlatformService] Proxy detected via JSON serialization error");
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
return false;
|
||||
} catch (error) {
|
||||
// If we can't inspect the object, it might be a Proxy causing issues
|
||||
logger.warn("[CapacitorPlatformService] Could not inspect object for Proxy detection:", error);
|
||||
return true; // Assume it's a Proxy if we can't inspect it
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Execute database migrations for the Capacitor platform
|
||||
*
|
||||
@@ -1074,4 +1259,21 @@ export class CapacitorPlatformService implements PlatformService {
|
||||
params || [],
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* @see PlatformService.dbGetOneRow
|
||||
*/
|
||||
async dbGetOneRow(
|
||||
sql: string,
|
||||
params?: unknown[],
|
||||
): Promise<unknown[] | undefined> {
|
||||
await this.waitForInitialization();
|
||||
const result = await this.queueOperation<QueryExecResult>("query", sql, params || []);
|
||||
|
||||
// Return the first row from the result, or undefined if no results
|
||||
if (result && result.values && result.values.length > 0) {
|
||||
return result.values[0];
|
||||
}
|
||||
return undefined;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,7 +5,15 @@ import {
|
||||
} from "../PlatformService";
|
||||
import { logger } from "../../utils/logger";
|
||||
import { QueryExecResult } from "@/interfaces/database";
|
||||
import databaseService from "../AbsurdSqlDatabaseService";
|
||||
// Dynamic import of initBackend to prevent worker context errors
|
||||
import type {
|
||||
WorkerRequest,
|
||||
WorkerResponse,
|
||||
QueryRequest,
|
||||
ExecRequest,
|
||||
QueryResult,
|
||||
GetOneRowRequest,
|
||||
} from "@/interfaces/worker-messages";
|
||||
|
||||
/**
|
||||
* Platform service implementation for web browser platform.
|
||||
@@ -16,11 +24,215 @@ import databaseService from "../AbsurdSqlDatabaseService";
|
||||
* - Image capture using the browser's file input
|
||||
* - Image selection from local filesystem
|
||||
* - Image processing and conversion
|
||||
* - Database operations via worker thread messaging
|
||||
*
|
||||
* Note: File system operations are not available in the web platform
|
||||
* due to browser security restrictions. These methods throw appropriate errors.
|
||||
*/
|
||||
export class WebPlatformService implements PlatformService {
|
||||
private static instanceCount = 0; // Debug counter
|
||||
private worker: Worker | null = null;
|
||||
private workerReady = false;
|
||||
private workerInitPromise: Promise<void> | null = null;
|
||||
private pendingMessages = new Map<
|
||||
string,
|
||||
{
|
||||
resolve: (_value: unknown) => void;
|
||||
reject: (_reason: unknown) => void;
|
||||
timeout: NodeJS.Timeout;
|
||||
}
|
||||
>();
|
||||
private messageIdCounter = 0;
|
||||
private readonly messageTimeout = 30000; // 30 seconds
|
||||
|
||||
constructor() {
|
||||
WebPlatformService.instanceCount++;
|
||||
|
||||
// Only warn if multiple instances (which shouldn't happen with singleton)
|
||||
if (WebPlatformService.instanceCount > 1) {
|
||||
console.error(`[WebPlatformService] ERROR: Multiple instances created! Count: ${WebPlatformService.instanceCount}`);
|
||||
} else {
|
||||
console.log(`[WebPlatformService] Initializing web platform service`);
|
||||
}
|
||||
|
||||
// Start worker initialization but don't await it in constructor
|
||||
this.workerInitPromise = this.initializeWorker();
|
||||
}
|
||||
|
||||
/**
|
||||
* Initialize the SQL worker for database operations
|
||||
*/
|
||||
private async initializeWorker(): Promise<void> {
|
||||
try {
|
||||
// logger.log("[WebPlatformService] Initializing SQL worker..."); // DISABLED
|
||||
|
||||
this.worker = new Worker(
|
||||
new URL("../../registerSQLWorker.js", import.meta.url),
|
||||
{ type: "module" },
|
||||
);
|
||||
|
||||
// This is required for Safari compatibility with nested workers
|
||||
// It installs a handler that proxies web worker creation through the main thread
|
||||
// CRITICAL: Only call initBackend from main thread, not from worker context
|
||||
const isMainThread = typeof window !== 'undefined';
|
||||
if (isMainThread) {
|
||||
// We're in the main thread - safe to dynamically import and call initBackend
|
||||
try {
|
||||
const { initBackend } = await import("absurd-sql/dist/indexeddb-main-thread");
|
||||
initBackend(this.worker);
|
||||
} catch (error) {
|
||||
console.error("[WebPlatformService] Failed to import/call initBackend:", error);
|
||||
throw error;
|
||||
}
|
||||
} else {
|
||||
// We're in a worker context - skip initBackend call
|
||||
console.log("[WebPlatformService] Skipping initBackend call in worker context");
|
||||
}
|
||||
|
||||
this.worker.onmessage = (event) => {
|
||||
this.handleWorkerMessage(event.data);
|
||||
};
|
||||
|
||||
this.worker.onerror = (error) => {
|
||||
// logger.error("[WebPlatformService] Worker error:", error); // DISABLED
|
||||
console.error("[WebPlatformService] Worker error:", error);
|
||||
this.workerReady = false;
|
||||
};
|
||||
|
||||
// Send ping to verify worker is ready
|
||||
await this.sendWorkerMessage({ type: "ping" });
|
||||
this.workerReady = true;
|
||||
|
||||
// logger.log("[WebPlatformService] SQL worker initialized successfully"); // DISABLED
|
||||
} catch (error) {
|
||||
// logger.error("[WebPlatformService] Failed to initialize worker:", error); // DISABLED
|
||||
console.error("[WebPlatformService] Failed to initialize worker:", error);
|
||||
this.workerReady = false;
|
||||
this.workerInitPromise = null;
|
||||
throw new Error("Failed to initialize database worker");
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle messages received from the worker
|
||||
*/
|
||||
private handleWorkerMessage(message: WorkerResponse): void {
|
||||
const { id, type } = message;
|
||||
|
||||
// Handle absurd-sql internal messages (these are normal, don't log)
|
||||
if (!id && message.type?.startsWith('__absurd:')) {
|
||||
return; // Internal absurd-sql message, ignore silently
|
||||
}
|
||||
|
||||
if (!id) {
|
||||
// logger.warn("[WebPlatformService] Received message without ID:", message); // DISABLED
|
||||
console.warn("[WebPlatformService] Received message without ID:", message);
|
||||
return;
|
||||
}
|
||||
|
||||
const pending = this.pendingMessages.get(id);
|
||||
if (!pending) {
|
||||
// logger.warn( // DISABLED
|
||||
// "[WebPlatformService] Received response for unknown message ID:",
|
||||
// id,
|
||||
// );
|
||||
console.warn(
|
||||
"[WebPlatformService] Received response for unknown message ID:",
|
||||
id,
|
||||
);
|
||||
return;
|
||||
}
|
||||
|
||||
// Clear timeout and remove from pending
|
||||
clearTimeout(pending.timeout);
|
||||
this.pendingMessages.delete(id);
|
||||
|
||||
switch (type) {
|
||||
case "success":
|
||||
pending.resolve(message.data);
|
||||
break;
|
||||
|
||||
case "error": {
|
||||
const error = new Error(message.error.message);
|
||||
if (message.error.stack) {
|
||||
error.stack = message.error.stack;
|
||||
}
|
||||
pending.reject(error);
|
||||
break;
|
||||
}
|
||||
|
||||
case "init-complete":
|
||||
pending.resolve(true);
|
||||
break;
|
||||
|
||||
case "pong":
|
||||
pending.resolve(true);
|
||||
break;
|
||||
|
||||
default:
|
||||
// logger.warn("[WebPlatformService] Unknown response type:", type); // DISABLED
|
||||
console.warn("[WebPlatformService] Unknown response type:", type);
|
||||
pending.resolve(message);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Send a message to the worker and wait for response
|
||||
*/
|
||||
private async sendWorkerMessage<T>(
|
||||
request: Omit<WorkerRequest, "id">,
|
||||
): Promise<T> {
|
||||
if (!this.worker) {
|
||||
throw new Error("Worker not initialized");
|
||||
}
|
||||
|
||||
const id = `msg_${++this.messageIdCounter}_${Date.now()}`;
|
||||
const fullRequest: WorkerRequest = { id, ...request } as WorkerRequest;
|
||||
|
||||
return new Promise<T>((resolve, reject) => {
|
||||
const timeout = setTimeout(() => {
|
||||
this.pendingMessages.delete(id);
|
||||
reject(new Error(`Worker message timeout for ${request.type} (${id})`));
|
||||
}, this.messageTimeout);
|
||||
|
||||
this.pendingMessages.set(id, {
|
||||
resolve: resolve as (value: unknown) => void,
|
||||
reject,
|
||||
timeout,
|
||||
});
|
||||
|
||||
// logger.log( // DISABLED
|
||||
// `[WebPlatformService] Sending message: ${request.type} (${id})`,
|
||||
// );
|
||||
this.worker!.postMessage(fullRequest);
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Wait for worker to be ready
|
||||
*/
|
||||
private async ensureWorkerReady(): Promise<void> {
|
||||
// Wait for initial initialization to complete
|
||||
if (this.workerInitPromise) {
|
||||
await this.workerInitPromise;
|
||||
}
|
||||
|
||||
if (this.workerReady) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Try to ping the worker if not ready
|
||||
try {
|
||||
await this.sendWorkerMessage<boolean>({ type: "ping" });
|
||||
this.workerReady = true;
|
||||
} catch (error) {
|
||||
// logger.error("[WebPlatformService] Worker not ready:", error); // DISABLED
|
||||
console.error("[WebPlatformService] Worker not ready:", error);
|
||||
throw new Error("Database worker not ready");
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Gets the capabilities of the web platform
|
||||
* @returns Platform capabilities object
|
||||
@@ -358,30 +570,43 @@ export class WebPlatformService implements PlatformService {
|
||||
/**
|
||||
* @see PlatformService.dbQuery
|
||||
*/
|
||||
dbQuery(
|
||||
async dbQuery(
|
||||
sql: string,
|
||||
params?: unknown[],
|
||||
): Promise<QueryExecResult | undefined> {
|
||||
return databaseService.query(sql, params).then((result) => result[0]);
|
||||
await this.ensureWorkerReady();
|
||||
return this.sendWorkerMessage<QueryResult>({
|
||||
type: "query",
|
||||
sql,
|
||||
params,
|
||||
} as QueryRequest).then((result) => result.result[0]);
|
||||
}
|
||||
|
||||
/**
|
||||
* @see PlatformService.dbExec
|
||||
*/
|
||||
dbExec(
|
||||
async dbExec(
|
||||
sql: string,
|
||||
params?: unknown[],
|
||||
): Promise<{ changes: number; lastId?: number }> {
|
||||
return databaseService.run(sql, params);
|
||||
await this.ensureWorkerReady();
|
||||
return this.sendWorkerMessage<{ changes: number; lastId?: number }>({
|
||||
type: "exec",
|
||||
sql,
|
||||
params,
|
||||
} as ExecRequest);
|
||||
}
|
||||
|
||||
async dbGetOneRow(
|
||||
sql: string,
|
||||
params?: unknown[],
|
||||
): Promise<unknown[] | undefined> {
|
||||
return databaseService
|
||||
.query(sql, params)
|
||||
.then((result: QueryExecResult[]) => result[0]?.values[0]);
|
||||
await this.ensureWorkerReady();
|
||||
return this.sendWorkerMessage<unknown[] | undefined>({
|
||||
type: "getOneRow",
|
||||
sql,
|
||||
params,
|
||||
} as GetOneRowRequest);
|
||||
}
|
||||
|
||||
/**
|
||||
|
||||
365
src/utils/usePlatformService.ts
Normal file
365
src/utils/usePlatformService.ts
Normal file
@@ -0,0 +1,365 @@
|
||||
/**
|
||||
* Platform Service Composable for TimeSafari
|
||||
*
|
||||
* Provides centralized access to platform-specific services across Vue components.
|
||||
* This composable encapsulates the singleton pattern and provides a clean interface
|
||||
* for components to access platform functionality without directly managing
|
||||
* the PlatformServiceFactory.
|
||||
*
|
||||
* Benefits:
|
||||
* - Centralized service access
|
||||
* - Better testability with easy mocking
|
||||
* - Cleaner component code
|
||||
* - Type safety with TypeScript
|
||||
* - Reactive capabilities if needed in the future
|
||||
*
|
||||
* @author Matthew Raymer
|
||||
* @version 1.0.0
|
||||
* @since 2025-07-02
|
||||
*/
|
||||
|
||||
import { ref, readonly } from 'vue';
|
||||
import { PlatformServiceFactory } from '@/services/PlatformServiceFactory';
|
||||
import type { PlatformService } from '@/services/PlatformService';
|
||||
import * as databaseUtil from '@/db/databaseUtil';
|
||||
import { Contact } from '@/db/tables/contacts';
|
||||
|
||||
/**
|
||||
* Reactive reference to the platform service instance
|
||||
* This allows for potential reactive features in the future
|
||||
*/
|
||||
const platformService = ref<PlatformService | null>(null);
|
||||
|
||||
/**
|
||||
* Flag to track if service has been initialized
|
||||
*/
|
||||
const isInitialized = ref(false);
|
||||
|
||||
/**
|
||||
* Initialize the platform service if not already done
|
||||
*/
|
||||
function initializePlatformService(): PlatformService {
|
||||
if (!platformService.value) {
|
||||
platformService.value = PlatformServiceFactory.getInstance();
|
||||
isInitialized.value = true;
|
||||
}
|
||||
return platformService.value;
|
||||
}
|
||||
|
||||
/**
|
||||
* Platform Service Composable
|
||||
*
|
||||
* Provides access to platform-specific services in a composable pattern.
|
||||
* This is the recommended way for Vue components to access platform functionality.
|
||||
*
|
||||
* @returns Object containing platform service and utility functions
|
||||
*
|
||||
* @example
|
||||
* ```typescript
|
||||
* // In a Vue component
|
||||
* import { usePlatformService } from '@/utils/usePlatformService';
|
||||
*
|
||||
* export default {
|
||||
* setup() {
|
||||
* const { platform, dbQuery, dbExec, takePicture } = usePlatformService();
|
||||
*
|
||||
* // Use platform methods directly
|
||||
* const takePhoto = async () => {
|
||||
* const result = await takePicture();
|
||||
* console.log('Photo taken:', result);
|
||||
* };
|
||||
*
|
||||
* return { takePhoto };
|
||||
* }
|
||||
* };
|
||||
* ```
|
||||
*/
|
||||
export function usePlatformService() {
|
||||
// Initialize service on first use
|
||||
const service = initializePlatformService();
|
||||
|
||||
/**
|
||||
* Safely serialize parameters to avoid Proxy objects in native bridges
|
||||
* Vue's reactivity system can wrap arrays in Proxy objects which cause
|
||||
* "An object could not be cloned" errors in Capacitor
|
||||
*/
|
||||
const safeSerializeParams = (params?: unknown[]): unknown[] => {
|
||||
if (!params) return [];
|
||||
|
||||
console.log('[usePlatformService] Original params:', params);
|
||||
console.log('[usePlatformService] Params toString:', params.toString());
|
||||
console.log('[usePlatformService] Params constructor:', params.constructor?.name);
|
||||
|
||||
// Use the most aggressive approach: JSON round-trip + spread operator
|
||||
try {
|
||||
// Method 1: JSON round-trip to completely strip any Proxy
|
||||
const jsonSerialized = JSON.parse(JSON.stringify(params));
|
||||
console.log('[usePlatformService] JSON serialized:', jsonSerialized);
|
||||
|
||||
// Method 2: Spread operator to create new array
|
||||
const spreadArray = [...jsonSerialized];
|
||||
console.log('[usePlatformService] Spread array:', spreadArray);
|
||||
|
||||
// Method 3: Force primitive extraction for each element
|
||||
const finalParams = spreadArray.map((param, index) => {
|
||||
if (param === null || param === undefined) {
|
||||
return param;
|
||||
}
|
||||
|
||||
// Force convert to primitive value
|
||||
if (typeof param === 'object') {
|
||||
if (Array.isArray(param)) {
|
||||
return [...param]; // Spread to new array
|
||||
} else {
|
||||
return { ...param }; // Spread to new object
|
||||
}
|
||||
}
|
||||
|
||||
return param;
|
||||
});
|
||||
|
||||
console.log('[usePlatformService] Final params:', finalParams);
|
||||
console.log('[usePlatformService] Final params toString:', finalParams.toString());
|
||||
console.log('[usePlatformService] Final params constructor:', finalParams.constructor?.name);
|
||||
|
||||
return finalParams;
|
||||
} catch (error) {
|
||||
console.error('[usePlatformService] Serialization error:', error);
|
||||
// Fallback: manual extraction
|
||||
const fallbackParams: unknown[] = [];
|
||||
for (let i = 0; i < params.length; i++) {
|
||||
try {
|
||||
// Try to access the value directly
|
||||
const value = params[i];
|
||||
fallbackParams.push(value);
|
||||
} catch (accessError) {
|
||||
console.error('[usePlatformService] Access error for param', i, ':', accessError);
|
||||
fallbackParams.push(String(params[i]));
|
||||
}
|
||||
}
|
||||
console.log('[usePlatformService] Fallback params:', fallbackParams);
|
||||
return fallbackParams;
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Database query method with proper typing and safe parameter serialization
|
||||
*/
|
||||
const dbQuery = async (sql: string, params?: unknown[]) => {
|
||||
const safeParams = safeSerializeParams(params);
|
||||
return await service.dbQuery(sql, safeParams);
|
||||
};
|
||||
|
||||
/**
|
||||
* Database execution method with proper typing and safe parameter serialization
|
||||
*/
|
||||
const dbExec = async (sql: string, params?: unknown[]) => {
|
||||
const safeParams = safeSerializeParams(params);
|
||||
return await service.dbExec(sql, safeParams);
|
||||
};
|
||||
|
||||
/**
|
||||
* Get single row from database with proper typing and safe parameter serialization
|
||||
*/
|
||||
const dbGetOneRow = async (sql: string, params?: unknown[]) => {
|
||||
const safeParams = safeSerializeParams(params);
|
||||
return await service.dbGetOneRow(sql, safeParams);
|
||||
};
|
||||
|
||||
/**
|
||||
* Take picture with platform-specific implementation
|
||||
*/
|
||||
const takePicture = async () => {
|
||||
return await service.takePicture();
|
||||
};
|
||||
|
||||
/**
|
||||
* Pick image from device with platform-specific implementation
|
||||
*/
|
||||
const pickImage = async () => {
|
||||
return await service.pickImage();
|
||||
};
|
||||
|
||||
/**
|
||||
* Get platform capabilities
|
||||
*/
|
||||
const getCapabilities = () => {
|
||||
return service.getCapabilities();
|
||||
};
|
||||
|
||||
/**
|
||||
* Platform detection methods using capabilities
|
||||
*/
|
||||
const isWeb = () => {
|
||||
const capabilities = service.getCapabilities();
|
||||
return !capabilities.isNativeApp;
|
||||
};
|
||||
|
||||
const isCapacitor = () => {
|
||||
const capabilities = service.getCapabilities();
|
||||
return capabilities.isNativeApp && capabilities.isMobile;
|
||||
};
|
||||
|
||||
const isElectron = () => {
|
||||
const capabilities = service.getCapabilities();
|
||||
return capabilities.isNativeApp && !capabilities.isMobile;
|
||||
};
|
||||
|
||||
/**
|
||||
* File operations (where supported)
|
||||
*/
|
||||
const readFile = async (path: string) => {
|
||||
return await service.readFile(path);
|
||||
};
|
||||
|
||||
const writeFile = async (path: string, content: string) => {
|
||||
return await service.writeFile(path, content);
|
||||
};
|
||||
|
||||
const deleteFile = async (path: string) => {
|
||||
return await service.deleteFile(path);
|
||||
};
|
||||
|
||||
const listFiles = async (directory: string) => {
|
||||
return await service.listFiles(directory);
|
||||
};
|
||||
|
||||
/**
|
||||
* Camera operations
|
||||
*/
|
||||
const rotateCamera = async () => {
|
||||
return await service.rotateCamera();
|
||||
};
|
||||
|
||||
/**
|
||||
* Deep link handling
|
||||
*/
|
||||
const handleDeepLink = async (url: string) => {
|
||||
return await service.handleDeepLink(url);
|
||||
};
|
||||
|
||||
/**
|
||||
* File sharing
|
||||
*/
|
||||
const writeAndShareFile = async (fileName: string, content: string) => {
|
||||
return await service.writeAndShareFile(fileName, content);
|
||||
};
|
||||
|
||||
// ========================================
|
||||
// Higher-level database operations
|
||||
// ========================================
|
||||
|
||||
/**
|
||||
* Get all contacts from database with proper typing
|
||||
* @returns Promise<Contact[]> Typed array of contacts
|
||||
*/
|
||||
const getContacts = async (): Promise<Contact[]> => {
|
||||
const result = await dbQuery("SELECT * FROM contacts ORDER BY name");
|
||||
return databaseUtil.mapQueryResultToValues(result) as Contact[];
|
||||
};
|
||||
|
||||
/**
|
||||
* Get contacts with content visibility filter
|
||||
* @param showBlocked Whether to include blocked contacts
|
||||
* @returns Promise<Contact[]> Filtered contacts
|
||||
*/
|
||||
const getContactsWithFilter = async (showBlocked = true): Promise<Contact[]> => {
|
||||
const contacts = await getContacts();
|
||||
return showBlocked ? contacts : contacts.filter(c => c.iViewContent !== false);
|
||||
};
|
||||
|
||||
/**
|
||||
* Get user settings with proper typing
|
||||
* @returns Promise with all user settings
|
||||
*/
|
||||
const getSettings = async () => {
|
||||
return await databaseUtil.retrieveSettingsForActiveAccount();
|
||||
};
|
||||
|
||||
/**
|
||||
* Save default settings
|
||||
* @param settings Partial settings object to update
|
||||
*/
|
||||
const saveSettings = async (settings: Partial<any>) => {
|
||||
return await databaseUtil.updateDefaultSettings(settings);
|
||||
};
|
||||
|
||||
/**
|
||||
* Save DID-specific settings
|
||||
* @param did DID identifier
|
||||
* @param settings Partial settings object to update
|
||||
*/
|
||||
const saveDidSettings = async (did: string, settings: Partial<any>) => {
|
||||
return await databaseUtil.updateDidSpecificSettings(did, settings);
|
||||
};
|
||||
|
||||
/**
|
||||
* Get account by DID
|
||||
* @param did DID identifier
|
||||
* @returns Account data or null if not found
|
||||
*/
|
||||
const getAccount = async (did?: string) => {
|
||||
if (!did) return null;
|
||||
const result = await dbQuery("SELECT * FROM accounts WHERE did = ? LIMIT 1", [did]);
|
||||
const mappedResults = databaseUtil.mapQueryResultToValues(result);
|
||||
return mappedResults.length > 0 ? mappedResults[0] : null;
|
||||
};
|
||||
|
||||
/**
|
||||
* Log activity message to database
|
||||
* @param message Activity message to log
|
||||
*/
|
||||
const logActivity = async (message: string) => {
|
||||
const timestamp = new Date().toISOString();
|
||||
await dbExec("INSERT INTO logs (date, message) VALUES (?, ?)", [timestamp, message]);
|
||||
};
|
||||
|
||||
return {
|
||||
// Direct service access (for advanced use cases)
|
||||
platform: readonly(platformService),
|
||||
isInitialized: readonly(isInitialized),
|
||||
|
||||
// Database operations (low-level)
|
||||
dbQuery,
|
||||
dbExec,
|
||||
dbGetOneRow,
|
||||
|
||||
// Database operations (high-level)
|
||||
getContacts,
|
||||
getContactsWithFilter,
|
||||
getSettings,
|
||||
saveSettings,
|
||||
saveDidSettings,
|
||||
getAccount,
|
||||
logActivity,
|
||||
|
||||
// Media operations
|
||||
takePicture,
|
||||
pickImage,
|
||||
rotateCamera,
|
||||
|
||||
// Platform detection
|
||||
isWeb,
|
||||
isCapacitor,
|
||||
isElectron,
|
||||
getCapabilities,
|
||||
|
||||
// File operations
|
||||
readFile,
|
||||
writeFile,
|
||||
deleteFile,
|
||||
listFiles,
|
||||
writeAndShareFile,
|
||||
|
||||
// Navigation
|
||||
handleDeepLink,
|
||||
|
||||
// Raw service access for cases not covered above
|
||||
service
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Type helper for the composable return type
|
||||
*/
|
||||
export type PlatformServiceComposable = ReturnType<typeof usePlatformService>;
|
||||
@@ -1214,31 +1214,35 @@ export default class AccountViewView extends Vue {
|
||||
this.loadingProfile = false;
|
||||
}
|
||||
|
||||
try {
|
||||
/**
|
||||
* Beware! I've seen where this "ready" never resolves.
|
||||
*/
|
||||
const registration = await navigator.serviceWorker?.ready;
|
||||
this.subscription = await registration.pushManager.getSubscription();
|
||||
if (!this.subscription) {
|
||||
if (this.notifyingNewActivity || this.notifyingReminder) {
|
||||
// the app thought there was a subscription but there isn't, so fix the settings
|
||||
this.turnOffNotifyingFlags();
|
||||
// Only check service worker on web platform - Capacitor/Electron don't support it
|
||||
if (!Capacitor.isNativePlatform()) {
|
||||
try {
|
||||
/**
|
||||
* Service workers only exist on web platforms
|
||||
*/
|
||||
const registration = await navigator.serviceWorker?.ready;
|
||||
this.subscription = await registration.pushManager.getSubscription();
|
||||
if (!this.subscription) {
|
||||
if (this.notifyingNewActivity || this.notifyingReminder) {
|
||||
// the app thought there was a subscription but there isn't, so fix the settings
|
||||
this.turnOffNotifyingFlags();
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
this.$notify(
|
||||
{
|
||||
group: "alert",
|
||||
type: "warning",
|
||||
title: "Cannot Set Notifications",
|
||||
text: "This browser does not support notifications. Use Chrome, or install this to the home screen, or try other suggestions on the 'Troubleshoot your notifications' page.",
|
||||
},
|
||||
7000,
|
||||
);
|
||||
}
|
||||
/**
|
||||
* Beware! I've seen where we never get to this point because "ready" never resolves.
|
||||
*/
|
||||
} catch (error) {
|
||||
this.$notify(
|
||||
{
|
||||
group: "alert",
|
||||
type: "warning",
|
||||
title: "Cannot Set Notifications",
|
||||
text: "This browser does not support notifications. Use Chrome, or install this to the home screen, or try other suggestions on the 'Troubleshoot your notifications' page.",
|
||||
},
|
||||
7000,
|
||||
);
|
||||
} else {
|
||||
// On native platforms (Capacitor/Electron), skip service worker checks
|
||||
// Native notifications are handled differently
|
||||
this.subscription = null;
|
||||
}
|
||||
this.passkeyExpirationDescription = tokenExpiryTimeDescription();
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user