@rkosafo/cai.components 0.0.26 → 0.0.28

package/dist/builders/filters/FilterBuilder.svelte

@@ -80,7 +80,7 @@
 	import { onMount } from 'svelte';
 	import { fade } from 'svelte/transition';
 
-	let { columns = [], filters = $bindable([]) }: FilterBuilderProps = $props();
+	let { columns = [], filters = $bindable([]), onRunQuery }: FilterBuilderProps = $props();
 
 	// Operator mappings for each type
 	const operatorsByType = {
@@ -543,7 +543,10 @@
 				<p class="text-sm text-gray-600">Live preview of your filter conditions</p>
 			</div>
 			<div class="flex items-center">
-				<Button color="blue">Run Query</Button>
+				<Button
+					color="blue"
+					onclick={() => onRunQuery({ jsonBuild: jsonQuery, sqlBuild: sqlQuery })}>Run Query</Button
+				>
 			</div>
 		</div>
 

package/dist/index.d.ts

@@ -43,4 +43,5 @@ export * from './builders/filters/index.js';
 export * from './types/index.js';
 export * from './utils/index.js';
 import 'iconify-icon';
+export * from './keycloak/index.js';
 export { YouTube, BaseEditor };

package/dist/index.js

@@ -44,4 +44,5 @@ export * from './builders/filters/index.js';
 export * from './types/index.js';
 export * from './utils/index.js';
 import 'iconify-icon';
+export * from './keycloak/index.js';
 export { YouTube, BaseEditor };

package/dist/keycloak/index.d.ts

@@ -0,0 +1,2 @@
+export * from './types.js';
+export * from './keycloakService.svelte.js';

package/dist/keycloak/index.js

@@ -0,0 +1,2 @@
+export * from './types.js';
+export * from './keycloakService.svelte.js';

package/dist/keycloak/keycloakService.svelte.d.ts

@@ -0,0 +1,32 @@
+import type { AuthUserInfo, FetchAuthUserInfoFn, KeycloakConfig } from './index.js';
+export declare function createAuthStore(): {
+    isLoading: boolean;
+    isAuthenticated: boolean;
+    accessToken: string;
+    idToken: string;
+    userInfo: AuthUserInfo | null;
+    authError: string;
+    userIsFound: boolean;
+};
+export type AuthStoreType = ReturnType<typeof createAuthStore>;
+export declare class KeycloakService {
+    private keycloak;
+    private initialized;
+    private store;
+    private fetchUserInfo;
+    private onAuthenticated?;
+    private onLogout?;
+    private onError?;
+    constructor(store: AuthStoreType, fetchUserInfo: FetchAuthUserInfoFn, callbacks?: {
+        onAuthenticated?: (userInfo: AuthUserInfo) => void;
+        onLogout?: () => void;
+        onError?: (error: string) => void;
+    });
+    init(config: KeycloakConfig, initOptions?: any): Promise<void>;
+    private setTokenDetails;
+    login(): void;
+    refreshToken(): Promise<void>;
+    logout(): void;
+    getKeycloakInstance(): any;
+    isInitialized(): boolean;
+}

package/dist/keycloak/keycloakService.svelte.js

@@ -0,0 +1,142 @@
+import Keycloak from 'keycloak-js';
+export function createAuthStore() {
+    return {
+        isLoading: $state(true),
+        isAuthenticated: $state(false),
+        accessToken: $state(''),
+        idToken: $state(''),
+        userInfo: $state(null),
+        authError: $state(''),
+        userIsFound: $state(false)
+    };
+}
+export class KeycloakService {
+    keycloak = null;
+    initialized = false;
+    store;
+    fetchUserInfo;
+    onAuthenticated;
+    onLogout;
+    onError;
+    constructor(store, fetchUserInfo, callbacks) {
+        this.store = store;
+        this.fetchUserInfo = fetchUserInfo;
+        this.onAuthenticated = callbacks?.onAuthenticated;
+        this.onLogout = callbacks?.onLogout;
+        this.onError = callbacks?.onError;
+    }
+    async init(config, initOptions = { onLoad: 'login-required', checkLoginIframe: false }) {
+        try {
+            this.keycloak = new Keycloak(config);
+            const authenticated = await this.keycloak.init(initOptions);
+            if (authenticated) {
+                await this.setTokenDetails(this.keycloak.idTokenParsed);
+            }
+            else {
+                this.setTokenDetails(null);
+            }
+            this.initialized = true;
+            this.store.isLoading = false;
+        }
+        catch (error) {
+            this.initialized = false;
+            const errorMessage = error instanceof Error ? error.message : 'Initialization failed';
+            this.store.authError = errorMessage;
+            this.onError?.(errorMessage);
+            this.store.isLoading = false;
+        }
+    }
+    async setTokenDetails(details) {
+        if (!details) {
+            this.store.isAuthenticated = false;
+            this.store.accessToken = '';
+            this.store.idToken = '';
+            this.store.userInfo = null;
+            return;
+        }
+        try {
+            this.store.isAuthenticated = true;
+            this.store.accessToken = this.keycloak.token;
+            this.store.idToken = this.keycloak.idToken;
+            this.store.authError = '';
+            // Fetch user info using provided function
+            const meRet = await this.fetchUserInfo(this.keycloak.token);
+            let extras = {};
+            if (meRet.success) {
+                extras = meRet.data;
+                this.store.userIsFound = true;
+            }
+            else {
+                this.store.authError = meRet.message || 'Failed to fetch user info';
+                this.store.userIsFound = meRet.code === 402;
+            }
+            const userInfo = {
+                id: extras.id,
+                email: details.email,
+                firstName: details.given_name,
+                lastName: details.family_name,
+                otherNames: '',
+                name: details.name,
+                username: details.preferred_username,
+                initials: details.name
+                    ?.split(' ')
+                    .filter((x) => x.length > 1)
+                    .map((x) => x[0])
+                    .join('') || '',
+                department: extras?.department || '',
+                departmentId: extras?.departmentId,
+                role: extras?.role,
+                roleId: extras?.roleId,
+                tags: extras?.tags ?? [],
+                permissions: extras?.permissions ?? [],
+                type: extras?.type,
+                activeDashboardId: extras?.activeDashboardId,
+                district: extras?.district,
+                phoneNumber: extras?.phoneNumber || '',
+                profileImage: extras?.profileImage || '',
+                status: extras?.status || ''
+            };
+            this.store.userInfo = userInfo;
+            this.onAuthenticated?.(userInfo);
+        }
+        catch (error) {
+            const errorMessage = error instanceof Error ? error.message : 'Failed to set token details';
+            this.store.authError = errorMessage;
+            this.onError?.(errorMessage);
+        }
+    }
+    login() {
+        if (this.initialized && this.keycloak) {
+            this.keycloak.login();
+        }
+    }
+    async refreshToken() {
+        if (!this.initialized || !this.keycloak)
+            return;
+        try {
+            const refreshed = await this.keycloak.updateToken(30);
+            if (refreshed) {
+                await this.setTokenDetails(this.keycloak.idTokenParsed);
+            }
+        }
+        catch (error) {
+            const errorMessage = error instanceof Error ? error.message : 'Token refresh failed';
+            this.store.authError = errorMessage;
+            this.onError?.(errorMessage);
+        }
+    }
+    logout() {
+        if (!this.initialized || !this.keycloak)
+            return;
+        this.keycloak.logout();
+        this.store.userInfo = null;
+        this.store.isAuthenticated = false;
+        this.onLogout?.();
+    }
+    getKeycloakInstance() {
+        return this.keycloak;
+    }
+    isInitialized() {
+        return this.initialized;
+    }
+}

package/dist/keycloak/types.d.ts

@@ -0,0 +1,50 @@
+export interface AuthUserInfo {
+    id: string;
+    email: string;
+    firstName: string;
+    lastName: string;
+    otherNames: string;
+    name: string;
+    username: string;
+    initials: string;
+    profileImage: string;
+    role: string;
+    roleId: number;
+    permissions: string[];
+    status: string;
+    department?: string;
+    departmentId?: number;
+    tags?: string[];
+    type?: string;
+    activeDashboardId?: number;
+    district?: string;
+    phoneNumber?: string;
+}
+export interface AuthStore {
+    isLoading: boolean;
+    isAuthenticated: boolean;
+    accessToken: string;
+    idToken: string;
+    userInfo: AuthUserInfo | null;
+    authError: string;
+    userIsFound: boolean;
+}
+export interface KeycloakConfig {
+    url: string;
+    realm: string;
+    clientId: string;
+}
+export interface FetchAuthUserInfoFn {
+    (token?: string): Promise<{
+        success: boolean;
+        data?: any;
+        message?: string;
+        code?: number;
+    }>;
+}
+export interface FetchAuthDashboardsFn {
+    (): Promise<{
+        success: boolean;
+        data?: any;
+    }>;
+}

package/dist/keycloak/types.js

@@ -0,0 +1 @@
+export {};

package/dist/types/index.d.ts

@@ -737,9 +737,14 @@ export interface FilterBuilderItem {
     logicalOperator?: 'AND' | 'OR';
     label?: string;
 }
+export interface FilterBuilderExport {
+    sqlBuild: string;
+    jsonBuild: any[];
+}
 export interface FilterBuilderProps {
     columns?: FilterBuilderColumnConfig[];
     filters?: FilterBuilderItem[];
+    onRunQuery?: (val: FilterBuilderExport) => void;
 }
 export interface ITab {
     id: number | string;

package/dist/ui/datatable/Datatable.svelte.d.ts

@@ -1,5 +1,5 @@
 export declare function refetchDatatable(params?: TableFilter): void;
 import { type DatatableProps, type TableFilter } from '../../index.js';
-declare const Datatable: import("svelte").Component<DatatableProps<any>, {}, "query" | "read">;
+declare const Datatable: import("svelte").Component<DatatableProps<any>, {}, "read" | "query">;
 type Datatable = ReturnType<typeof Datatable>;
 export default Datatable;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rkosafo/cai.components",
-  "version": "0.0.26",
+  "version": "0.0.28",
   "files": [
     "dist",
     "!dist/**/*.test.*",
@@ -58,6 +58,7 @@
     "date-fns": "^4.1.0",
     "felte": "^1.3.0",
     "iconify-icon": "^3.0.0",
+    "keycloak-js": "^26.2.0",
     "lodash": "^4.17.21",
     "mdsvex": "^0.12.6",
     "nanoid": "^5.1.5",