@asgardeo/nextjs 0.1.2 → 0.1.4

package/dist/client/components/presentation/OrganizationList/OrganizationList.d.ts

@@ -0,0 +1,92 @@
+/**
+ * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
+ *
+ * WSO2 LLC. licenses this file to you under the Apache License,
+ * Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import { FC } from 'react';
+import { BaseOrganizationListProps, OrganizationWithSwitchAccess } from '@asgardeo/react';
+/**
+ * Configuration options for the OrganizationList component.
+ */
+export interface OrganizationListConfig {
+    /**
+     * Whether to automatically fetch organizations on mount
+     */
+    autoFetch?: boolean;
+    /**
+     * Filter string for organizations
+     */
+    filter?: string;
+    /**
+     * Number of organizations to fetch per page
+     */
+    limit?: number;
+    /**
+     * Whether to include recursive organizations
+     */
+    recursive?: boolean;
+}
+/**
+ * Props interface for the OrganizationList component.
+ * Uses the enhanced OrganizationContext instead of the useOrganizations hook.
+ */
+export interface OrganizationListProps extends Omit<BaseOrganizationListProps, 'allOrganizations' | 'error' | 'fetchMore' | 'hasMore' | 'isLoading' | 'isLoadingMore' | 'myOrganizations'>, OrganizationListConfig {
+    /**
+     * Function called when an organization is selected/clicked
+     */
+    onOrganizationSelect?: (organization: OrganizationWithSwitchAccess) => void;
+}
+/**
+ * OrganizationList component that provides organization listing functionality with pagination.
+ * This component uses the enhanced OrganizationContext, eliminating the polling issue and
+ * providing better integration with the existing context system.
+ *
+ * @example
+ * ```tsx
+ * import { OrganizationList } from '@asgardeo/react';
+ *
+ * // Basic usage
+ * <OrganizationList />
+ *
+ * // With custom limit and filter
+ * <OrganizationList
+ *   limit={20}
+ *   filter="active"
+ *   onOrganizationSelect={(org) => {
+ *     console.log('Selected organization:', org.name);
+ *   }}
+ * />
+ *
+ * // As a popup dialog
+ * <OrganizationList
+ *   mode="popup"
+ *   open={isOpen}
+ *   onOpenChange={setIsOpen}
+ *   title="Select Organization"
+ * />
+ *
+ * // With custom organization renderer
+ * <OrganizationList
+ *   renderOrganization={(org) => (
+ *     <div key={org.id}>
+ *       <h3>{org.name}</h3>
+ *       <p>Can switch: {org.canSwitch ? 'Yes' : 'No'}</p>
+ *     </div>
+ *   )}
+ * />
+ * ```
+ */
+export declare const OrganizationList: FC<OrganizationListProps>;
+export default OrganizationList;

package/dist/client/components/presentation/OrganizationList/OrganizationList.js

@@ -0,0 +1,75 @@
+/**
+ * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
+ *
+ * WSO2 LLC. licenses this file to you under the Apache License,
+ * Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import { BaseOrganizationList, useOrganization, } from '@asgardeo/react';
+/**
+ * OrganizationList component that provides organization listing functionality with pagination.
+ * This component uses the enhanced OrganizationContext, eliminating the polling issue and
+ * providing better integration with the existing context system.
+ *
+ * @example
+ * ```tsx
+ * import { OrganizationList } from '@asgardeo/react';
+ *
+ * // Basic usage
+ * <OrganizationList />
+ *
+ * // With custom limit and filter
+ * <OrganizationList
+ *   limit={20}
+ *   filter="active"
+ *   onOrganizationSelect={(org) => {
+ *     console.log('Selected organization:', org.name);
+ *   }}
+ * />
+ *
+ * // As a popup dialog
+ * <OrganizationList
+ *   mode="popup"
+ *   open={isOpen}
+ *   onOpenChange={setIsOpen}
+ *   title="Select Organization"
+ * />
+ *
+ * // With custom organization renderer
+ * <OrganizationList
+ *   renderOrganization={(org) => (
+ *     <div key={org.id}>
+ *       <h3>{org.name}</h3>
+ *       <p>Can switch: {org.canSwitch ? 'Yes' : 'No'}</p>
+ *     </div>
+ *   )}
+ * />
+ * ```
+ */
+export const OrganizationList = ({ autoFetch = true, filter = '', limit = 10, onOrganizationSelect, recursive = false, ...baseProps }) => {
+    const { getAllOrganizations, error, isLoading, myOrganizations } = useOrganization();
+    const [allOrganizations, setAllOrganizations] = useState({
+        organizations: [],
+    });
+    useEffect(() => {
+        (async () => {
+            setAllOrganizations(await getAllOrganizations());
+        })();
+    }, []);
+    return (_jsx(BaseOrganizationList, { allOrganizations: allOrganizations, myOrganizations: myOrganizations, error: error, isLoading: isLoading, onOrganizationSelect: onOrganizationSelect, ...baseProps }));
+};
+export default OrganizationList;
+//# sourceMappingURL=OrganizationList.js.map

