@licklist/design 0.78.5-dev.36 → 0.78.5-dev.38

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"file":"Authorizer.d.ts","sourceRoot":"","sources":["../../src/auth/Authorizer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAoC,MAAM,OAAO,CAAA;AASnE,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,EAAE,SAAS,GAAG,SAAS,EAAE,CAAA;CACnC;AAED,iBAAS,UAAU,CAAC,KAAK,EAAE,eAAe,2CAiFzC;AAED,OAAO,EAAE,UAAU,EAAE,CAAA"}
1
+ {"version":3,"file":"Authorizer.d.ts","sourceRoot":"","sources":["../../src/auth/Authorizer.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAoC,MAAM,OAAO,CAAA;AASnE,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,EAAE,SAAS,GAAG,SAAS,EAAE,CAAA;CACnC;AAED,iBAAS,UAAU,CAAC,KAAK,EAAE,eAAe,2CAqFzC;AAED,OAAO,EAAE,UAAU,EAAE,CAAA"}
@@ -1,6 +1,6 @@
1
1
  import { jsx, Fragment } from 'react/jsx-runtime';
2
2
  import { useState, useCallback, useEffect } from 'react';
3
- import { useLocation, matchPath } from 'react-router-dom';
3
+ import { useLocation, useNavigate, matchPath } from 'react-router-dom';
4
4
  import useUser from '@licklist/plugins/dist/context/user/hooks/useUser';
5
5
  import { MATCH_ROUTE_PATTERNS, ROUTES } from '@licklist/core/dist/Config';
6
6
  import useAuthApi from '@licklist/plugins/dist/hooks/Api/useAuthApi';
@@ -72,6 +72,7 @@ function Authorizer(props) {
72
72
  var user = useUser();
73
73
  var useProfile = useAuthApi().useProfile;
74
74
  var pathname = useLocation().pathname;
75
+ var navigate = useNavigate();
75
76
  // This will re-fetch user's profile
76
77
  var profile = useProfile();
77
78
  var _useState = _sliced_to_array(useState(false), 2), isValidated = _useState[0], setIsValidated = _useState[1];
@@ -94,7 +95,7 @@ function Authorizer(props) {
94
95
  });
95
96
  return;
96
97
  }
97
- if ([
98
+ var publicRoutes = [
98
99
  ROUTES.LOGIN_PAGE,
99
100
  ROUTES.REGISTER_PAGE,
100
101
  ROUTES.PRIVACY_PAGE,
@@ -104,26 +105,29 @@ function Authorizer(props) {
104
105
  ROUTES.FORGOT_PASSWORD,
105
106
  ROUTES.SSO_LOGIN,
106
107
  ROUTES.MAINTENANCE_PAGE
107
- ].concat(_to_consumable_array(matchedPathPatternUrls())).includes(pathname)) {
108
- setIsValidated(function() {
109
- return true;
110
- });
108
+ ].concat(_to_consumable_array(matchedPathPatternUrls()));
109
+ // If we're on a public route (e.g. /login), mark as validated and never redirect
110
+ if (publicRoutes.includes(pathname)) {
111
+ setIsValidated(true);
111
112
  return;
112
113
  }
113
114
  var route = RouteService.getCurrentRoute();
114
- RouteService.redirectTo([
115
- ROUTES.MAINTENANCE_PAGE,
115
+ navigate([
116
+ ROUTES.LOGIN_PAGE,
116
117
  "returnUrl=".concat(escape(route))
117
- ].join('?'));
118
+ ].join('?'), {
119
+ replace: true
120
+ });
118
121
  }, [
119
122
  auth.secrets,
120
123
  user.profile,
121
124
  profile.data,
122
- matchedPathPatternUrls,
123
125
  profile.isError,
124
126
  profile.isLoading,
125
127
  profile.isFetching,
126
- pathname
128
+ pathname,
129
+ matchedPathPatternUrls,
130
+ navigate
127
131
  ]);
128
132
  if (profile.isFetching || profile.isLoading || !isValidated) return /*#__PURE__*/ jsx(BlockLoader, {});
