analytica-frontend-lib
Version:
Repositório público dos componentes utilizados nas plataformas da Analytica Ensino
295 lines (263 loc) • 13.3 kB
JavaScript
;Object.defineProperty(exports, "__esModule", {value: true}); function _nullishCoalesce(lhs, rhsFn) { if (lhs != null) { return lhs; } else { return rhsFn(); } } function _optionalChain(ops) { let lastAccessLHS = undefined; let value = ops[0]; let i = 1; while (i < ops.length) { const op = ops[i]; const fn = ops[i + 1]; i += 2; if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { return undefined; } if (op === 'access' || op === 'optionalAccess') { lastAccessLHS = value; value = fn(value); } else if (op === 'call' || op === 'optionalCall') { value = fn((...args) => value.call(lastAccessLHS, ...args)); lastAccessLHS = undefined; } } return value; }
var _chunkKLMH3V3Ejs = require('./chunk-KLMH3V3E.js');
var _chunkZPUXEJOQjs = require('./chunk-ZPUXEJOQ.js');
var _chunk5THJFVXHjs = require('./chunk-5THJFVXH.js');
var _chunkOGTKQFPYjs = require('./chunk-OGTKQFPY.js');
var _chunkZHWRUIVEjs = require('./chunk-ZHWRUIVE.js');
var _chunkVHS3DYH3js = require('./chunk-VHS3DYH3.js');
var _chunkBVUPM6EYjs = require('./chunk-BVUPM6EY.js');
var _chunk76VXVNA2js = require('./chunk-76VXVNA2.js');
var _chunkANT66KVKjs = require('./chunk-ANT66KVK.js');
var _chunkTN3AYOMVjs = require('./chunk-TN3AYOMV.js');
// src/components/AppHeader/AppHeader.tsx
var _react = require('react');
var _CaretRight = require('@phosphor-icons/react/dist/csr/CaretRight');
var _User = require('@phosphor-icons/react/dist/csr/User');
var _jsxruntime = require('react/jsx-runtime');
var DEFAULT_EMPTY_TITLE = "Nenhuma notifica\xE7\xE3o no momento";
var DEFAULT_EMPTY_DESCRIPTION = "Voc\xEA est\xE1 em dia com todas as novidades. Volte depois para conferir atualiza\xE7\xF5es!";
var AppHeader = ({
user,
sessionInfo,
notifications,
tutorial,
showCalendar = false,
calendarContent,
calendarOpen,
onCalendarOpenChange,
showProfileInfo = false,
emptyNotificationsImage,
emptyNotificationsTitle = DEFAULT_EMPTY_TITLE,
emptyNotificationsDescription = DEFAULT_EMPTY_DESCRIPTION,
onLogout,
onNavigateToMyData,
onNavigateByNotification,
contentMaxWidth
}) => {
const { isMobile, isExtraSmallMobile } = _chunkZHWRUIVEjs.useMobile.call(void 0, );
const [activeStates, setActiveStates] = _react.useState.call(void 0, {});
_react.useEffect.call(void 0, () => {
_optionalChain([notifications, 'access', _ => _.fetchUnreadCount, 'optionalCall', _2 => _2()]);
}, []);
const toggleActive = (buttonId) => {
setActiveStates((prev) => {
if (prev[buttonId]) {
return { ...prev, [buttonId]: false };
}
return {
calendar: false,
notifications: false,
profile: false,
[buttonId]: true
};
});
};
const handleCalendarOpenChange = _react.useCallback.call(void 0,
(open) => {
setActiveStates((prev) => {
const current = _nullishCoalesce(prev.calendar, () => ( false));
if (current === open) {
return prev;
}
if (open) {
return {
calendar: true,
notifications: false,
profile: false
};
}
return { ...prev, calendar: false };
});
_optionalChain([onCalendarOpenChange, 'optionalCall', _3 => _3(open)]);
},
[onCalendarOpenChange]
);
_react.useEffect.call(void 0, () => {
const handleEscapeKey = (event) => {
if (event.key === "Escape") {
setActiveStates({});
}
};
document.addEventListener("keydown", handleEscapeKey);
return () => document.removeEventListener("keydown", handleEscapeKey);
}, []);
const handleMyDataClick = () => {
setActiveStates({});
onNavigateToMyData();
};
const displayName = _nullishCoalesce(_nullishCoalesce(_optionalChain([sessionInfo, 'optionalAccess', _4 => _4.userName]), () => ( _optionalChain([user, 'optionalAccess', _5 => _5.name]))), () => ( "Usu\xE1rio"));
const displayEmail = _nullishCoalesce(_nullishCoalesce(_optionalChain([sessionInfo, 'optionalAccess', _6 => _6.email]), () => ( _optionalChain([user, 'optionalAccess', _7 => _7.email]))), () => ( ""));
const pickResponsiveClass = (extraSmall, mobile, desktop) => {
if (isExtraSmallMobile) return extraSmall;
if (isMobile) return mobile;
return desktop;
};
const profileDropdownWidth = pickResponsiveClass(
"min-w-[260px]",
"min-w-[280px]",
"min-w-[320px]"
);
const sectionGap = pickResponsiveClass("gap-1", "gap-2", "gap-3");
const logoHeight = pickResponsiveClass("h-6", "h-8", "h-10");
const tutorialPadding = pickResponsiveClass(
"px-3 py-1.5 text-xs",
"px-3.5 py-2 text-sm",
"px-4 py-2 text-sm"
);
return /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
"header",
{
"data-component": "AppHeader",
className: "bg-primary-800 w-full h-[70px] flex justify-center items-center",
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
_chunkZPUXEJOQjs.PageContainer,
{
className: "pb-0 justify-center",
innerClassName: contentMaxWidth,
children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, "div", { className: "w-full flex flex-row justify-between items-center gap-3", children: [
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
_chunkKLMH3V3Ejs.BrandingLogo,
{
variant: "main",
alt: "Logo",
className: `${logoHeight} object-contain object-left min-w-0 shrink`
}
),
/* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
"section",
{
className: `flex flex-row items-center shrink-0 ${sectionGap}`,
children: [
_optionalChain([tutorial, 'optionalAccess', _8 => _8.visible]) && /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
"button",
{
type: "button",
"data-testid": "app-header-tutorial",
onClick: tutorial.onClick,
className: `rounded-full border border-primary text-primary font-medium whitespace-nowrap cursor-pointer transition-colors hover:bg-primary-700 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary ${tutorialPadding}`,
children: _nullishCoalesce(tutorial.label, () => ( "Tutoriais"))
}
),
showCalendar && /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "lg:hidden", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
_chunkOGTKQFPYjs.CalendarCard_default,
{
content: calendarContent,
isOpen: _nullishCoalesce(_nullishCoalesce(calendarOpen, () => ( activeStates.calendar)), () => ( false)),
onOpenChange: handleCalendarOpenChange
}
) }),
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
_chunk5THJFVXHjs.NotificationCard_default,
{
mode: "center",
isActive: activeStates.notifications,
onToggleActive: () => toggleActive("notifications"),
onOpenChange: (open) => {
_chunkTN3AYOMVjs.syncDropdownState.call(void 0,
open,
activeStates.notifications,
setActiveStates,
"notifications"
);
},
unreadCount: notifications.unreadCount,
groupedNotifications: notifications.groupedNotifications,
loading: notifications.loading,
error: notifications.error,
onRetry: notifications.refreshNotifications,
onMarkAsReadById: notifications.markAsRead,
onDeleteById: notifications.deleteNotification,
onNavigateById: (entityType, entityId) => {
if (entityType && entityId) {
_optionalChain([onNavigateByNotification, 'optionalCall', _9 => _9(entityType, entityId)]);
}
},
getActionLabel: notifications.getActionLabel,
onFetchNotifications: notifications.fetchNotifications,
emptyStateImage: emptyNotificationsImage,
emptyStateTitle: emptyNotificationsTitle,
emptyStateDescription: emptyNotificationsDescription
}
),
/* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
_chunk76VXVNA2js.DropdownMenu_default,
{
onOpenChange: (open) => {
_chunkTN3AYOMVjs.syncDropdownState.call(void 0,
open,
activeStates.profile,
setActiveStates,
"profile"
);
},
children: [
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk76VXVNA2js.DropdownMenuTrigger, { className: "text-primary cursor-pointer", children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
_chunkBVUPM6EYjs.IconButton_default,
{
active: activeStates.profile,
onClick: () => toggleActive("profile"),
icon: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
_chunkVHS3DYH3js.UserIcon,
{
size: 24,
className: activeStates.profile ? "opacity-80" : ""
}
)
}
) }),
/* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
_chunk76VXVNA2js.DropdownMenuContent,
{
className: profileDropdownWidth,
side: "bottom",
variant: "profile",
align: "end",
children: [
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
_chunk76VXVNA2js.ProfileMenuHeader,
{
name: displayName,
email: displayEmail,
photoUrl: _optionalChain([sessionInfo, 'optionalAccess', _10 => _10.urlProfilePicture])
}
),
showProfileInfo && /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
_chunk76VXVNA2js.ProfileMenuInfo,
{
schoolName: _nullishCoalesce(_optionalChain([sessionInfo, 'optionalAccess', _11 => _11.schoolName]), () => ( "")),
classYearName: _nullishCoalesce(_optionalChain([sessionInfo, 'optionalAccess', _12 => _12.className]), () => ( "")),
schoolYearName: _nullishCoalesce(_optionalChain([sessionInfo, 'optionalAccess', _13 => _13.schoolYearName]), () => ( ""))
}
),
/* @__PURE__ */ _jsxruntime.jsxs.call(void 0, _chunk76VXVNA2js.ProfileMenuSection, { children: [
/* @__PURE__ */ _jsxruntime.jsx.call(void 0,
_chunk76VXVNA2js.DropdownMenuItem,
{
variant: "profile",
iconLeft: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _User.UserIcon, {}),
iconRight: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _CaretRight.CaretRightIcon, {}),
onClick: handleMyDataClick,
children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunkANT66KVKjs.Text_default, { size: "md", color: "text-text-700", children: "Meus dados" })
}
),
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk76VXVNA2js.ProfileToggleTheme, {})
] }),
/* @__PURE__ */ _jsxruntime.jsx.call(void 0, _chunk76VXVNA2js.ProfileMenuFooter, { onClick: onLogout })
]
}
)
]
}
)
]
}
)
] })
}
)
}
);
};
var AppHeader_default = AppHeader;
exports.AppHeader = AppHeader; exports.AppHeader_default = AppHeader_default;
//# sourceMappingURL=chunk-DCQZIDRO.js.map