package/dist/client/components/presentation/OrganizationList/OrganizationList.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrganizationList.js","sourceRoot":"","sources":["../../../../../src/client/components/presentation/OrganizationList/OrganizationList.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AAEH,YAAY,CAAC;;AAGb,OAAO,EAAmB,SAAS,EAA0B,QAAQ,EAAC,MAAM,OAAO,CAAC;AACpF,OAAO,EAEL,oBAAoB,EACpB,eAAe,GAEhB,MAAM,iBAAiB,CAAC;AAwCzB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAuCG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAA8B,CAAC,EAC1D,SAAS,GAAG,IAAI,EAChB,MAAM,GAAG,EAAE,EACX,KAAK,GAAG,EAAE,EACV,oBAAoB,EACpB,SAAS,GAAG,KAAK,EACjB,GAAG,SAAS,EACU,EAAgB,EAAE;IACxC,MAAM,EAAC,mBAAmB,EAAE,KAAK,EAAE,SAAS,EAAE,eAAe,EAAC,GAAG,eAAe,EAAE,CAAC;IAEnF,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAA8B;QACpF,aAAa,EAAE,EAAE;KAClB,CAAC,CAAC;IAEH,SAAS,CAAC,GAAG,EAAE;QACb,CAAC,KAAK,IAAI,EAAE;YACV,mBAAmB,CAAC,MAAM,mBAAmB,EAAE,CAAC,CAAC;QACnD,CAAC,CAAC,EAAE,CAAC;IACP,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,KAAC,oBAAoB,IACnB,gBAAgB,EAAE,gBAAgB,EAClC,eAAe,EAAE,eAAe,EAChC,KAAK,EAAE,KAAK,EACZ,SAAS,EAAE,SAAS,EACpB,oBAAoB,EAAE,oBAAoB,KACtC,SAAS,GACb,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,gBAAgB,CAAC"}

package/dist/client/components/presentation/OrganizationProfile/OrganizationProfile.d.ts