129
133
  return /*#__PURE__*/ jsx(Fragment, {
@@ -1 +1 @@
1
- {"version":3,"file":"UserPanel.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/UserPanel/UserPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,kBAAkB,CAAA;AAEzB,MAAM,WAAW,cAAc;IAC3B,MAAM,EAAE,OAAO,CAAA;IACf,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,QAAQ,EAAE,MAAM,CAAA;IAChB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACzB,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC1B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAA;IAC3B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;CAC7B;AAqBD,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CA+F9C,CAAA"}
1
+ {"version":3,"file":"UserPanel.d.ts","sourceRoot":"","sources":["../../../../src/v2/components/UserPanel/UserPanel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,kBAAkB,CAAA;AAGzB,MAAM,WAAW,cAAc;IAC3B,MAAM,EAAE,OAAO,CAAA;IACf,OAAO,EAAE,MAAM,IAAI,CAAA;IACnB,QAAQ,EAAE,MAAM,CAAA;IAChB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACzB,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC1B,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAA;IAC3B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;CAC7B;AAqBD,eAAO,MAAM,SAAS,EAAE,KAAK,CAAC,EAAE,CAAC,cAAc,CAwF9C,CAAA"}
@@ -1,6 +1,7 @@
1
1
  import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
2
2
  import 'react';
3
3
  import './UserPanel.scss.js';
4
+ import { UserAvatar } from '../UserAvatar/UserAvatar.js';
4
5
 
5
6
  // Icons as inline SVGs
6
7
  var CloseIcon = function() {
@@ -64,35 +65,10 @@ var UserPanel = function(param) {
64
65
  /*#__PURE__*/ jsxs("div", {
65
66
  className: "user-panel__user-info",
66
67
  children: [
67
- /*#__PURE__*/ jsx("div", {
68
- className: "user-panel__avatar",
69
- children: avatarUrl ? /*#__PURE__*/ jsx("img", {
70
- src: avatarUrl,
71
- alt: "Profile"
72
- }) : /*#__PURE__*/ jsxs(Fragment, {
73
- children: [
74
- /*#__PURE__*/ jsx("svg", {
75
- width: "32",
76
- height: "32",
77
- viewBox: "0 0 32 32",
78
- fill: "none",
79
- className: "user-panel__avatar-bg",
80
- children: /*#__PURE__*/ jsx("circle", {
81
- cx: "16",
82
- cy: "16",
83
- r: "15",
84
- fill: "var(--fills-main-fill-secondary, #626A90)",
85
- fillOpacity: "0.2",
86
- stroke: "var(--fills-main-fill-secondary, #626A90)",
87
- strokeWidth: "2"
88
- })
89
- }),
90
- /*#__PURE__*/ jsx("span", {
91
- className: "user-panel__avatar-initials",
92
- children: displayInitials
93
- })
94
- ]
95
- })
68
+ /*#__PURE__*/ jsx(UserAvatar, {
69
+ initials: displayInitials,
70
+ avatarUrl: avatarUrl || undefined,
71
+ size: "md"
96
72
  }),
97
73
  /*#__PURE__*/ jsxs("div", {
98
74
  className: "user-panel__user-details",
@@ -1 +1 @@
1
- {"version":3,"file":"DashboardLayout.d.ts","sourceRoot":"","sources":["../../../../src/v2/navigation/DashboardLayout/DashboardLayout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAA;AAEvC,OAAO,EAAmB,OAAO,EAAE,MAAM,mBAAmB,CAAA;AAG5D,OAAO,wBAAwB,CAAA;AAE/B,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,UAAU,GAAG,SAAS,CAAA;AAE9D,MAAM,WAAW,oBAAoB;IAEjC,WAAW,EAAE,eAAe,CAAA;IAE5B,eAAe,CAAC,EAAE,OAAO,CAAA;IAEzB,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;IAE5B,YAAY,CAAC,EAAE,MAAM,CAAA;IAErB,UAAU,CAAC,EAAE,MAAM,CAAA;IAEnB,aAAa,CAAC,EAAE,MAAM,CAAA;IAEtB,YAAY,CAAC,EAAE,OAAO,GAAG,UAAU,CAAA;IAEnC,WAAW,CAAC,EAAE,MAAM,CAAA;IAEpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB,YAAY,CAAC,EAAE,MAAM,CAAA;IAErB,YAAY,CAAC,EAAE,MAAM,CAAA;IAErB,QAAQ,CAAC,EAAE,MAAM,CAAA;IAEjB,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB,MAAM,CAAC,EAAE,MAAM,CAAA;IAEf,QAAQ,CAAC,EAAE,MAAM,CAAA;IAEjB,UAAU,CAAC,EAAE,MAAM,CAAA;IAEnB,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB,UAAU,CAAC,EAAE,MAAM,CAAA;IAEnB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IAErC,WAAW,CAAC,EAAE,MAAM,IAAI,CAAA;IAExB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAA;IAEzB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAA;IAExB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAA;IAExB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAA;IAE3B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAE1B,cAAc,CAAC,EAAE,OAAO,CAAA;IAExB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAE1B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAElB,OAAO,CAAC,EAAE,MAAM,CAAA;IAEhB,UAAU,CAAC,EAAE,OAAO,CAAA;IAEpB,aAAa,CAAC,EAAE,OAAO,CAAA;IAEvB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,OAAO,EAAE,CAAA;CACvB;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAuI1D,CAAA;AAED,eAAe,eAAe,CAAA"}
1
+ {"version":3,"file":"DashboardLayout.d.ts","sourceRoot":"","sources":["../../../../src/v2/navigation/DashboardLayout/DashboardLayout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA2C,MAAM,OAAO,CAAA;AAE/D,OAAO,EAAmB,OAAO,EAAE,MAAM,mBAAmB,CAAA;AAG5D,OAAO,wBAAwB,CAAA;AAE/B,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,UAAU,GAAG,SAAS,CAAA;AAE9D,MAAM,WAAW,oBAAoB;IAEjC,WAAW,EAAE,eAAe,CAAA;IAE5B,eAAe,CAAC,EAAE,OAAO,CAAA;IAEzB,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;IAE5B,YAAY,CAAC,EAAE,MAAM,CAAA;IAErB,UAAU,CAAC,EAAE,MAAM,CAAA;IAEnB,aAAa,CAAC,EAAE,MAAM,CAAA;IAEtB,YAAY,CAAC,EAAE,OAAO,GAAG,UAAU,CAAA;IAEnC,WAAW,CAAC,EAAE,MAAM,CAAA;IAEpB,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB,YAAY,CAAC,EAAE,MAAM,CAAA;IAErB,YAAY,CAAC,EAAE,MAAM,CAAA;IAErB,QAAQ,CAAC,EAAE,MAAM,CAAA;IAEjB,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB,MAAM,CAAC,EAAE,MAAM,CAAA;IAEf,QAAQ,CAAC,EAAE,MAAM,CAAA;IAEjB,UAAU,CAAC,EAAE,MAAM,CAAA;IAEnB,SAAS,CAAC,EAAE,MAAM,CAAA;IAElB,UAAU,CAAC,EAAE,MAAM,CAAA;IAEnB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IAErC,WAAW,CAAC,EAAE,MAAM,IAAI,CAAA;IAExB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAA;IAEzB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAA;IAExB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAA;IAExB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAA;IAE3B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAE1B,cAAc,CAAC,EAAE,OAAO,CAAA;IAExB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAE1B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAElB,OAAO,CAAC,EAAE,MAAM,CAAA;IAEhB,UAAU,CAAC,EAAE,OAAO,CAAA;IAEpB,aAAa,CAAC,EAAE,OAAO,CAAA;IAEvB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,OAAO,EAAE,CAAA;CACvB;AAED,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAyJ1D,CAAA;AAED,eAAe,eAAe,CAAA"}
@@ -1,5 +1,5 @@
1
1
  import { jsxs, jsx } from 'react/jsx-runtime';
2
- import { useState } from 'react';
2
+ import { useState, useCallback, useEffect } from 'react';
3
3
  import { TopNavigation } from './TopNavigation.js';
4
4
  import { ProviderSidebar } from './ProviderSidebar.js';
5
5
  import { AdminSidebar } from './AdminSidebar.js';
@@ -55,6 +55,28 @@ function _unsupported_iterable_to_array(o, minLen) {
55
55
  var DashboardLayout = function(param) {
56
56
  var destination = param.destination, sidebarExpanded = param.sidebarExpanded, onSidebarToggle = param.onSidebarToggle, providerName = param.providerName, providerId = param.providerId, providerImage = param.providerImage, _param_providerType = param.providerType, providerType = _param_providerType === void 0 ? 'venue' : _param_providerType, companyName = param.companyName, companyId = param.companyId, companyImage = param.companyImage, userInitials = param.userInitials, userName = param.userName, userEmail = param.userEmail, userId = param.userId, userRole = param.userRole, _param_inboxCount = param.inboxCount, inboxCount = _param_inboxCount === void 0 ? 0 : _param_inboxCount, _param_bellCount = param.bellCount, bellCount = _param_bellCount === void 0 ? 0 : _param_bellCount, _param_activePath = param.activePath, activePath = _param_activePath === void 0 ? '/home' : _param_activePath, onNavigation = param.onNavigation, onUserClick = param.onUserClick, onInboxClick = param.onInboxClick, onBellClick = param.onBellClick, onHelpClick = param.onHelpClick, onProfileClick = param.onProfileClick, onLogoutClick = param.onLogoutClick, _param_hasAdminAccess = param.hasAdminAccess, hasAdminAccess = _param_hasAdminAccess === void 0 ? false : _param_hasAdminAccess, children = param.children, _param_isMobile = param.isMobile, isMobile = _param_isMobile === void 0 ? false : _param_isMobile, version = param.version, _param_showFooter = param.showFooter, showFooter = _param_showFooter === void 0 ? true : _param_showFooter, _param_userPanelOpen = param.userPanelOpen, userPanelOpen = _param_userPanelOpen === void 0 ? false : _param_userPanelOpen, navItems = param.navItems;
57
57
  var _useState = _sliced_to_array(useState(false), 2), mobileMenuOpen = _useState[0], setMobileMenuOpen = _useState[1];
58
+ var handleKeyDown = useCallback(function(event) {
59
+ var target = event.target;
60
+ if (target.tagName === 'INPUT' || target.tagName === 'TEXTAREA' || target.isContentEditable) {
61
+ return;
62
+ }
63
+ if (event.key === '[' && sidebarExpanded) {
64
+ onSidebarToggle === null || onSidebarToggle === void 0 ? void 0 : onSidebarToggle();
65
+ } else if (event.key === ']' && !sidebarExpanded) {
66
+ onSidebarToggle === null || onSidebarToggle === void 0 ? void 0 : onSidebarToggle();
67
+ }
68
+ }, [
69
+ sidebarExpanded,
70
+ onSidebarToggle
71
+ ]);
72
+ useEffect(function() {
73
+ document.addEventListener('keydown', handleKeyDown);
74
+ return function() {
75
+ return document.removeEventListener('keydown', handleKeyDown);
76
+ };
77
+ }, [
78
+ handleKeyDown
79
+ ]);
58
80
  var handleSidebarToggle = function() {
59
81
  if (isMobile) {
60
82
  setMobileMenuOpen(!mobileMenuOpen);
@@ -1 +1 @@
1
- {"version":3,"file":"ProviderSidebar.d.ts","sourceRoot":"","sources":["../../../../src/v2/navigation/DashboardLayout/ProviderSidebar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,wBAAwB,CAAA;AAI/B,MAAM,WAAW,OAAO;IACpB,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,KAAK,CAAC,SAAS,CAAA;IACrB,GAAG,CAAC,EAAE,OAAO,CAAA;CAChB;AAED,MAAM,WAAW,oBAAoB;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,YAAY,CAAC,EAAE,OAAO,GAAG,UAAU,CAAA;IACnC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IACrC,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAC1B,oEAAoE;IACpE,QAAQ,CAAC,EAAE,OAAO,EAAE,CAAA;CACvB;AAGD,QAAA,MAAM,QAAQ,+CAIb,CAAA;AAED,QAAA,MAAM,SAAS,+CAId,CAAA;AAED,QAAA,MAAM,aAAa,+CAIlB,CAAA;AAED,QAAA,MAAM,WAAW,+CAIhB,CAAA;AAED,QAAA,MAAM,aAAa,+CAIlB,CAAA;AAED,QAAA,MAAM,WAAW,+CAIhB,CAAA;AAED,QAAA,MAAM,aAAa,+CAIlB,CAAA;AAED,QAAA,MAAM,aAAa,+CAIlB,CAAA;AAED,QAAA,MAAM,WAAW,+CAIhB,CAAA;AAED,QAAA,MAAM,YAAY,+CAIjB,CAAA;AAeD,OAAO,EACH,QAAQ,EACR,SAAS,EACT,aAAa,EACb,WAAW,EACX,aAAa,EACb,WAAW,EACX,aAAa,EACb,aAAa,EACb,WAAW,EACX,YAAY,GACf,CAAA;AAgBD,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CA2H1D,CAAA"}
1
+ {"version":3,"file":"ProviderSidebar.d.ts","sourceRoot":"","sources":["../../../../src/v2/navigation/DashboardLayout/ProviderSidebar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,wBAAwB,CAAA;AAI/B,MAAM,WAAW,OAAO;IACpB,EAAE,EAAE,MAAM,CAAA;IACV,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,EAAE,MAAM,CAAA;IACZ,IAAI,EAAE,KAAK,CAAC,SAAS,CAAA;IACrB,GAAG,CAAC,EAAE,OAAO,CAAA;CAChB;AAED,MAAM,WAAW,oBAAoB;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,YAAY,CAAC,EAAE,OAAO,GAAG,UAAU,CAAA;IACnC,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAA;IACrC,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAC1B,oEAAoE;IACpE,QAAQ,CAAC,EAAE,OAAO,EAAE,CAAA;CACvB;AAGD,QAAA,MAAM,QAAQ,+CAIb,CAAA;AAED,QAAA,MAAM,SAAS,+CAId,CAAA;AAED,QAAA,MAAM,aAAa,+CAIlB,CAAA;AAED,QAAA,MAAM,WAAW,+CAIhB,CAAA;AAED,QAAA,MAAM,aAAa,+CAIlB,CAAA;AAED,QAAA,MAAM,WAAW,+CAIhB,CAAA;AAED,QAAA,MAAM,aAAa,+CAIlB,CAAA;AAED,QAAA,MAAM,aAAa,+CAIlB,CAAA;AAED,QAAA,MAAM,WAAW,+CAIhB,CAAA;AAED,QAAA,MAAM,YAAY,+CAIjB,CAAA;AAeD,OAAO,EACH,QAAQ,EACR,SAAS,EACT,aAAa,EACb,WAAW,EACX,aAAa,EACb,WAAW,EACX,aAAa,EACb,aAAa,EACb,WAAW,EACX,YAAY,GACf,CAAA;AAgBD,eAAO,MAAM,eAAe,EAAE,KAAK,CAAC,EAAE,CAAC,oBAAoB,CAyI1D,CAAA"}
@@ -275,6 +275,17 @@ var ProviderSidebar = function(param) {
275
275
  })),
276
276
  expanded ? /*#__PURE__*/ jsx("div", {
277
277
  className: "provider-sidebar__header",
278
+ onClick: function() {
279
+ return handleNavClick('/profile');
280
+ },
281
+ role: "button",
282
+ tabIndex: 0,
283
+ onKeyDown: function(e) {
284
+ return e.key === 'Enter' && handleNavClick('/profile');
285
+ },
286
+ style: {
287
+ cursor: 'pointer'
288
+ },
278
289
  children: /*#__PURE__*/ jsx(EntityHeader, {
279
290
  name: providerName,
280
291
  id: providerId,
@@ -290,6 +301,17 @@ var ProviderSidebar = function(param) {
290
301
  delayDuration: 100,
291
302
  children: /*#__PURE__*/ jsx("div", {
292
303
  className: "provider-sidebar__header provider-sidebar__header--collapsed",
304
+ onClick: function() {
305
+ return handleNavClick('/profile');
306
+ },
307
+ role: "button",
308
+ tabIndex: 0,
309
+ onKeyDown: function(e) {
310
+ return e.key === 'Enter' && handleNavClick('/profile');
311
+ },
312
+ style: {
313
+ cursor: 'pointer'
314
+ },
293
315
  children: /*#__PURE__*/ jsx(EntityHeader, {
294
316
  name: providerName,
295
317
  id: providerId,
@@ -1,6 +1,6 @@
1
1
  import styleInject from '/opt/atlassian/pipelines/agent/build/node_modules/style-inject/dist/style-inject.es.js';
2
2
 
3
- var css_248z = ".provider-sidebar{align-items:flex-start;background:var(--surfaces-main-background-secondary,#f8f8fa);border-right:1px solid var(--borders-main-border-primary,#e8e9ef);box-sizing:border-box;display:flex;flex-direction:column;height:100%;overflow-y:auto;padding:8px;transition:width .3s ease}.provider-sidebar--expanded{width:268px}.provider-sidebar--collapsed{width:72px}@media (max-width:640px){.provider-sidebar{border-right:none;width:100%!important}}.provider-sidebar__content{display:flex;flex-direction:column;gap:4px;width:100%}.provider-sidebar__back-link{align-items:center;border-radius:8px;box-sizing:border-box;color:var(--fills-main-fill-primary,#14215a);cursor:pointer;display:flex;gap:8px;padding:8px;transition:all .2s ease;width:100%}.provider-sidebar__back-link:hover{background:var(--surfaces-main-background-secondary-hover,#f0f0f4)}.provider-sidebar__back-link:hover .provider-sidebar__icon--back .back-icon-default{display:none}.provider-sidebar__back-link:hover .provider-sidebar__icon--back .back-icon-hover{display:block}.provider-sidebar__back-link:active{background:var(--surfaces-main-background-secondary-pressed,#e8e8ec)}.provider-sidebar__back-link--collapsed{justify-content:center}.provider-sidebar__header{align-items:center;box-sizing:border-box;display:flex;width:100%}.provider-sidebar__header--collapsed{justify-content:center}.provider-sidebar__avatar{align-items:center;border-radius:50%;display:flex;flex-shrink:0;height:47px;justify-content:center;overflow:hidden;position:relative;width:47px}.provider-sidebar__avatar img{height:100%;object-fit:cover;width:100%}.provider-sidebar__avatar-placeholder{align-items:center;display:flex;height:100%;justify-content:center;position:relative;width:100%}.provider-sidebar__avatar-placeholder:before{background:#626a9033;border:2px solid var(--fills-main-fill-secondary,#626a90);border-radius:50%;content:\"\";inset:0;position:absolute}.provider-sidebar__avatar-placeholder span{color:var(--labels-main-label-secondary,#626a90);font-family:Geist,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:18px;font-weight:700;position:relative;z-index:1}.provider-sidebar__header-text{display:flex;flex:1;flex-direction:column;gap:4px;min-width:0}.provider-sidebar__title{color:var(--labels-main-label-primary,#121e52);font-family:Geist,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:15px;font-weight:600;line-height:18px;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.provider-sidebar__badge{align-items:center;background:var(--surfaces-main-background-tertiary,#e8e9ef);border-radius:8px;display:inline-flex;justify-content:center;padding:4px 8px;transition:background .2s ease;width:fit-content}.provider-sidebar__header:hover .provider-sidebar__badge{background:var(--surfaces-main-background-tertiary-hover,#dcdde3)}.provider-sidebar__badge span{color:var(--labels-main-label-secondary,#626a90);font-family:Geist Mono,SF Mono,Consolas,monospace;font-size:10px;font-weight:600;line-height:12px;white-space:nowrap}.provider-sidebar__nav{display:flex;flex-direction:column;gap:4px;padding-top:8px;width:100%}.provider-sidebar__link{align-items:center;border-radius:8px;box-sizing:border-box;color:var(--fills-main-fill-primary,#14215a);cursor:pointer;display:flex;gap:8px;outline:none;padding:8px;text-decoration:none;transition:all .2s ease;width:100%}.provider-sidebar__link:hover:not(.provider-sidebar__link--active){background:var(--surfaces-main-background-secondary-hover,#f0f0f4)}.provider-sidebar__link:active:not(.provider-sidebar__link--active){background:var(--surfaces-main-background-secondary-pressed,#e8e8ec)}.provider-sidebar__link:focus-visible{outline:2px solid var(--fills-main-fill-primary,#14215a);outline-offset:2px}.provider-sidebar__link--collapsed{justify-content:center}.provider-sidebar__link--active{background:linear-gradient(to top right,var(--gradient-stop3,#0e8ce2) 0,var(--gradient-stop2,#5d5bf4) 50%,var(--gradient-stop1,#6200ee) 100%);color:#fff;cursor:default}.provider-sidebar__link--active .provider-sidebar__icon{color:#fff}.provider-sidebar__link--active .provider-sidebar__icon svg path{fill:#fff}.provider-sidebar__link--active .provider-sidebar__link-text{color:#fff}.provider-sidebar__icon{align-items:center;display:flex;flex-shrink:0;height:24px;justify-content:center;width:24px}.provider-sidebar__icon svg{height:100%;width:100%}.provider-sidebar__icon--back .back-icon-default{display:block}.provider-sidebar__icon--back .back-icon-hover{display:none}.provider-sidebar__link-text{color:var(--labels-main-label-primary,#121e52);font-family:Geist,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:13px;font-weight:500;line-height:16px;margin:0;white-space:nowrap}";
3
+ var css_248z = ".provider-sidebar{align-items:flex-start;background:var(--surfaces-main-background-secondary,#f8f8fa);border-right:1px solid var(--borders-main-border-primary,#e8e9ef);box-sizing:border-box;display:flex;flex-direction:column;height:100%;overflow-y:auto;padding:8px;transition:width .3s ease}.provider-sidebar--expanded{width:268px}.provider-sidebar--collapsed{width:72px}@media (max-width:640px){.provider-sidebar{border-right:none;width:100%!important}}.provider-sidebar__content{display:flex;flex-direction:column;gap:4px;width:100%}.provider-sidebar__back-link{align-items:center;border-radius:8px;box-sizing:border-box;color:var(--fills-main-fill-primary,#14215a);cursor:pointer;display:flex;gap:8px;padding:8px;transition:all .2s ease;width:100%}.provider-sidebar__back-link:hover{background:var(--surfaces-main-background-secondary-hover,#f0f0f4)}.provider-sidebar__back-link:hover .provider-sidebar__icon--back .back-icon-default{display:none}.provider-sidebar__back-link:hover .provider-sidebar__icon--back .back-icon-hover{display:block}.provider-sidebar__back-link:active{background:var(--surfaces-main-background-secondary-pressed,#e8e8ec)}.provider-sidebar__back-link--collapsed{justify-content:center}.provider-sidebar__header{align-items:center;box-sizing:border-box;display:flex;width:100%}.provider-sidebar__header--collapsed{justify-content:center}.provider-sidebar__avatar{align-items:center;border-radius:50%;display:flex;flex-shrink:0;height:47px;justify-content:center;overflow:hidden;position:relative;width:47px}.provider-sidebar__avatar img{height:100%;object-fit:cover;width:100%}.provider-sidebar__avatar-placeholder{align-items:center;display:flex;height:100%;justify-content:center;position:relative;width:100%}.provider-sidebar__avatar-placeholder:before{background:#626a9033;border:2px solid var(--fills-main-fill-secondary,#626a90);border-radius:50%;content:\"\";inset:0;position:absolute}.provider-sidebar__avatar-placeholder span{color:var(--labels-main-label-secondary,#626a90);font-family:Geist,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:18px;font-weight:700;position:relative;z-index:1}.provider-sidebar__header-text{display:flex;flex:1;flex-direction:column;gap:4px;min-width:0}.provider-sidebar__title{color:var(--labels-main-label-primary,#121e52);font-family:Geist,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:15px;font-weight:600;line-height:18px;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.provider-sidebar__badge{align-items:center;background:var(--surfaces-main-background-tertiary,#e8e9ef);border-radius:8px;display:inline-flex;justify-content:center;padding:4px 8px;transition:background .2s ease;width:fit-content}.provider-sidebar__header:hover .provider-sidebar__badge{background:var(--surfaces-main-background-tertiary-hover,#dcdde3)}.provider-sidebar__badge span{color:var(--labels-main-label-secondary,#626a90);font-family:Geist Mono,SF Mono,Consolas,monospace;font-size:10px;font-weight:600;line-height:12px;white-space:nowrap}.provider-sidebar__nav{display:flex;flex-direction:column;gap:4px;padding-top:8px;width:100%}.provider-sidebar__link{align-items:center;border-radius:8px;box-sizing:border-box;color:var(--fills-main-fill-primary,#14215a);cursor:pointer;display:flex;gap:8px;outline:none;padding:8px;text-decoration:none;transition:all .2s ease;width:100%}.provider-sidebar__link:hover:not(.provider-sidebar__link--active){background:var(--surfaces-main-background-secondary-hover,#f0f0f4)}.provider-sidebar__link:active:not(.provider-sidebar__link--active){background:var(--surfaces-main-background-secondary-pressed,#e8e8ec)}.provider-sidebar__link:focus-visible{outline:2px solid var(--fills-main-fill-primary,#14215a);outline-offset:2px}.provider-sidebar__link--collapsed{justify-content:center}.provider-sidebar__link--active{background:linear-gradient(to top right,var(--gradient-stop3,#0e8ce2) 0,var(--gradient-stop2,#5d5bf4) 50%,var(--gradient-stop1,#6200ee) 100%);color:#fff;cursor:default}.provider-sidebar__link--active .provider-sidebar__icon{color:#fff}.provider-sidebar__link--active .provider-sidebar__icon svg path{fill:#fff}.provider-sidebar__link--active .provider-sidebar__link-text{color:#fff}.provider-sidebar__icon{align-items:center;color:var(--fills-main-fill-primary,#14215a);display:flex;flex-shrink:0;height:24px;justify-content:center;width:24px}.provider-sidebar__icon svg{height:100%;width:100%}.provider-sidebar__icon svg path{fill:var(--fills-main-fill-primary,#14215a)}.provider-sidebar__icon--back .back-icon-default{display:block}.provider-sidebar__icon--back .back-icon-hover{display:none}.provider-sidebar__link-text{color:var(--labels-main-label-primary,#121e52);font-family:Geist,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:13px;font-weight:500;line-height:16px;margin:0;white-space:nowrap}";
4
4
  styleInject(css_248z);
5
5
 
6
6
  export { css_248z as default };
@@ -1 +1 @@
1
- {"version":3,"file":"TopNavigation.d.ts","sourceRoot":"","sources":["../../../../src/v2/navigation/DashboardLayout/TopNavigation.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAA;AACvC,OAAO,sBAAsB,CAAA;AAM7B,MAAM,WAAW,kBAAkB;IAC/B,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,WAAW,CAAC,EAAE,MAAM,IAAI,CAAA;IACxB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAA;IACzB,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAA;IAChC,WAAW,CAAC,EAAE,MAAM,IAAI,CAAA;IACxB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAA;IAC3B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAA;IAC/B,qBAAqB,CAAC,EAAE,OAAO,CAAA;IAC/B,aAAa,CAAC,EAAE,OAAO,CAAA;CAC1B;AAoGD,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CA6ItD,CAAA"}
1
+ {"version":3,"file":"TopNavigation.d.ts","sourceRoot":"","sources":["../../../../src/v2/navigation/DashboardLayout/TopNavigation.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAA;AACvC,OAAO,sBAAsB,CAAA;AAM7B,MAAM,WAAW,kBAAkB;IAC/B,gBAAgB,CAAC,EAAE,OAAO,CAAA;IAC1B,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,WAAW,CAAC,EAAE,MAAM,IAAI,CAAA;IACxB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAA;IACzB,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAA;IAChC,WAAW,CAAC,EAAE,MAAM,IAAI,CAAA;IACxB,cAAc,CAAC,EAAE,MAAM,IAAI,CAAA;IAC3B,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAA;IAC/B,qBAAqB,CAAC,EAAE,OAAO,CAAA;IAC/B,aAAa,CAAC,EAAE,OAAO,CAAA;CAC1B;AAoGD,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAkJtD,CAAA"}
@@ -322,13 +322,17 @@ var TopNavigation = function(param) {
322
322
  disabled: sidebarToggleDisabled,
323
323
  children: mobileMenuOpen ? /*#__PURE__*/ jsx(CloseIcon, {}) : /*#__PURE__*/ jsx(BurgerIcon, {})
324
324
  }),
325
- /*#__PURE__*/ jsx("button", {
326
- className: "top-navigation__toggle top-navigation__toggle--desktop ".concat(sidebarToggleDisabled ? 'top-navigation__toggle--disabled' : ''),
327
- onClick: sidebarToggleDisabled ? undefined : onSidebarToggle,
328
- "aria-label": "Toggle sidebar",
329
- disabled: sidebarToggleDisabled,
330
- title: sidebarCollapsed ? 'Expand sidebar' : 'Collapse sidebar',
331
- children: sidebarCollapsed ? /*#__PURE__*/ jsx(SidebarCollapsedIcon, {}) : /*#__PURE__*/ jsx(SidebarOpenIcon, {})
325
+ /*#__PURE__*/ jsx(Tooltip, {
326
+ content: sidebarCollapsed ? 'Expand ]' : 'Collapse [',
327
+ side: "bottom",
328
+ sideOffset: 8,
329
+ children: /*#__PURE__*/ jsx("button", {
330
+ className: "top-navigation__toggle top-navigation__toggle--desktop ".concat(sidebarToggleDisabled ? 'top-navigation__toggle--disabled' : ''),
331
+ onClick: sidebarToggleDisabled ? undefined : onSidebarToggle,
332
+ "aria-label": "Toggle sidebar",
333
+ disabled: sidebarToggleDisabled,
334
+ children: sidebarCollapsed ? /*#__PURE__*/ jsx(SidebarCollapsedIcon, {}) : /*#__PURE__*/ jsx(SidebarOpenIcon, {})
335
+ })
332
336
  }),
333
337
  /*#__PURE__*/ jsx("img", {
334
338
  src: img,
package/package.json CHANGED
@@ -1,14 +1,14 @@
1
1
  {
2
2
  "name": "@licklist/design",
3
- "version": "0.78.5-dev.36",
3
+ "version": "0.78.5-dev.38",
4
4
  "repository": {
5
5
  "type": "git",
6
- "url": "git+ssh://git@bitbucket.org/artelogicsoft/licklist_design.git"
6
+ "url": "git+ssh://git@bitbucket.org/bookedit-licklist/licklist_design.git"
7
7
  },
8
8
  "author": "Yaroslav Havryliv",
9
9
  "license": "MIT",
10
10
  "type": "module",
11
- "homepage": "https://bitbucket.org/artelogicsoft/licklist_design#readme",
11
+ "homepage": "https://bitbucket.org/bookedit-licklist/licklist_design#readme",
12
12
  "description": "",
13
13
  "scripts": {
14
14
  "start": "storybook dev -p 9009",
@@ -226,5 +226,5 @@
226
226
  "yarn": "4.4.0"
227
227
  },
228
228
  "packageManager": "yarn@4.8.0",
229
- "stableVersion": "0.78.5-dev.31"
229
+ "stableVersion": "0.78.5-dev.38"
230
230
  }
@@ -1,5 +1,5 @@
1
1
  import { ReactNode, useEffect, useState, useCallback } from 'react'
2
- import { matchPath, useLocation } from 'react-router-dom'
2
+ import { matchPath, useLocation, useNavigate } from 'react-router-dom'
3
3
  import useUser from '@licklist/plugins/dist/context/user/hooks/useUser'
4
4
  import { ROUTES, MATCH_ROUTE_PATTERNS } from '@licklist/core/dist/Config'
5
5
  import useAuthApi from '@licklist/plugins/dist/hooks/Api/useAuthApi'
@@ -18,6 +18,7 @@ function Authorizer(props: AuthorizerProps) {
18
18
  const { useProfile } = useAuthApi()
19
19
 
20
20
  const { pathname } = useLocation()
21
+ const navigate = useNavigate()
21
22
 
22
23
  // This will re-fetch user's profile
23
24
  const profile = useProfile()
@@ -54,38 +55,41 @@ function Authorizer(props: AuthorizerProps) {
54
55
  return
55
56
  }
56
57
 
57
- if (
58
- [
59
- ROUTES.LOGIN_PAGE,
60
- ROUTES.REGISTER_PAGE,
61
- ROUTES.PRIVACY_PAGE,
62
- ROUTES.TERMS_PAGE,
63
- ROUTES.PRIVACY_FACTS_PAGE,
64
- ROUTES.CHANGE_PASSWORD,
65
- ROUTES.FORGOT_PASSWORD,
66
- ROUTES.SSO_LOGIN,
67
- ROUTES.MAINTENANCE_PAGE,
68
- ...matchedPathPatternUrls(),
69
- ].includes(pathname)
70
- ) {
71
- setIsValidated(() => true)
58
+ const publicRoutes = [
59
+ ROUTES.LOGIN_PAGE,
60
+ ROUTES.REGISTER_PAGE,
61
+ ROUTES.PRIVACY_PAGE,
62
+ ROUTES.TERMS_PAGE,
63
+ ROUTES.PRIVACY_FACTS_PAGE,
64
+ ROUTES.CHANGE_PASSWORD,
65
+ ROUTES.FORGOT_PASSWORD,
66
+ ROUTES.SSO_LOGIN,
67
+ ROUTES.MAINTENANCE_PAGE,
68
+ ...matchedPathPatternUrls(),
69
+ ]
70
+
71
+ // If we're on a public route (e.g. /login), mark as validated and never redirect
72
+ if (publicRoutes.includes(pathname)) {
73
+ setIsValidated(true)
72
74
  return
73
75
  }
74
76
 
75
77
  const route = RouteService.getCurrentRoute()
76
78
 
77
- RouteService.redirectTo(
78
- [ROUTES.MAINTENANCE_PAGE, `returnUrl=${escape(route)}`].join('?'),
79
+ navigate(
80
+ [ROUTES.LOGIN_PAGE, `returnUrl=${escape(route)}`].join('?'),
81
+ { replace: true },
79
82
  )
80
83
  }, [
81
84
  auth.secrets,
82
85
  user.profile,
83
86
  profile.data,
84
- matchedPathPatternUrls,
85
87
  profile.isError,
86
88
  profile.isLoading,
87
89
  profile.isFetching,
88
90
  pathname,
91
+ matchedPathPatternUrls,
92
+ navigate,
89
93
  ])
90
94
 
91
95
  if (profile.isFetching || profile.isLoading || !isValidated)
@@ -1,5 +1,6 @@
1
1
  import React from 'react'
2
2
  import './UserPanel.scss'
3
+ import { UserAvatar } from '../UserAvatar'
3
4
 
4
5
  export interface UserPanelProps {
5
6
  isOpen: boolean
@@ -68,18 +69,11 @@ export const UserPanel: React.FC<UserPanelProps> = ({
68
69
  {/* Header */}
69
70
  <div className="user-panel__header">
70
71
  <div className="user-panel__user-info">
71
- <div className="user-panel__avatar">
72
- {avatarUrl ? (
73
- <img src={avatarUrl} alt="Profile" />
74
- ) : (
75
- <>
76
- <svg width="32" height="32" viewBox="0 0 32 32" fill="none" className="user-panel__avatar-bg">
77
- <circle cx="16" cy="16" r="15" fill="var(--fills-main-fill-secondary, #626A90)" fillOpacity="0.2" stroke="var(--fills-main-fill-secondary, #626A90)" strokeWidth="2" />
78
- </svg>
79
- <span className="user-panel__avatar-initials">{displayInitials}</span>
80
- </>
81
- )}
82
- </div>
72
+ <UserAvatar
73
+ initials={displayInitials}
74
+ avatarUrl={avatarUrl || undefined}
75
+ size="md"
76
+ />
83
77
  <div className="user-panel__user-details">
84
78
  <h2 className="user-panel__greeting">Hey {displayFirstName}</h2>
85
79
  {email && (
@@ -1,4 +1,4 @@
1
- import React, { useState } from 'react'
1
+ import React, { useState, useEffect, useCallback } from 'react'
2
2
  import { TopNavigation } from './TopNavigation'
3
3
  import { ProviderSidebar, NavItem } from './ProviderSidebar'
4
4
  import { AdminSidebar } from './AdminSidebar'
@@ -111,6 +111,24 @@ export const DashboardLayout: React.FC<DashboardLayoutProps> = ({
111
111
  }) => {
112
112
  const [mobileMenuOpen, setMobileMenuOpen] = useState(false)
113
113
 
114
+ const handleKeyDown = useCallback((event: KeyboardEvent) => {
115
+ const target = event.target as HTMLElement
116
+ if (target.tagName === 'INPUT' || target.tagName === 'TEXTAREA' || target.isContentEditable) {
117
+ return
118
+ }
119
+
120
+ if (event.key === '[' && sidebarExpanded) {
121
+ onSidebarToggle?.()
122
+ } else if (event.key === ']' && !sidebarExpanded) {
123
+ onSidebarToggle?.()
124
+ }
125
+ }, [sidebarExpanded, onSidebarToggle])
126
+
127
+ useEffect(() => {
128
+ document.addEventListener('keydown', handleKeyDown)
129
+ return () => document.removeEventListener('keydown', handleKeyDown)
130
+ }, [handleKeyDown])
131
+
114
132
  const handleSidebarToggle = () => {
115
133
  if (isMobile) {
116
134
  setMobileMenuOpen(!mobileMenuOpen)
@@ -238,10 +238,15 @@
238
238
  display: flex;
239
239
  align-items: center;
240
240
  justify-content: center;
241
+ color: var(--fills-main-fill-primary, #14215A);
241
242
 
242
243
  svg {
243
244
  width: 100%;
244
245
  height: 100%;
246
+
247
+ path {
248
+ fill: var(--fills-main-fill-primary, #14215A);
249
+ }
245
250
  }
246
251
 
247
252
  &--back {
@@ -189,7 +189,14 @@ export const ProviderSidebar: React.FC<ProviderSidebarProps> = ({
189
189
 
190
190
 
191
191
  {expanded ? (
192
- <div className="provider-sidebar__header">
192
+ <div
193
+ className="provider-sidebar__header"
194
+ onClick={() => handleNavClick('/profile')}
195
+ role="button"
196
+ tabIndex={0}
197
+ onKeyDown={(e) => e.key === 'Enter' && handleNavClick('/profile')}
198
+ style={{ cursor: 'pointer' }}
199
+ >
193
200
  <EntityHeader
194
201
  name={providerName}
195
202
  id={providerId}
@@ -201,7 +208,14 @@ export const ProviderSidebar: React.FC<ProviderSidebarProps> = ({
201
208
  </div>
202
209
  ) : (
203
210
  <Tooltip content={providerName} side="right" sideOffset={8} delayDuration={100}>
204
- <div className="provider-sidebar__header provider-sidebar__header--collapsed">
211
+ <div
212
+ className="provider-sidebar__header provider-sidebar__header--collapsed"
213
+ onClick={() => handleNavClick('/profile')}
214
+ role="button"
215
+ tabIndex={0}
216
+ onKeyDown={(e) => e.key === 'Enter' && handleNavClick('/profile')}
217
+ style={{ cursor: 'pointer' }}
218
+ >
205
219
  <EntityHeader
206
220
  name={providerName}
207
221
  id={providerId}
@@ -171,15 +171,20 @@ export const TopNavigation: React.FC<TopNavigationProps> = ({
171
171
  {mobileMenuOpen ? <CloseIcon /> : <BurgerIcon />}
172
172
  </button>
173
173
 
174
- <button
175
- className={`top-navigation__toggle top-navigation__toggle--desktop ${sidebarToggleDisabled ? 'top-navigation__toggle--disabled' : ''}`}
176
- onClick={sidebarToggleDisabled ? undefined : onSidebarToggle}
177
- aria-label="Toggle sidebar"
178
- disabled={sidebarToggleDisabled}
179
- title={sidebarCollapsed ? 'Expand sidebar' : 'Collapse sidebar'}
174
+ <Tooltip
175
+ content={sidebarCollapsed ? 'Expand ]' : 'Collapse ['}
176
+ side="bottom"
177
+ sideOffset={8}
180
178
  >
181
- {sidebarCollapsed ? <SidebarCollapsedIcon /> : <SidebarOpenIcon />}
182
- </button>
179
+ <button
180
+ className={`top-navigation__toggle top-navigation__toggle--desktop ${sidebarToggleDisabled ? 'top-navigation__toggle--disabled' : ''}`}
181
+ onClick={sidebarToggleDisabled ? undefined : onSidebarToggle}
182
+ aria-label="Toggle sidebar"
183
+ disabled={sidebarToggleDisabled}
184
+ >
185
+ {sidebarCollapsed ? <SidebarCollapsedIcon /> : <SidebarOpenIcon />}
186
+ </button>
187
+ </Tooltip>
183
188
 
184
189
  <img src={BookedLogoMark} alt="Booked it" className="top-navigation__logo-mark" />
185
190
  <BookedLogoFull className="top-navigation__logo-full" />