@edifice.io/react 2.6.2 → 2.6.3-develop-enabling.20260825190837

package/dist/modules/homepage/components/Notifications/components/ReportNotificationModal.js

@@ -0,0 +1,31 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+import SvgIconAlertTriangle from "../../../../icons/components/IconAlertTriangle.js";
+import Modal from "../../../../../components/Modal/Modal.js";
+import ButtonBeta from "../../../../../components/ButtonBeta/ButtonBeta.js";
+const ReportNotificationModal = ({
+  isOpen,
+  onCancel,
+  onConfirm
+}) => {
+  const {
+    t
+  } = useTranslation();
+  return /* @__PURE__ */ jsxs(Modal, { id: "report-notification-modal", size: "lg", isOpen, onModalClose: onCancel, children: [
+    /* @__PURE__ */ jsx(Modal.Header, { onModalClose: onCancel, children: t("homepage.notifications.report-modal.title", {
+      defaultValue: "Signaler une notification"
+    }) }),
+    /* @__PURE__ */ jsx(Modal.Body, { children: /* @__PURE__ */ jsx("p", { children: t("homepage.notifications.report-modal.body", {
+      defaultValue: "Attention ! Vous souhaitez signaler une notification inappropriée ou qui ne respecte pas les conditions d'utilisation de ONE. L'heure et l'origine de ce signalement seront enregistrées et transmises à un administrateur pour traitement."
+    }) }) }),
+    /* @__PURE__ */ jsxs(Modal.Footer, { children: [
+      /* @__PURE__ */ jsx(ButtonBeta, { color: "tertiary", onClick: onCancel, type: "button", variant: "ghost", children: t("cancel") }),
+      /* @__PURE__ */ jsx(ButtonBeta, { color: "default", onClick: onConfirm, type: "button", variant: "filled", leftIcon: /* @__PURE__ */ jsx(SvgIconAlertTriangle, {}), children: t("homepage.notifications.report-modal.confirm", {
+        defaultValue: "Signaler la notification"
+      }) })
+    ] })
+  ] });
+};
+export {
+  ReportNotificationModal as default
+};

package/dist/modules/homepage/components/Notifications/components/SystemNotificationItem.d.ts