@@ -0,0 +1,119 @@
+/**
+ * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
+ *
+ * WSO2 LLC. licenses this file to you under the Apache License,
+ * Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import { FC, ReactElement } from 'react';
+import { BaseOrganizationProfileProps } from '@asgardeo/react';
+/**
+ * Props for the OrganizationProfile component.
+ * Extends BaseOrganizationProfileProps but makes the organization prop optional
+ * since it will be fetched using the organizationId
+ */
+export type OrganizationProfileProps = Omit<BaseOrganizationProfileProps, 'organization' | 'mode'> & {
+    /**
+     * Component to show when there's an error loading organization data.
+     */
+    errorFallback?: ReactElement;
+    /**
+     * Component to show while loading organization data.
+     */
+    loadingFallback?: ReactElement;
+    /**
+     * Display mode for the component.
+     */
+    mode?: 'default' | 'popup';
+    /**
+     * Callback fired when the popup should be closed (only used in popup mode).
+     */
+    onOpenChange?: (open: boolean) => void;
+    /**
+     * Callback fired when the organization should be updated.
+     */
+    onUpdate?: (payload: any) => Promise<void>;
+    /**
+     * Whether the popup is open (only used in popup mode).
+     */
+    open?: boolean;
+    /**
+     * The ID of the organization to fetch and display.
+     */
+    organizationId: string;
+    /**
+     * Custom title for the popup dialog (only used in popup mode).
+     */
+    popupTitle?: string;
+};
+/**
+ * OrganizationProfile component displays organization information in a
+ * structured and styled format. It automatically fetches organization details
+ * using the provided organization ID and displays them using BaseOrganizationProfile.
+ *
+ * The component supports editing functionality, allowing users to modify organization
+ * fields inline. Updates are automatically synced with the backend via the SCIM2 API.
+ *
+ * This component is the React-specific implementation that automatically
+ * retrieves the organization data from Asgardeo API.
+ *
+ * @example
+ * ```tsx
+ * // Basic usage with editing enabled (default)
+ * <OrganizationProfile organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1" />
+ *
+ * // Read-only mode
+ * <OrganizationProfile
+ *   organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1"
+ *   editable={false}
+ * />
+ *
+ * // With card layout and custom fallbacks
+ * <OrganizationProfile
+ *   organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1"
+ *   cardLayout={true}
+ *   loadingFallback={<div>Loading organization...</div>}
+ *   errorFallback={<div>Failed to load organization</div>}
+ *   fallback={<div>No organization data available</div>}
+ * />
+ *
+ * // With custom fields configuration and update callback
+ * <OrganizationProfile
+ *   organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1"
+ *   fields={[
+ *     { key: 'id', label: 'Organization ID', editable: false },
+ *     { key: 'name', label: 'Organization Name', editable: true },
+ *     { key: 'description', label: 'Description', editable: true, render: (value) => value || 'No description' },
+ *     { key: 'created', label: 'Created Date', editable: false, render: (value) => new Date(value).toLocaleDateString() },
+ *     { key: 'lastModified', label: 'Last Modified Date', editable: false, render: (value) => new Date(value).toLocaleDateString() },
+ *     { key: 'attributes', label: 'Custom Attributes', editable: true }
+ *   ]}
+ *   onUpdate={async (payload) => {
+ *     console.log('Organization updated:', payload);
+ *     // payload contains the updated field values
+ *     // The component automatically converts these to patch operations
+ *   }}
+ * />
+ *
+ * // In popup mode
+ * <OrganizationProfile
+ *   organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1"
+ *   mode="popup"
+ *   open={isOpen}
+ *   onOpenChange={setIsOpen}
+ *   popupTitle="Edit Organization Profile"
+ * />
+ * ```
+ */
+declare const OrganizationProfile: FC<OrganizationProfileProps>;
+export default OrganizationProfile;

package/dist/client/components/presentation/OrganizationProfile/OrganizationProfile.js

