analytica-frontend-lib
Version:
Repositório público dos componentes utilizados nas plataformas da Analytica Ensino
105 lines • 4.63 kB
TypeScript
import type { ReactNode } from 'react';
import { type NotificationGroup } from '../NotificationCard/index';
import { NotificationEntityType } from '../types/notifications';
/**
* Subset of session info consumed by the application header.
* Each property is optional so the consumer can pass whatever it has.
*/
export interface AppHeaderSessionInfo {
userName?: string;
email?: string;
urlProfilePicture?: string;
schoolName?: string;
className?: string;
schoolYearName?: string;
}
/**
* Minimal user shape needed to fill the profile dropdown header.
*/
export interface AppHeaderUser {
name?: string;
email?: string;
}
/**
* Tutorial action rendered as a pill button in the header (left of the
* notifications bell). The consumer owns the click behavior (usually opening
* the configured tutorial URL in a new tab).
*/
export interface AppHeaderTutorial {
/** Show the tutorial button. */
visible?: boolean;
/** Button label. Defaults to "Tutoriais". */
label?: string;
/** Fired when the tutorial button is clicked. */
onClick: () => void;
}
/**
* Notifications data + callbacks the AppHeader forwards to NotificationCard.
* Built by the consumer (usually via `createNotificationsHook(api)`).
*/
export interface AppHeaderNotifications {
unreadCount: number;
loading: boolean;
error: string | null;
groupedNotifications: NotificationGroup[];
refreshNotifications: () => void;
markAsRead: (id: string) => void;
deleteNotification: (id: string) => void;
fetchNotifications: () => void;
fetchUnreadCount?: () => void;
getActionLabel: (entityType?: NotificationEntityType) => string | undefined;
}
export interface AppHeaderProps {
/** Authenticated user (fallback when sessionInfo doesn't carry name/email). */
user?: AppHeaderUser;
/** Session metadata used to render profile name, email, photo and school info. */
sessionInfo?: AppHeaderSessionInfo;
/** Notifications wiring (state + callbacks). */
notifications: AppHeaderNotifications;
/** Tutorial pill button shown before the notifications bell. */
tutorial?: AppHeaderTutorial;
/** Show the calendar widget in the header. */
showCalendar?: boolean;
/** Content rendered inside the calendar (dropdown on tablet/desktop, modal on mobile). */
calendarContent?: ReactNode;
/**
* Optional controlled open state for the calendar.
* When provided, the consumer is the source of truth; useful for closing
* the calendar programmatically (e.g. on route change).
*/
calendarOpen?: boolean;
/** Fired whenever the calendar open state changes. */
onCalendarOpenChange?: (open: boolean) => void;
/** Show school/class/year inside the profile dropdown. */
showProfileInfo?: boolean;
/** Optional fallback image for the notifications empty state. */
emptyNotificationsImage?: string;
/** Empty-state title for notifications dropdown. */
emptyNotificationsTitle?: string;
/** Empty-state description for notifications dropdown. */
emptyNotificationsDescription?: string;
/** Callback fired when the user activates logout. */
onLogout: () => void;
/** Callback fired when the user activates the "My data" menu item. */
onNavigateToMyData: () => void;
/** Callback fired when the user clicks on a notification with entity info. */
onNavigateByNotification?: (entityType?: NotificationEntityType, entityId?: string) => void;
/**
* Tailwind class overriding the default `max-w-[1000px]` of the header
* content (forwarded to the internal `PageContainer`'s `innerClassName`).
* Pass e.g. `max-w-[1350px]` to align the header with a widened page
* content. When omitted, the default `max-w-[1000px]` is kept, so other
* consumers are unaffected.
*/
contentMaxWidth?: string;
}
/**
* Application header shared across the analytica frontends.
*
* Renders the institution logo, optional calendar dropdown (mobile/tablet),
* notifications center and a profile menu. Width is constrained by
* `<PageContainer>` so it always aligns with the rest of the page content.
*/
export declare const AppHeader: ({ user, sessionInfo, notifications, tutorial, showCalendar, calendarContent, calendarOpen, onCalendarOpenChange, showProfileInfo, emptyNotificationsImage, emptyNotificationsTitle, emptyNotificationsDescription, onLogout, onNavigateToMyData, onNavigateByNotification, contentMaxWidth, }: AppHeaderProps) => import("react/jsx-runtime").JSX.Element;
export default AppHeader;
//# sourceMappingURL=AppHeader.d.ts.map