@@ -1,6 +1,8 @@
+import { ReactNode } from 'react';
 import { SystemWebNotification } from './notificationAdapter';
 export type SystemNotificationItemProps = {
     notification: SystemWebNotification;
+    menu?: ReactNode;
 };
 /**
  * Renders a system notification (no sender) using an app icon as the picture.
@@ -9,7 +11,7 @@ export type SystemNotificationItemProps = {
  * rather than this component directly.
  */
 declare const SystemNotificationItem: {
-    ({ notification, }: SystemNotificationItemProps): import("react/jsx-runtime").JSX.Element;
+    ({ notification, menu, }: SystemNotificationItemProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export default SystemNotificationItem;

package/dist/modules/homepage/components/Notifications/components/SystemNotificationItem.js

@@ -3,7 +3,8 @@ import { useTranslation } from "react-i18next";
 import CommonNotificationItem from "./CommonNotificationItem.js";
 import AppIcon from "../../../../../components/AppIcon/AppIcon.js";
 const SystemNotificationItem = ({
-  notification
+  notification,
+  menu
 }) => {
   const {
     params,
@@ -13,7 +14,7 @@ const SystemNotificationItem = ({
   } = notification, {
     t
   } = useTranslation(), appName = t(params.appCode);
-  return /* @__PURE__ */ jsx(CommonNotificationItem, { uri, message, date, picture: /* @__PURE__ */ jsx("a", { href: uri, title: appName, "data-testid": "notification-item-app-icon", "aria-label": t("homepage.notifications.app-icon.placeholder"), children: /* @__PURE__ */ jsx(AppIcon, { app: params.appCode, size: "24", variant: "square", className: "notification-item-app-icon" }) }) });
+  return /* @__PURE__ */ jsx(CommonNotificationItem, { uri, message, date, menu, picture: /* @__PURE__ */ jsx("a", { href: uri, title: appName, "data-testid": "notification-item-app-icon", "aria-label": t("homepage.notifications.app-icon.placeholder"), children: /* @__PURE__ */ jsx(AppIcon, { app: params.appCode, size: "24", variant: "square", className: "notification-item-app-icon" }) }) });
 };
 export {
   SystemNotificationItem as default

package/dist/modules/homepage/components/Notifications/components/UserNotificationItem.d.ts

@@ -1,6 +1,8 @@
+import { ReactNode } from 'react';
 import { UserWebNotification } from './notificationAdapter';
 export type UserNotificationItemProps = {
     notification: UserWebNotification;
+    menu?: ReactNode;
 };
 /**
  * Renders a user-triggered notification using the sender's avatar as the picture.
@@ -9,7 +11,7 @@ export type UserNotificationItemProps = {
  * — prefer using `Notification` at the top level rather than this component directly.
  */
 declare const UserNotificationItem: {
-    ({ notification }: UserNotificationItemProps): import("react/jsx-runtime").JSX.Element;
+    ({ notification, menu, }: UserNotificationItemProps): import("react/jsx-runtime").JSX.Element;
     displayName: string;
 };
 export default UserNotificationItem;

package/dist/modules/homepage/components/Notifications/components/UserNotificationItem.js

@@ -5,7 +5,8 @@ import NotificationItemResource from "./NotificationItemResource.js";
 import useDirectory from "../../../../../hooks/useDirectory/useDirectory.js";
 import Avatar from "../../../../../components/Avatar/Avatar.js";
 const UserNotificationItem = ({
-  notification
+  notification,
+  menu
 }) => {
   const {
     getAvatarURL,
@@ -18,7 +19,7 @@ const UserNotificationItem = ({
   } = notification, {
     t
   } = useTranslation(), userName = t(params.username);
-  return /* @__PURE__ */ jsx(CommonNotificationItem, { uri, message, date, picture: /* @__PURE__ */ jsx("a", { href: getUserbookURL(params.userId, "user"), title: userName, "data-testid": "notification-item-avatar", children: /* @__PURE__ */ jsx(Avatar, { "aria-label": t("homepage.notifications.avatar.placeholder"), src: getAvatarURL(params.userId, "user"), alt: userName, variant: "circle", className: "notification-item-avatar" }) }), children: /* @__PURE__ */ jsx(NotificationItemResource, { appCode: params.appCode }) });
+  return /* @__PURE__ */ jsx(CommonNotificationItem, { uri, message, date, menu, picture: /* @__PURE__ */ jsx("a", { href: getUserbookURL(params.userId, "user"), title: userName, "data-testid": "notification-item-avatar", children: /* @__PURE__ */ jsx(Avatar, { "aria-label": t("homepage.notifications.avatar.placeholder"), src: getAvatarURL(params.userId, "user"), alt: userName, variant: "circle", className: "notification-item-avatar" }) }), children: /* @__PURE__ */ jsx(NotificationItemResource, { appCode: params.appCode, appI18nKey: params.appI18nKey }) });
 };
 export {
   UserNotificationItem as default

package/dist/modules/homepage/components/Notifications/components/notificationAdapter.d.ts

@@ -1,15 +1,21 @@
 import { NotificationModel } from '@edifice.io/client';
-type WebNotificationBase = {
+type NotificationType = 'system' | 'user';
+interface WebNotificationParamsBase {
+    appCode: string;
+    appI18nKey: string;
+}
+interface WebNotificationBase {
+    type: NotificationType;
     id: string;
     uri?: string;
     message: string;
     date: Date;
-};
+    params: WebNotificationParamsBase;
+}
 /** Notification triggered by another user (e.g. shared a resource). */
 export type UserWebNotification = WebNotificationBase & {
     type: 'user';
-    params: {
-        appCode: string;
+    params: WebNotificationParamsBase & {
         username: string;
         userId: string;
     };
@@ -17,11 +23,20 @@ export type UserWebNotification = WebNotificationBase & {
 /** Notification triggered by an application event (no sender). */
 export type SystemWebNotification = WebNotificationBase & {
     type: 'system';
-    params: {
-        appCode: string;
-    };
 };
 /** Discriminated union — narrow on `type` to get the specific variant. */
 export type WebNotification = UserWebNotification | SystemWebNotification;
+export declare const getAppCodeAndI18nKey: (appCode: string) => [string, string];
+/**
+ * Transforms a raw `NotificationModel` (API shape) into a `WebNotification`
+ * ready for rendering.
+ *
+ * Responsibilities:
+ * - Determines the variant: **user** when a `sender` is present, **system** otherwise.
+ * - Resolves the target URI from the model's `params` (handles both user and system naming conventions).
+ * - Converts the MongoDB `$date` timestamp to a JS `Date`.
+ * - Normalises the `type` field into a kebab-case `appCode` (e.g. `"BLOG_POST"` → `"blog-post"`).
+ * - Strips anchor tags from the message, keeping only the inner text as `<strong>`.
+ */
 export declare const notificationAdapter: (notification: NotificationModel) => WebNotification;
 export {};

package/dist/modules/homepage/components/Notifications/components/notificationAdapter.js

@@ -1,30 +1,45 @@
-const resolveNotificationResourceUri = (params, type) => {
+const resolveNotificationResourceUri = (params, type, appCode, eventType) => {
+  if (appCode === "timeline" && eventType === "NOTIFY-REPORT")
+    return "/admin";
   if (type === "user")
     return params.resourceUri || params.uri;
   for (const [key, value] of Object.entries(params))
     if (typeof value == "string" && value.length > 0 && key.endsWith("Uri") && key !== "profilUri" && key !== "resourceFolderUri")
       return value;
-}, parseNotificationMessage = (message) => message.replace(/<\/a>/gi, "</strong>").replace(/<a\b[^>]*>/gi, "<strong>"), getAppCode = (appCode) => {
-  switch (appCode = appCode.toLowerCase(), appCode) {
+}, parseNotificationMessage = (message) => message.replace(/<\/a>/gi, "</strong>").replace(/<a\b[^>]*>/gi, "<strong>"), getAppCodeAndI18nKey = (appCode) => {
+  appCode = appCode.toLowerCase();
+  let appI18nKey = appCode;
+  switch (appCode) {
     case "collaborativewall":
-      return "collaborative-wall";
+      appCode = "collaborative-wall";
+      break;
     case "formulaire":
-      return "forms";
+      appI18nKey = "formulaire", appCode = "forms";
+      break;
     case "messagerie":
-      return "conversation";
+      appI18nKey = appCode = "conversation";
+      break;
     case "news":
-      return "actualites";
+      appI18nKey = appCode = "actualites";
+      break;
     case "homeworks":
-      return "cahier-de-texte";
+      appCode = "cahier-de-texte";
+      break;
     case "userbook_motto":
+      appI18nKey = "userbook_motto", appCode = "userbook";
+      break;
     case "userbook_mood":
+      appI18nKey = "userbook_mood", appCode = "userbook";
+      break;
     case "userbook_discovervisiblegroups":
-      return "userbook";
+      appI18nKey = "userbook_discovervisiblegroups", appCode = "userbook";
+      break;
     default:
-      return appCode.replace(/_/g, "-");
+      appI18nKey = appCode = appCode.replace(/_/g, "-");
   }
+  return [appCode, appI18nKey];
 }, notificationAdapter = (notification) => {
-  const type = notification.sender ? "user" : "system", uri = resolveNotificationResourceUri(notification.params, type), date = new Date(notification.date.$date), appCode = getAppCode(notification.type), message = parseNotificationMessage(notification.message), base = {
+  const type = notification.sender ? "user" : "system", [appCode, appI18nKey] = getAppCodeAndI18nKey(notification.type), uri = resolveNotificationResourceUri(notification.params, type, appCode, notification["event-type"] || notification.eventType), date = new Date(notification.date.$date), message = parseNotificationMessage(notification.message), base = {
     id: notification._id,
     uri,
     message,
@@ -38,16 +53,19 @@ const resolveNotificationResourceUri = (params, type) => {
       // cannot be undefined if sender is present (user type)
       userId: notification.sender,
       // cannot be undefined if sender is present (user type)
-      appCode
+      appCode,
+      appI18nKey
     }
   } : {
     ...base,
     type: "system",
     params: {
-      appCode
+      appCode,
+      appI18nKey
     }
   };
 };
 export {
+  getAppCodeAndI18nKey,
   notificationAdapter
 };

package/dist/modules/homepage/components/Notifications/hooks/useNotificationList.d.ts

@@ -2,8 +2,12 @@ import { NotificationModel } from '@edifice.io/client';
 export interface UseNotificationListContainerReturn {
     /** Array of notifications */
     notifications: NotificationModel[] | undefined;
-    /** Array of notification types */
+    /** Array of all notification types available */
     notificationTypes: string[] | undefined;
+    /** Array of notification types currently selected as filter */
+    selectedTypes: string[] | undefined;
+    /** Callback to change the selected notification types filter */
+    setSelectedTypes: (types: string[]) => void;
     /** Indicates if there are more notifications to load */
     hasNextPage: boolean | undefined;
     /** Callback to load the next page of notifications */
@@ -18,3 +22,9 @@ export interface UseNotificationListContainerReturn {
  * @returns Object containing notifications, loading state, and error state
  */
 export declare const useNotificationListContainer: () => UseNotificationListContainerReturn;
+/**
+ * Indicates whether the user has at least one notification dated today,
+ * across all notification types. Used to display a "new notification"
+ * badge on the notification bell icon, independently of the list overlay.
+ */
+export declare const useHasNotificationToday: () => boolean;

package/dist/modules/homepage/components/Notifications/hooks/useNotificationList.js

@@ -1,4 +1,6 @@
-import { useNotificationTypes, useNotifications } from "../services/queries/notification.js";
+import { useState, useEffect } from "react";
+import { useNotificationTypes, useNotifications, useTimelinePreference, useSaveTimelinePreference } from "../services/queries/notification.js";
+import useDate from "../../../../../hooks/useDate/useDate.js";
 const useNotificationListContainer = () => {
   const {
     data: notificationTypes,
@@ -6,21 +8,51 @@ const useNotificationListContainer = () => {
     isFetched: isFetchedTypes,
     error: errorTypes
   } = useNotificationTypes(), {
+    data: preference,
+    isFetched: isFetchedPreference
+  } = useTimelinePreference(), {
+    mutate: saveTimelinePreference
+  } = useSaveTimelinePreference(), [selectedTypes, setSelectedTypesState] = useState();
+  useEffect(() => {
+    if (selectedTypes === void 0 && isFetchedTypes && isFetchedPreference) {
+      const preferredTypes = preference == null ? void 0 : preference.type;
+      setSelectedTypesState(preferredTypes && preferredTypes.length > 0 ? preferredTypes : notificationTypes ?? []);
+    }
+  }, [selectedTypes, isFetchedTypes, isFetchedPreference, preference, notificationTypes]);
+  const setSelectedTypes = (types) => {
+    setSelectedTypesState(types), saveTimelinePreference({
+      ...preference,
+      type: types
+    });
+  }, {
     data: notifications,
     hasNextPage,
     isLoading: isLoadingNotifications,
     error: errorNotifications,
     fetchNextPage
-  } = useNotifications(notificationTypes ?? [], isFetchedTypes && !!notificationTypes);
+  } = useNotifications(selectedTypes ?? [], isFetchedTypes && !!selectedTypes);
   return {
     notifications,
     notificationTypes,
+    selectedTypes,
+    setSelectedTypes,
     hasNextPage,
     loadNextPage: () => fetchNextPage(),
     isLoading: isLoadingTypes || isLoadingNotifications,
     error: errorTypes || errorNotifications
   };
+}, useHasNotificationToday = () => {
+  const {
+    dateIsToday
+  } = useDate(), {
+    data: notificationTypes,
+    isFetched: isFetchedTypes
+  } = useNotificationTypes(), {
+    data: notifications
+  } = useNotifications(notificationTypes ?? [], isFetchedTypes);
+  return (notifications == null ? void 0 : notifications.some((notification) => dateIsToday(notification.date))) ?? !1;
 };
 export {
+  useHasNotificationToday,
   useNotificationListContainer
 };

package/dist/modules/homepage/components/Notifications/services/api/index.d.ts

@@ -1,4 +1,6 @@
 export declare const notificationService: {
     getNotifications(types: string[], page: number): Promise<import('@edifice.io/client').NotificationModel[]>;
     getNotificationTypes(): Promise<string[]>;
+    reportNotification(id: string): Promise<any>;
+    deleteNotification(id: string): Promise<any>;
 };

package/dist/modules/homepage/components/Notifications/services/api/notificationService.d.ts

@@ -12,4 +12,12 @@ export declare const createNotificationService: (baseURL: string) => {
      */
     getNotifications(types: string[], page: number): Promise<NotificationModel[]>;
     getNotificationTypes(): Promise<string[]>;
+    /**
+     * Report a notification as inappropriate.
+     */
+    reportNotification(id: string): Promise<any>;
+    /**
+     * Delete a notification.
+     */
+    deleteNotification(id: string): Promise<any>;
 };

package/dist/modules/homepage/components/Notifications/services/api/notificationService.js

@@ -14,6 +14,18 @@ const createNotificationService = (baseURL) => ({
   },
   getNotificationTypes() {
     return odeServices.http().get(`${baseURL}/timeline/types`);
+  },
+  /**
+   * Report a notification as inappropriate.
+   */
+  reportNotification(id) {
+    return odeServices.http().put(`${baseURL}/timeline/${id}/report`);
+  },
+  /**
+   * Delete a notification.
+   */
+  deleteNotification(id) {
+    return odeServices.http().put(`${baseURL}/timeline/${id}`);
   }
 });
 export {

package/dist/modules/homepage/components/Notifications/services/queries/notification.d.ts

@@ -1,14 +1,22 @@
 import { NotificationModel } from '@edifice.io/client';
+import { InfiniteData } from '@tanstack/react-query';
+/** Shape of the `timeline` userbook preference (only `type` is read/written here). */
+export interface TimelinePreference {
+    page?: number;
+    type: string[];
+    config?: Record<string, unknown>;
+}
 export declare const notificationQueryKeys: {
     all: () => readonly ["notifications"];
     notifications: (types?: string[]) => readonly ["notifications", "list", string[]];
     types: () => readonly ["notifications", "types"];
+    preference: () => readonly ["notifications", "preference"];
 };
 export declare const notificationQueryOptions: {
     getNotifications(types: string[], enabled: boolean): import('@tanstack/react-query').OmitKeyof<import('@tanstack/react-query').UseInfiniteQueryOptions<NotificationModel[], Error, NotificationModel[], NotificationModel[], readonly ["notifications", "list", string[]], number>, "queryFn"> & {
         queryFn?: import('@tanstack/react-query').QueryFunction<NotificationModel[], readonly ["notifications", "list", string[]], number> | undefined;
     } & {
-        queryKey: import('@tanstack/react-query').DataTag<readonly ["notifications", "list", string[]], import('@tanstack/react-query').InfiniteData<NotificationModel[], unknown>>;
+        queryKey: import('@tanstack/react-query').DataTag<readonly ["notifications", "list", string[]], InfiniteData<NotificationModel[], unknown>>;
     };
     getNotificationTypes(): import('@tanstack/react-query').OmitKeyof<import('@tanstack/react-query').UseQueryOptions<string[], Error, string[], import('@tanstack/react-query').QueryKey>, "queryFn"> & {
         queryFn?: import('@tanstack/react-query').QueryFunction<string[], import('@tanstack/react-query').QueryKey, never> | undefined;
@@ -18,3 +26,7 @@ export declare const notificationQueryOptions: {
 };
 export declare const useNotifications: (types?: string[], enabled?: boolean) => import('@tanstack/react-query').UseInfiniteQueryResult<NotificationModel[], Error>;
 export declare const useNotificationTypes: () => import('@tanstack/react-query').UseQueryResult<string[], Error>;
+export declare const useTimelinePreference: () => import('@tanstack/react-query').UseQueryResult<TimelinePreference, Error>;
+export declare const useSaveTimelinePreference: () => import('@tanstack/react-query').UseMutationResult<void, Error, TimelinePreference, unknown>;
+export declare const useReportNotification: () => import('@tanstack/react-query').UseMutationResult<any, Error, string, unknown>;
+export declare const useDeleteNotification: () => import('@tanstack/react-query').UseMutationResult<any, Error, string, unknown>;

package/dist/modules/homepage/components/Notifications/services/queries/notification.js

@@ -1,9 +1,11 @@
-import { useQuery, useInfiniteQuery, queryOptions, infiniteQueryOptions } from "@tanstack/react-query";
+import { odeServices } from "@edifice.io/client";
+import { useQuery, useInfiniteQuery, useMutation, useQueryClient, queryOptions, infiniteQueryOptions } from "@tanstack/react-query";
 import { notificationService } from "../api/index.js";
 const notificationQueryKeys = {
   all: () => ["notifications"],
   notifications: (types = []) => [...notificationQueryKeys.all(), "list", types],
-  types: () => [...notificationQueryKeys.all(), "types"]
+  types: () => [...notificationQueryKeys.all(), "types"],
+  preference: () => [...notificationQueryKeys.all(), "preference"]
 }, notificationQueryOptions = {
   getNotifications(types, enabled) {
     return infiniteQueryOptions({
@@ -31,10 +33,45 @@ const notificationQueryKeys = {
       queryFn: async () => notificationService.getNotificationTypes()
     });
   }
-}, useNotifications = (types = [], enabled = !0) => useInfiniteQuery(notificationQueryOptions.getNotifications(types, enabled)), useNotificationTypes = () => useQuery(notificationQueryOptions.getNotificationTypes());
+}, useNotifications = (types = [], enabled = !0) => useInfiniteQuery(notificationQueryOptions.getNotifications(types, enabled)), useNotificationTypes = () => useQuery(notificationQueryOptions.getNotificationTypes()), useTimelinePreference = () => useQuery({
+  queryKey: notificationQueryKeys.preference(),
+  queryFn: () => odeServices.conf().getPreference("timeline")
+}), useSaveTimelinePreference = () => {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: (preference) => odeServices.conf().savePreference("timeline", preference),
+    onSuccess: (_data, preference) => {
+      queryClient.setQueryData(notificationQueryKeys.preference(), preference);
+    },
+    onError: () => {
+      queryClient.invalidateQueries({
+        queryKey: notificationQueryKeys.preference()
+      });
+    }
+  });
+}, useReportNotification = () => useMutation({
+  mutationFn: (id) => notificationService.reportNotification(id)
+}), useDeleteNotification = () => {
+  const queryClient = useQueryClient();
+  return useMutation({
+    mutationFn: (id) => notificationService.deleteNotification(id),
+    onSuccess: (_data, id) => {
+      queryClient.setQueriesData({
+        queryKey: [...notificationQueryKeys.all(), "list"]
+      }, (data) => data && {
+        ...data,
+        pages: data.pages.map((page) => page.filter((notification) => notification._id !== id))
+      });
+    }
+  });
+};
 export {
   notificationQueryKeys,
   notificationQueryOptions,
+  useDeleteNotification,
   useNotificationTypes,
-  useNotifications
+  useNotifications,
+  useReportNotification,
+  useSaveTimelinePreference,
+  useTimelinePreference
 };

package/dist/modules/homepage/components/SchoolSpace/SchoolSpace.js

@@ -1,10 +1,12 @@
-import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { useTranslation } from "react-i18next";
 import SvgIconRafterUp from "../../../icons/components/IconRafterUp.js";
+import SvgIconUserSearch from "../../../icons/components/IconUserSearch.js";
 import useToggle from "../../../../hooks/useToggle/useToggle.js";
 import Flex from "../../../../components/Flex/Flex.js";
 import Dropdown from "../../../../components/Dropdown/Dropdown.js";
 import IconButton from "../../../../components/Button/IconButton.js";
+import ButtonBeta from "../../../../components/ButtonBeta/ButtonBeta.js";
 import { getRotateTransitionStyle } from "../../../../utilities/rotate-transition-style/get-rotate-transition-style.js";
 const SchoolSpace = ({
   schools,
@@ -13,16 +15,23 @@ const SchoolSpace = ({
 }) => {
   const [isExpanded, toggleExpanded] = useToggle(!1), {
     t
-  } = useTranslation(), hasManySchools = schools && schools.length > 1;
-  return selectedSchool ? /* @__PURE__ */ jsx("div", { className: "school-space", children: /* @__PURE__ */ jsxs(Flex, { className: "school-space-container", justify: "center", gap: "4", align: "center", children: [
-    /* @__PURE__ */ jsx("b", { children: selectedSchool.name }),
-    hasManySchools && /* @__PURE__ */ jsx(Dropdown, { placement: "bottom-end", onToggle: toggleExpanded, children: (triggerProps) => /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx(IconButton, { ...triggerProps, "aria-label": t("show"), color: "tertiary", variant: "ghost", icon: /* @__PURE__ */ jsx(SvgIconRafterUp, { className: "w-16 min-w-0", style: getRotateTransitionStyle(isExpanded, {
-        degrees: 180
-      }) }) }),
-      /* @__PURE__ */ jsx(Dropdown.Menu, { children: schools.map((school) => /* @__PURE__ */ jsx(Dropdown.Item, { onClick: () => onSelectedSchoolChange == null ? void 0 : onSelectedSchoolChange(school), children: /* @__PURE__ */ jsx(Flex, { direction: "column", children: /* @__PURE__ */ jsx("p", { children: school.name }) }) }, school.id)) })
-    ] }) })
-  ] }) }) : null;
+  } = useTranslation();
+  if (!selectedSchool) return null;
+  const hasManySchools = schools && schools.length > 1, directoryUrl = `/userbook/annuaire#/search?${new URLSearchParams({
+    structure: selectedSchool.id
+  }).toString()}`;
+  return /* @__PURE__ */ jsxs(Flex, { gap: "4", direction: "column", className: "school-space", children: [
+    /* @__PURE__ */ jsxs(Flex, { className: "school-space-container", justify: "center", gap: "4", align: "center", children: [
+      /* @__PURE__ */ jsx("b", { children: selectedSchool.name }),
+      hasManySchools && /* @__PURE__ */ jsx(Dropdown, { placement: "bottom-end", onToggle: toggleExpanded, children: (triggerProps) => /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(IconButton, { ...triggerProps, "aria-label": t("show"), color: "tertiary", variant: "ghost", icon: /* @__PURE__ */ jsx(SvgIconRafterUp, { className: "w-16 min-w-0", style: getRotateTransitionStyle(isExpanded, {
+          degrees: 180
+        }) }) }),
+        /* @__PURE__ */ jsx(Dropdown.Menu, { children: schools.map((school) => /* @__PURE__ */ jsx(Dropdown.Item, { onClick: () => onSelectedSchoolChange == null ? void 0 : onSelectedSchoolChange(school), children: /* @__PURE__ */ jsx(Flex, { direction: "column", children: /* @__PURE__ */ jsx("p", { children: school.name }) }) }, school.id)) })
+      ] }) })
+    ] }),
+    /* @__PURE__ */ jsx(ButtonBeta, { variant: "outline", className: "school-space-directory-button", leftIcon: /* @__PURE__ */ jsx(SvgIconUserSearch, {}), onClick: () => window.location.href = directoryUrl, children: t("homepage.school-space.directory") })
+  ] });
 };
 export {
   SchoolSpace as default

package/dist/modules/homepage/components/UserSpace/UserSpace.js

@@ -1,8 +1,11 @@
 import { jsxs, jsx } from "react/jsx-runtime";
 import { useTranslation } from "react-i18next";
+import SvgIconClass from "../../../icons/components/IconClass.js";
+import { useProfileLinks } from "./hooks/useProfileLinks.js";
 import HomeCard from "../HomeCard/HomeCard.js";
 import Flex from "../../../../components/Flex/Flex.js";
 import Avatar from "../../../../components/Avatar/Avatar.js";
+import ButtonBeta from "../../../../components/ButtonBeta/ButtonBeta.js";
 function UserSpace({
   name,
   avatar,
@@ -11,8 +14,8 @@ function UserSpace({
 }) {
   const {
     t
-  } = useTranslation();
-  return /* @__PURE__ */ jsxs(HomeCard, { variant: "user", children: [
+  } = useTranslation(), links = useProfileLinks(profile);
+  return /* @__PURE__ */ jsxs(HomeCard, { variant: "user", footer: !!links && /* @__PURE__ */ jsx(Flex, { children: links.map((link, index) => /* @__PURE__ */ jsx(ButtonBeta, { size: "sm", variant: "ghost", leftIcon: /* @__PURE__ */ jsx(SvgIconClass, {}), onClick: () => window.location.href = link.url, children: link.text }, `${link.url}-${index}`)) }), children: [
     /* @__PURE__ */ jsxs(Flex, { className: "user-space", direction: "row", gap: "8", children: [
       /* @__PURE__ */ jsx(Avatar, { className: "user-space--avatar", size: "auto", alt: name, src: avatar, variant: "circle" }),
       /* @__PURE__ */ jsxs(Flex, { direction: "column", children: [

package/dist/modules/homepage/components/UserSpace/hooks/useChildren.d.ts

@@ -0,0 +1,14 @@
+import { Child, StructureChildren } from '@edifice.io/client';
+export declare const childrenQueryKeys: {
+    all: (userId: string) => readonly ["children", string];
+};
+export declare const childrenQueryOptions: (userId: string | undefined, enabled: boolean) => import('@tanstack/react-query').OmitKeyof<import('@tanstack/react-query').UseQueryOptions<StructureChildren[], Error, Child[], import('@tanstack/react-query').QueryKey>, "queryFn"> & {
+    queryFn?: import('@tanstack/react-query').QueryFunction<StructureChildren[], import('@tanstack/react-query').QueryKey, never> | undefined;
+} & {
+    queryKey: import('@tanstack/react-query').DataTag<import('@tanstack/react-query').QueryKey, StructureChildren[]>;
+};
+/**
+ * Fetches the children of a "Relative" user across all their structures,
+ * merged into a single list.
+ */
+export declare function useChildren(userId: string | undefined, enabled: boolean): import('@tanstack/react-query').UseQueryResult<Child[], Error>;

package/dist/modules/homepage/components/UserSpace/hooks/useChildren.js

@@ -0,0 +1,23 @@
+import { odeServices } from "@edifice.io/client";
+import { useQuery, queryOptions } from "@tanstack/react-query";
+const childrenQueryKeys = {
+  all: (userId) => ["children", userId]
+};
+function flattenChildrenByStructure(structures) {
+  const seenIds = /* @__PURE__ */ new Set();
+  return structures.flatMap((structure) => structure.children).filter((child) => seenIds.has(child.id) ? !1 : (seenIds.add(child.id), !0));
+}
+const childrenQueryOptions = (userId, enabled) => queryOptions({
+  queryKey: childrenQueryKeys.all(userId ?? ""),
+  queryFn: () => odeServices.directory().getChildren(userId),
+  enabled: enabled && !!userId,
+  select: flattenChildrenByStructure
+});
+function useChildren(userId, enabled) {
+  return useQuery(childrenQueryOptions(userId, enabled));
+}
+export {
+  childrenQueryKeys,
+  childrenQueryOptions,
+  useChildren
+};

package/dist/modules/homepage/components/UserSpace/hooks/useProfileLinks.d.ts

@@ -0,0 +1,8 @@
+import { UserProfile } from '@edifice.io/client';
+type ProfileLink = {
+    url: string;
+    text: string;
+};
+/** Generates user's links to show in the UserSpace home component. */
+export declare function useProfileLinks(profile: UserProfile[number]): Array<ProfileLink> | undefined;
+export {};