@@ -0,0 +1,145 @@
+/**
+ * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
+ *
+ * WSO2 LLC. licenses this file to you under the Apache License,
+ * Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import { BaseOrganizationProfile, useTranslation } from '@asgardeo/react';
+import { updateOrganization, createPatchOperations } from '@asgardeo/node';
+import useAsgardeo from '../../../contexts/Asgardeo/useAsgardeo';
+import getOrganizationAction from '../../../../server/actions/getOrganizationAction';
+import getSessionId from '../../../../server/actions/getSessionId';
+/**
+ * OrganizationProfile component displays organization information in a
+ * structured and styled format. It automatically fetches organization details
+ * using the provided organization ID and displays them using BaseOrganizationProfile.
+ *
+ * The component supports editing functionality, allowing users to modify organization
+ * fields inline. Updates are automatically synced with the backend via the SCIM2 API.
+ *
+ * This component is the React-specific implementation that automatically
+ * retrieves the organization data from Asgardeo API.
+ *
+ * @example
+ * ```tsx
+ * // Basic usage with editing enabled (default)
+ * <OrganizationProfile organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1" />
+ *
+ * // Read-only mode
+ * <OrganizationProfile
+ *   organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1"
+ *   editable={false}
+ * />
+ *
+ * // With card layout and custom fallbacks
+ * <OrganizationProfile
+ *   organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1"
+ *   cardLayout={true}
+ *   loadingFallback={<div>Loading organization...</div>}
+ *   errorFallback={<div>Failed to load organization</div>}
+ *   fallback={<div>No organization data available</div>}
+ * />
+ *
+ * // With custom fields configuration and update callback
+ * <OrganizationProfile
+ *   organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1"
+ *   fields={[
+ *     { key: 'id', label: 'Organization ID', editable: false },
+ *     { key: 'name', label: 'Organization Name', editable: true },
+ *     { key: 'description', label: 'Description', editable: true, render: (value) => value || 'No description' },
+ *     { key: 'created', label: 'Created Date', editable: false, render: (value) => new Date(value).toLocaleDateString() },
+ *     { key: 'lastModified', label: 'Last Modified Date', editable: false, render: (value) => new Date(value).toLocaleDateString() },
+ *     { key: 'attributes', label: 'Custom Attributes', editable: true }
+ *   ]}
+ *   onUpdate={async (payload) => {
+ *     console.log('Organization updated:', payload);
+ *     // payload contains the updated field values
+ *     // The component automatically converts these to patch operations
+ *   }}
+ * />
+ *
+ * // In popup mode
+ * <OrganizationProfile
+ *   organizationId="0d5e071b-d3d3-475d-b3c6-1a20ee2fa9b1"
+ *   mode="popup"
+ *   open={isOpen}
+ *   onOpenChange={setIsOpen}
+ *   popupTitle="Edit Organization Profile"
+ * />
+ * ```
+ */
+const OrganizationProfile = ({ organizationId, mode = 'default', open = false, onOpenChange, onUpdate, popupTitle, loadingFallback = _jsx("div", { children: "Loading organization..." }), errorFallback = _jsx("div", { children: "Failed to load organization data" }), ...rest }) => {
+    const { baseUrl } = useAsgardeo();
+    const { t } = useTranslation();
+    const [organization, setOrganization] = useState(null);
+    const [loading, setLoading] = useState(true);
+    const [error, setError] = useState(false);
+    const fetchOrganization = async () => {
+        if (!baseUrl || !organizationId) {
+            setLoading(false);
+            setError(true);
+            return;
+        }
+        try {
+            setLoading(true);
+            setError(false);
+            const result = await getOrganizationAction(organizationId, (await getSessionId()));
+            if (result.data?.organization) {
+                setOrganization(result.data.organization);
+                return;
+            }
+            setError(true);
+        }
+        catch (err) {
+            console.error('Failed to fetch organization:', err);
+            setError(true);
+            setOrganization(null);
+        }
+        finally {
+            setLoading(false);
+        }
+    };
+    useEffect(() => {
+        fetchOrganization();
+    }, [baseUrl, organizationId]);
+    const handleOrganizationUpdate = async (payload) => {
+        if (!baseUrl || !organizationId)
+            return;
+        try {
+            // Convert payload to patch operations format
+            const operations = createPatchOperations(payload);
+            await updateOrganization({
+                baseUrl,
+                organizationId,
+                operations,
+            });
+            // Refetch organization data after update
+            await fetchOrganization();
+            // Call the optional onUpdate callback
+            if (onUpdate) {
+                await onUpdate(payload);
+            }
+        }
+        catch (err) {
+            console.error('Failed to update organization:', err);
+            throw err;
+        }
+    };
+    return (_jsx(BaseOrganizationProfile, { organization: organization, onUpdate: handleOrganizationUpdate, mode: mode === 'popup' ? 'popup' : 'inline', open: open, onOpenChange: onOpenChange, title: popupTitle || t('organization.profile.title'), ...rest }));
+};
+export default OrganizationProfile;
+//# sourceMappingURL=OrganizationProfile.js.map

package/dist/client/components/presentation/OrganizationProfile/OrganizationProfile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrganizationProfile.js","sourceRoot":"","sources":["../../../../../src/client/components/presentation/OrganizationProfile/OrganizationProfile.tsx"],"names":[],"mappings":"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"}

package/dist/client/components/presentation/OrganizationSwitcher/OrganizationSwitcher.d.ts

@@ -0,0 +1,71 @@
+/**
+ * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
+ *
+ * WSO2 LLC. licenses this file to you under the Apache License,
+ * Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+import { FC, ReactElement } from 'react';
+import { BaseOrganizationSwitcherProps } from '@asgardeo/react';
+import { Organization } from '@asgardeo/node';
+/**
+ * Props interface for the OrganizationSwitcher component.
+ * Makes organizations optional since they'll be retrieved from OrganizationContext.
+ */
+export interface OrganizationSwitcherProps extends Omit<BaseOrganizationSwitcherProps, 'organizations' | 'currentOrganization' | 'onOrganizationSwitch'> {
+    /**
+     * Optional override for current organization (will use context if not provided)
+     */
+    currentOrganization?: Organization;
+    /**
+     * Fallback element to render when the user is not signed in.
+     */
+    fallback?: ReactElement;
+    /**
+     * Optional callback for organization switch (will use context if not provided)
+     */
+    onOrganizationSwitch?: (organization: Organization) => Promise<void> | void;
+    /**
+     * Optional override for organizations list (will use context if not provided)
+     */
+    organizations?: Organization[];
+}
+/**
+ * OrganizationSwitcher component that provides organization switching functionality.
+ * This component automatically retrieves organizations from the OrganizationContext.
+ * You can also override the organizations, currentOrganization, and onOrganizationSwitch
+ * by passing them as props.
+ *
+ * @example
+ * ```tsx
+ * import { OrganizationSwitcher } from '@asgardeo/react';
+ *
+ * // Basic usage - uses OrganizationContext
+ * <OrganizationSwitcher />
+ *
+ * // With custom organization switch handler
+ * <OrganizationSwitcher
+ *   onOrganizationSwitch={(org) => {
+ *     console.log('Switching to:', org.name);
+ *     // Custom logic here
+ *   }}
+ * />
+ *
+ * // With fallback for unauthenticated users
+ * <OrganizationSwitcher
+ *   fallback={<div>Please sign in to view organizations</div>}
+ * />
+ * ```
+ */
+export declare const OrganizationSwitcher: FC<OrganizationSwitcherProps>;
+export default OrganizationSwitcher;

package/dist/client/components/presentation/OrganizationSwitcher/OrganizationSwitcher.js

@@ -0,0 +1,102 @@
+/**
+ * Copyright (c) 2025, WSO2 LLC. (https://www.wso2.com).
+ *
+ * WSO2 LLC. licenses this file to you under the Apache License,
+ * Version 2.0 (the "License"); you may not use this file except
+ * in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+'use client';
+import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { BaseOrganizationSwitcher, BuildingAlt, useOrganization, useTranslation, } from '@asgardeo/react';
+import useAsgardeo from '../../../contexts/Asgardeo/useAsgardeo';
+import { CreateOrganization } from '../CreateOrganization/CreateOrganization';
+import OrganizationProfile from '../OrganizationProfile/OrganizationProfile';
+import OrganizationList from '../OrganizationList/OrganizationList';
+/**
+ * OrganizationSwitcher component that provides organization switching functionality.
+ * This component automatically retrieves organizations from the OrganizationContext.
+ * You can also override the organizations, currentOrganization, and onOrganizationSwitch
+ * by passing them as props.
+ *
+ * @example
+ * ```tsx
+ * import { OrganizationSwitcher } from '@asgardeo/react';
+ *
+ * // Basic usage - uses OrganizationContext
+ * <OrganizationSwitcher />
+ *
+ * // With custom organization switch handler
+ * <OrganizationSwitcher
+ *   onOrganizationSwitch={(org) => {
+ *     console.log('Switching to:', org.name);
+ *     // Custom logic here
+ *   }}
+ * />
+ *
+ * // With fallback for unauthenticated users
+ * <OrganizationSwitcher
+ *   fallback={<div>Please sign in to view organizations</div>}
+ * />
+ * ```
+ */
+export const OrganizationSwitcher = ({ currentOrganization: propCurrentOrganization, fallback = _jsx(_Fragment, {}), onOrganizationSwitch: propOnOrganizationSwitch, organizations: propOrganizations, ...props }) => {
+    const { isSignedIn } = useAsgardeo();
+    const { currentOrganization: contextCurrentOrganization, myOrganizations: contextOrganizations, switchOrganization, isLoading, error, } = useOrganization();
+    const [isCreateOrgOpen, setIsCreateOrgOpen] = useState(false);
+    const [isProfileOpen, setIsProfileOpen] = useState(false);
+    const [isOrganizationListOpen, setIsOrganizationListOpen] = useState(false);
+    const { t } = useTranslation();
+    if (!isSignedIn && fallback) {
+        return fallback;
+    }
+    if (!isSignedIn) {
+        return _jsx(_Fragment, {});
+    }
+    const organizations = propOrganizations || contextOrganizations || [];
+    const currentOrganization = propCurrentOrganization || contextCurrentOrganization;
+    const onOrganizationSwitch = propOnOrganizationSwitch || switchOrganization;
+    const handleManageOrganizations = () => {
+        setIsOrganizationListOpen(true);
+    };
+    const handleManageOrganization = () => {
+        setIsProfileOpen(true);
+    };
+    const defaultMenuItems = [];
+    if (currentOrganization) {
+        defaultMenuItems.push({
+            icon: _jsx(BuildingAlt, {}),
+            label: t('organization.switcher.manage.organizations'),
+            onClick: handleManageOrganizations,
+        });
+    }
+    defaultMenuItems.push({
+        icon: (_jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: _jsx("path", { d: "M12 5v14m-7-7h14" }) })),
+        label: t('organization.switcher.create.organization'),
+        onClick: () => setIsCreateOrgOpen(true),
+    });
+    const menuItems = props.menuItems ? [...defaultMenuItems, ...props.menuItems] : defaultMenuItems;
+    return (_jsxs(_Fragment, { children: [_jsx(BaseOrganizationSwitcher, { organizations: organizations, currentOrganization: currentOrganization, onOrganizationSwitch: onOrganizationSwitch, loading: isLoading, error: error, menuItems: menuItems, onManageProfile: handleManageOrganization, ...props }), _jsx(CreateOrganization, { mode: "popup", open: isCreateOrgOpen, onOpenChange: setIsCreateOrgOpen, onSuccess: (org) => {
+                    if (org && onOrganizationSwitch) {
+                        onOrganizationSwitch(org);
+                    }
+                    setIsCreateOrgOpen(false);
+                } }), currentOrganization && (_jsx(OrganizationProfile, { organizationId: currentOrganization.id, mode: "popup", open: isProfileOpen, onOpenChange: setIsProfileOpen, cardLayout: true, loadingFallback: _jsx("div", { children: t('organization.profile.loading') }), errorFallback: _jsx("div", { children: t('organization.profile.error') }) })), _jsx(OrganizationList, { mode: "popup", open: isOrganizationListOpen, onOpenChange: setIsOrganizationListOpen, title: t('organization.switcher.manage.organizations'), onOrganizationSelect: (organization) => {
+                    if (onOrganizationSwitch) {
+                        onOrganizationSwitch(organization);
+                    }
+                    setIsOrganizationListOpen(false);
+                } })] }));
+};
+export default OrganizationSwitcher;
+//# sourceMappingURL=OrganizationSwitcher.js.map

package/dist/client/components/presentation/OrganizationSwitcher/OrganizationSwitcher.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrganizationSwitcher.js","sourceRoot":"","sources":["../../../../../src/client/components/presentation/OrganizationSwitcher/OrganizationSwitcher.tsx"],"names":[],"mappings":"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"}

package/dist/client/components/presentation/UserProfile/UserProfile.js

@@ -20,7 +20,6 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { BaseUserProfile, useUser } from '@asgardeo/react';
 import useAsgardeo from '../../../contexts/Asgardeo/useAsgardeo';
 import getSessionId from '../../../../server/actions/getSessionId';
-import updateUserProfileAction from '../../../../server/actions/updateUserProfileAction';
 /**
  * UserProfile component displays the authenticated user's profile information in a
  * structured and styled format. It shows user details such as display name, email,
@@ -46,10 +45,10 @@ import updateUserProfileAction from '../../../../server/actions/updateUserProfil
  */
 const UserProfile = ({ ...rest }) => {
     const { baseUrl } = useAsgardeo();
-    const { profile, flattenedProfile, schemas, revalidateProfile } = useUser();
+    const { profile, flattenedProfile, schemas, onUpdateProfile, updateProfile } = useUser();
     const handleProfileUpdate = async (payload) => {
-        await updateUserProfileAction(payload, (await getSessionId()));
-        await revalidateProfile();
+        const result = await updateProfile(payload, (await getSessionId()));
+        onUpdateProfile(result?.data?.user);
     };
     return (_jsx(BaseUserProfile, { profile: profile, flattenedProfile: flattenedProfile, schemas: schemas, onUpdate: handleProfileUpdate, ...rest }));
 };

package/dist/client/components/presentation/UserProfile/UserProfile.js.map

@@ -1 +1 @@
-{"version":3,"file":"UserProfile.js","sourceRoot":"","sources":["../../../../../src/client/components/presentation/UserProfile/UserProfile.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AAEH,YAAY,CAAC;;AAGb,OAAO,EAAC,eAAe,EAAwB,OAAO,EAAC,MAAM,iBAAiB,CAAC;AAC/E,OAAO,WAAW,MAAM,wCAAwC,CAAC;AACjE,OAAO,YAAY,MAAM,yCAAyC,CAAC;AACnE,OAAO,uBAAuB,MAAM,oDAAoD,CAAC;AASzF;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,MAAM,WAAW,GAAyB,CAAC,EAAC,GAAG,IAAI,EAAmB,EAAgB,EAAE;IACtF,MAAM,EAAC,OAAO,EAAC,GAAG,WAAW,EAAE,CAAC;IAChC,MAAM,EAAC,OAAO,EAAE,gBAAgB,EAAE,OAAO,EAAE,iBAAiB,EAAC,GAAG,OAAO,EAAE,CAAC;IAE1E,MAAM,mBAAmB,GAAG,KAAK,EAAE,OAAY,EAAiB,EAAE;QAChE,MAAM,uBAAuB,CAAC,OAAO,EAAE,CAAC,MAAM,YAAY,EAAE,CAAW,CAAC,CAAC;QACzE,MAAM,iBAAiB,EAAE,CAAC;IAC5B,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,eAAe,IACd,OAAO,EAAE,OAAe,EACxB,gBAAgB,EAAE,gBAAwB,EAC1C,OAAO,EAAE,OAAmB,EAC5B,QAAQ,EAAE,mBAAmB,KACzB,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"UserProfile.js","sourceRoot":"","sources":["../../../../../src/client/components/presentation/UserProfile/UserProfile.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;GAgBG;AAEH,YAAY,CAAC;;AAGb,OAAO,EAAC,eAAe,EAAwB,OAAO,EAAC,MAAM,iBAAiB,CAAC;AAC/E,OAAO,WAAW,MAAM,wCAAwC,CAAC;AACjE,OAAO,YAAY,MAAM,yCAAyC,CAAC;AAUnE;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,MAAM,WAAW,GAAyB,CAAC,EAAC,GAAG,IAAI,EAAmB,EAAgB,EAAE;IACtF,MAAM,EAAC,OAAO,EAAC,GAAG,WAAW,EAAE,CAAC;IAChC,MAAM,EAAC,OAAO,EAAE,gBAAgB,EAAE,OAAO,EAAE,eAAe,EAAE,aAAa,EAAC,GAAG,OAAO,EAAE,CAAC;IAEvF,MAAM,mBAAmB,GAAG,KAAK,EAAE,OAAY,EAAiB,EAAE;QAChE,MAAM,MAAM,GAAG,MAAM,aAAa,CAAC,OAAO,EAAE,CAAC,MAAM,YAAY,EAAE,CAAW,CAAC,CAAC;QAC9E,eAAe,CAAC,MAAM,EAAE,IAAI,EAAE,IAAI,CAAC,CAAC;IACtC,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,eAAe,IACd,OAAO,EAAE,OAAe,EACxB,gBAAgB,EAAE,gBAAwB,EAC1C,OAAO,EAAE,OAAmB,EAC5B,QAAQ,EAAE,mBAAmB,KACzB,IAAI,GACR,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/client/contexts/Asgardeo/AsgardeoContext.js

@@ -21,6 +21,8 @@ import { createContext } from 'react';
  * Context object for managing the Authentication flow builder core context.
  */
 const AsgardeoContext = createContext({
+    organizationHandle: undefined,
+    applicationId: undefined,
     signInUrl: undefined,
     signUpUrl: undefined,
     afterSignInUrl: undefined,