supernav-test 2.2.15 → 2.2.16
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.
- package/dist/App.test.d.ts +1 -0
- package/dist/App.test.js +7 -0
- package/dist/LsacContainer.d.ts +4 -0
- package/dist/LsacContainer.js +14 -0
- package/dist/components/lsac-supernavbar/AuthWrapper.d.ts +4 -0
- package/dist/components/lsac-supernavbar/AuthWrapper.js +47 -0
- package/dist/components/lsac-supernavbar/LsacSidebar.d.ts +44 -0
- package/dist/components/lsac-supernavbar/LsacSidebar.js +35 -0
- package/dist/components/lsac-supernavbar/Store.d.ts +3 -0
- package/dist/components/lsac-supernavbar/Store.js +12 -0
- package/dist/components/lsac-supernavbar/actions/AuthActions.d.ts +8 -0
- package/dist/components/lsac-supernavbar/actions/AuthActions.js +22 -0
- package/dist/components/lsac-supernavbar/actions/SidebarActions.d.ts +23 -0
- package/dist/components/lsac-supernavbar/actions/SidebarActions.js +81 -0
- package/dist/components/lsac-supernavbar/components/Sidebar.d.ts +13 -0
- package/dist/components/lsac-supernavbar/components/Sidebar.js +193 -0
- package/dist/components/lsac-supernavbar/components/SidebarForm.d.ts +5 -0
- package/dist/components/lsac-supernavbar/components/SidebarForm.js +8 -0
- package/dist/components/lsac-supernavbar/components/SidebarMainLink.d.ts +14 -0
- package/dist/components/lsac-supernavbar/components/SidebarMainLink.js +60 -0
- package/dist/components/lsac-supernavbar/components/SidebarOption.d.ts +4 -0
- package/dist/components/lsac-supernavbar/components/SidebarOption.js +8 -0
- package/dist/components/lsac-supernavbar/components/SidebarSubMenu.d.ts +5 -0
- package/dist/components/lsac-supernavbar/components/SidebarSubMenu.js +68 -0
- package/dist/components/lsac-supernavbar/components/SidebarTab.d.ts +1 -0
- package/dist/components/lsac-supernavbar/components/SidebarTab.js +50 -0
- package/dist/components/lsac-supernavbar/components/Topnav.d.ts +14 -0
- package/dist/components/lsac-supernavbar/components/Topnav.js +76 -0
- package/dist/components/lsac-supernavbar/components/sidebar_submenus/CategorizedSubmenu.d.ts +9 -0
- package/dist/components/lsac-supernavbar/components/sidebar_submenus/CategorizedSubmenu.js +57 -0
- package/dist/components/lsac-supernavbar/components/sidebar_submenus/Marketplace.d.ts +5 -0
- package/dist/components/lsac-supernavbar/components/sidebar_submenus/Marketplace.js +7 -0
- package/dist/components/lsac-supernavbar/constants/SidebarConstants.d.ts +8 -0
- package/dist/components/lsac-supernavbar/constants/SidebarConstants.js +12 -0
- package/dist/components/lsac-supernavbar/constants/UtilityConstants.d.ts +15 -0
- package/dist/components/lsac-supernavbar/constants/UtilityConstants.js +21 -0
- package/dist/components/lsac-supernavbar/interfaces/Models.d.ts +65 -0
- package/dist/components/lsac-supernavbar/interfaces/Models.js +12 -0
- package/dist/components/lsac-supernavbar/interfaces/Redux.d.ts +7 -0
- package/dist/components/lsac-supernavbar/interfaces/Redux.js +2 -0
- package/dist/components/lsac-supernavbar/reducers/AuthReducer.d.ts +7 -0
- package/dist/components/lsac-supernavbar/reducers/AuthReducer.js +19 -0
- package/dist/components/lsac-supernavbar/reducers/RootReducer.d.ts +5 -0
- package/dist/components/lsac-supernavbar/reducers/RootReducer.js +10 -0
- package/dist/components/lsac-supernavbar/reducers/SidebarReducer.d.ts +17 -0
- package/dist/components/lsac-supernavbar/reducers/SidebarReducer.js +49 -0
- package/dist/components/lsac-supernavbar/resources/icomoon-library.json +1 -0
- package/dist/components/lsac-supernavbar/test/App.test.d.ts +1 -0
- package/dist/components/lsac-supernavbar/test/App.test.js +22 -0
- package/dist/components/lsac-supernavbar/util/SubmenuUtil.d.ts +9 -0
- package/dist/components/lsac-supernavbar/util/SubmenuUtil.js +112 -0
- package/dist/components/lsac-supernavbar/util/Util.d.ts +4 -0
- package/dist/components/lsac-supernavbar/util/Util.js +24 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.js +17 -67
- package/dist/reportWebVitals.d.ts +3 -0
- package/dist/reportWebVitals.js +33 -0
- package/dist/setupTests.d.ts +1 -0
- package/dist/setupTests.js +7 -0
- package/package.json +9 -4
@@ -0,0 +1 @@
|
|
1
|
+
export {};
|
package/dist/App.test.js
ADDED
@@ -0,0 +1,7 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
+
const react_1 = require("@testing-library/react");
|
4
|
+
test('renders learn react link', () => {
|
5
|
+
const linkElement = react_1.screen.getByText(/learn react/i);
|
6
|
+
expect(linkElement).toBeInTheDocument();
|
7
|
+
});
|
@@ -0,0 +1,14 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
+
};
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
7
|
+
require("./App.css");
|
8
|
+
const LsacSidebar_1 = __importDefault(require("./components/lsac-supernavbar/LsacSidebar"));
|
9
|
+
const react_redux_1 = require("react-redux");
|
10
|
+
const Store_1 = __importDefault(require("./components/lsac-supernavbar/Store"));
|
11
|
+
function LsacContainer(props) {
|
12
|
+
return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: "App" }, { children: (0, jsx_runtime_1.jsx)(react_redux_1.Provider, Object.assign({ store: Store_1.default }, { children: (0, jsx_runtime_1.jsx)(LsacSidebar_1.default, Object.assign({}, props), void 0) }), void 0) }), void 0));
|
13
|
+
}
|
14
|
+
exports.default = LsacContainer;
|
@@ -0,0 +1,47 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
+
};
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
7
|
+
const react_1 = require("react");
|
8
|
+
const react_redux_1 = require("react-redux");
|
9
|
+
const AuthActions_1 = require("./actions/AuthActions");
|
10
|
+
const SidebarActions_1 = require("./actions/SidebarActions");
|
11
|
+
const Topnav_1 = __importDefault(require("./components/Topnav"));
|
12
|
+
const Sidebar_1 = __importDefault(require("./components/Sidebar"));
|
13
|
+
const UtilityConstants_1 = require("./constants/UtilityConstants");
|
14
|
+
const Util_1 = __importDefault(require("./util/Util"));
|
15
|
+
function AuthWrapper(props) {
|
16
|
+
const { currentNav, sidebarOptions, appContext, extraTopNavComponent, ignoreUniversalFontSizer, topNavHeight, applicationTitle, runMode, userInfo, accountName, accountSwitchUrl, logoutUrl, topnavDisplayMode, sidebarDisplayMode } = props;
|
17
|
+
const uiDevMode = runMode === UtilityConstants_1.RunModes.UI_DEV_MODE;
|
18
|
+
const dispatch = (0, react_redux_1.useDispatch)();
|
19
|
+
(0, react_1.useEffect)(() => {
|
20
|
+
dispatch((0, AuthActions_1.setUiDevMode)(uiDevMode));
|
21
|
+
}, [uiDevMode]);
|
22
|
+
// Once we have an initialized keycloak, then fetch the userInfo's information
|
23
|
+
(0, react_1.useEffect)(() => {
|
24
|
+
if (!uiDevMode && userInfo) {
|
25
|
+
dispatch((0, AuthActions_1.setUserInfo)(userInfo));
|
26
|
+
}
|
27
|
+
}, [uiDevMode, userInfo]);
|
28
|
+
(0, react_1.useEffect)(() => {
|
29
|
+
if (uiDevMode) {
|
30
|
+
dispatch((0, AuthActions_1.setUserInfo)({
|
31
|
+
name: 'test-userInfo'
|
32
|
+
}));
|
33
|
+
}
|
34
|
+
}, [uiDevMode]);
|
35
|
+
// If the calling application has local application links, set those in the store so they can be consumed by the Sidebar
|
36
|
+
(0, react_1.useEffect)(() => {
|
37
|
+
if (sidebarOptions && sidebarOptions.length > 0) {
|
38
|
+
const applications = Util_1.default.sidebarOptionsToApplication(sidebarOptions);
|
39
|
+
dispatch((0, SidebarActions_1.SetLocalApps)(applications));
|
40
|
+
}
|
41
|
+
}, [sidebarOptions]);
|
42
|
+
const isReady = uiDevMode || userInfo;
|
43
|
+
return isReady
|
44
|
+
? ((0, jsx_runtime_1.jsxs)("div", Object.assign({ id: 'lsac-supernavbar-root' }, { children: [(0, jsx_runtime_1.jsx)(Topnav_1.default, { extraTopNavComponent: extraTopNavComponent, topNavHeight: topNavHeight, applicationTitle: applicationTitle, accountName: accountName, accountSwitchUrl: accountSwitchUrl, logoutUrl: logoutUrl, sidebarDisplayMode: sidebarDisplayMode, topnavDisplayMode: topnavDisplayMode }, void 0), (0, jsx_runtime_1.jsx)(Sidebar_1.default, { currentNav: currentNav, appContext: appContext, topNavHeight: topNavHeight, sidebarDisplayMode: sidebarDisplayMode, sidebarOptions: sidebarOptions }, void 0)] }), void 0))
|
45
|
+
: null;
|
46
|
+
}
|
47
|
+
exports.default = AuthWrapper;
|
@@ -0,0 +1,44 @@
|
|
1
|
+
/// <reference types="react" />
|
2
|
+
import { SidebarOption, UserInfo } from "./interfaces/Models";
|
3
|
+
import { RunModes, SidebarDisplayModes, TopnavDisplayModes } from "./constants/UtilityConstants";
|
4
|
+
export interface LsacSidebarProps {
|
5
|
+
currentNav: string;
|
6
|
+
sidebarOptions: Array<SidebarOption>;
|
7
|
+
applicationTitle: string;
|
8
|
+
appContext?: string;
|
9
|
+
componentTitle: String;
|
10
|
+
extraTopNavComponent: any;
|
11
|
+
ignoreUniversalFontSizer: boolean;
|
12
|
+
topNavHeight: string;
|
13
|
+
runMode: RunModes;
|
14
|
+
hasKeycloakInstance: boolean;
|
15
|
+
userInfo?: UserInfo;
|
16
|
+
accountName: string;
|
17
|
+
accountSwitchUrl: string;
|
18
|
+
logoutUrl: string;
|
19
|
+
sidebarDisplayMode: SidebarDisplayModes;
|
20
|
+
topnavDisplayMode: TopnavDisplayModes;
|
21
|
+
}
|
22
|
+
declare function LsacSidebar(props: LsacSidebarProps): JSX.Element;
|
23
|
+
declare namespace LsacSidebar {
|
24
|
+
var defaultProps: {
|
25
|
+
componentTitle: string;
|
26
|
+
apiKey: null;
|
27
|
+
currentNav: string;
|
28
|
+
appContext: string;
|
29
|
+
sidebarOptions: never[];
|
30
|
+
extraTopNavComponent: null;
|
31
|
+
ignoreUniversalFontSizer: boolean;
|
32
|
+
topNavHeight: string;
|
33
|
+
applicationTitle: string;
|
34
|
+
runMode: string;
|
35
|
+
hasKeycloakInstance: boolean;
|
36
|
+
userInfo: null;
|
37
|
+
accountName: string;
|
38
|
+
accountSwitchUrl: string;
|
39
|
+
logoutUrl: string;
|
40
|
+
topnavDisplayMode: TopnavDisplayModes;
|
41
|
+
sidebarDisplayMode: SidebarDisplayModes;
|
42
|
+
};
|
43
|
+
}
|
44
|
+
export default LsacSidebar;
|
@@ -0,0 +1,35 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
+
};
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
7
|
+
const AuthWrapper_1 = __importDefault(require("./AuthWrapper"));
|
8
|
+
const UtilityConstants_1 = require("./constants/UtilityConstants");
|
9
|
+
require('./stylesheets/LsacSidebar.css');
|
10
|
+
require('./stylesheets/fontIcons.css');
|
11
|
+
require('./stylesheets/font-sizer.scss');
|
12
|
+
function LsacSidebar(props) {
|
13
|
+
const content = (0, jsx_runtime_1.jsx)(AuthWrapper_1.default, Object.assign({}, props), void 0);
|
14
|
+
return (content);
|
15
|
+
}
|
16
|
+
LsacSidebar.defaultProps = {
|
17
|
+
componentTitle: 'Lsac Supernavbar',
|
18
|
+
apiKey: null,
|
19
|
+
currentNav: '',
|
20
|
+
appContext: '',
|
21
|
+
sidebarOptions: [],
|
22
|
+
extraTopNavComponent: null,
|
23
|
+
ignoreUniversalFontSizer: false,
|
24
|
+
topNavHeight: '3.5rem',
|
25
|
+
applicationTitle: '',
|
26
|
+
runMode: 'ui_dev_mode',
|
27
|
+
hasKeycloakInstance: false,
|
28
|
+
userInfo: null,
|
29
|
+
accountName: '',
|
30
|
+
accountSwitchUrl: '',
|
31
|
+
logoutUrl: '',
|
32
|
+
topnavDisplayMode: UtilityConstants_1.TopnavDisplayModes.ALL,
|
33
|
+
sidebarDisplayMode: UtilityConstants_1.SidebarDisplayModes.MINIMAL
|
34
|
+
};
|
35
|
+
exports.default = LsacSidebar;
|
@@ -0,0 +1,12 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
4
|
+
};
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
6
|
+
const redux_1 = require("redux");
|
7
|
+
const redux_thunk_1 = __importDefault(require("redux-thunk"));
|
8
|
+
const RootReducer_1 = __importDefault(require("./reducers/RootReducer"));
|
9
|
+
// @ts-ignore
|
10
|
+
const composeEnhancers = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || redux_1.compose;
|
11
|
+
const store = (0, redux_1.createStore)(RootReducer_1.default, /* preloadedState, */ composeEnhancers((0, redux_1.applyMiddleware)(redux_thunk_1.default)));
|
12
|
+
exports.default = store;
|
@@ -0,0 +1,8 @@
|
|
1
|
+
import { Action } from "../interfaces/Redux";
|
2
|
+
import { UserInfo } from "../interfaces/Models";
|
3
|
+
export declare enum actionTypes {
|
4
|
+
SET_UI_DEV_MODE = "SET_UI_DEV_MODE",
|
5
|
+
SET_USER_INFO = "SET_USER_INFO"
|
6
|
+
}
|
7
|
+
export declare function setUserInfo(user: UserInfo): Action;
|
8
|
+
export declare function setUiDevMode(uiDevMode: boolean): Action;
|
@@ -0,0 +1,22 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
+
exports.setUiDevMode = exports.setUserInfo = exports.actionTypes = void 0;
|
4
|
+
var actionTypes;
|
5
|
+
(function (actionTypes) {
|
6
|
+
actionTypes["SET_UI_DEV_MODE"] = "SET_UI_DEV_MODE";
|
7
|
+
actionTypes["SET_USER_INFO"] = "SET_USER_INFO";
|
8
|
+
})(actionTypes = exports.actionTypes || (exports.actionTypes = {}));
|
9
|
+
function setUserInfo(user) {
|
10
|
+
return {
|
11
|
+
type: actionTypes.SET_USER_INFO,
|
12
|
+
payload: user,
|
13
|
+
};
|
14
|
+
}
|
15
|
+
exports.setUserInfo = setUserInfo;
|
16
|
+
function setUiDevMode(uiDevMode) {
|
17
|
+
return {
|
18
|
+
type: actionTypes.SET_UI_DEV_MODE,
|
19
|
+
payload: uiDevMode,
|
20
|
+
};
|
21
|
+
}
|
22
|
+
exports.setUiDevMode = setUiDevMode;
|
@@ -0,0 +1,23 @@
|
|
1
|
+
import { Application, SidebarOption } from "../interfaces/Models";
|
2
|
+
import { Action } from "../interfaces/Redux";
|
3
|
+
import { SidebarMenuTypes } from "../constants/SidebarConstants";
|
4
|
+
export declare enum actionTypes {
|
5
|
+
EXPAND_APP = "EXPAND_APP",
|
6
|
+
REGISTER_EXTRA_TOP_NAV_COMPONENT = "REGISTER_EXTRA_TOP_NAV_COMPONENT",
|
7
|
+
REGISTER_SIDEBAR_OPTIONS = "REGISTER_SIDEBAR_OPTIONS",
|
8
|
+
SET_LOCAL_APPLICATIONS = "SET_LOCAL_APPLICATIONS",
|
9
|
+
SET_EXPAND_SIDEBAR = "SET_EXPAND_SIDEBAR",
|
10
|
+
SET_SELECTED_SIDEBAR_OPTION = "SET_SELECTED_SIDEBAR_OPTION",
|
11
|
+
SET_TOPNAV_TOGGLE_REF = "SET_TOPNAV_TOGGLE_REF",
|
12
|
+
SET_MINIMAL_SIDEBAR = "SET_MINIMAL_SIDEBAR",
|
13
|
+
SET_SHOW_EXPANDED_APPS = "SET_SHOW_EXPANDED_APPS"
|
14
|
+
}
|
15
|
+
export declare function registerSidebarOptions(options: SidebarOption): Action;
|
16
|
+
export declare function registerExtraTopNavComponent(component: Element): Action;
|
17
|
+
export declare function SetTopnavToggleref(ref: any): Action;
|
18
|
+
export declare function SetExpandSidebar(isExpanded: boolean): Action;
|
19
|
+
export declare function SetMinimalSidebar(isMinimal: boolean): Action;
|
20
|
+
export declare function SetLocalApps(localApps: Array<Application>): Action;
|
21
|
+
export declare function SetSelectedSidebarOption(menuType: SidebarMenuTypes): Action;
|
22
|
+
export declare function ExpandApp(appKey: string, isExpanded: boolean): Action;
|
23
|
+
export declare function SetShowExpandedApps(expanded: boolean): Action;
|
@@ -0,0 +1,81 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
3
|
+
exports.SetShowExpandedApps = exports.ExpandApp = exports.SetSelectedSidebarOption = exports.SetLocalApps = exports.SetMinimalSidebar = exports.SetExpandSidebar = exports.SetTopnavToggleref = exports.registerExtraTopNavComponent = exports.registerSidebarOptions = exports.actionTypes = void 0;
|
4
|
+
var actionTypes;
|
5
|
+
(function (actionTypes) {
|
6
|
+
actionTypes["EXPAND_APP"] = "EXPAND_APP";
|
7
|
+
actionTypes["REGISTER_EXTRA_TOP_NAV_COMPONENT"] = "REGISTER_EXTRA_TOP_NAV_COMPONENT";
|
8
|
+
actionTypes["REGISTER_SIDEBAR_OPTIONS"] = "REGISTER_SIDEBAR_OPTIONS";
|
9
|
+
actionTypes["SET_LOCAL_APPLICATIONS"] = "SET_LOCAL_APPLICATIONS";
|
10
|
+
actionTypes["SET_EXPAND_SIDEBAR"] = "SET_EXPAND_SIDEBAR";
|
11
|
+
actionTypes["SET_SELECTED_SIDEBAR_OPTION"] = "SET_SELECTED_SIDEBAR_OPTION";
|
12
|
+
actionTypes["SET_TOPNAV_TOGGLE_REF"] = "SET_TOPNAV_TOGGLE_REF";
|
13
|
+
actionTypes["SET_MINIMAL_SIDEBAR"] = "SET_MINIMAL_SIDEBAR";
|
14
|
+
actionTypes["SET_SHOW_EXPANDED_APPS"] = "SET_SHOW_EXPANDED_APPS";
|
15
|
+
})(actionTypes = exports.actionTypes || (exports.actionTypes = {}));
|
16
|
+
function registerSidebarOptions(options) {
|
17
|
+
return {
|
18
|
+
type: actionTypes.REGISTER_SIDEBAR_OPTIONS,
|
19
|
+
payload: options,
|
20
|
+
};
|
21
|
+
}
|
22
|
+
exports.registerSidebarOptions = registerSidebarOptions;
|
23
|
+
function registerExtraTopNavComponent(component) {
|
24
|
+
return {
|
25
|
+
type: actionTypes.REGISTER_EXTRA_TOP_NAV_COMPONENT,
|
26
|
+
payload: component,
|
27
|
+
};
|
28
|
+
}
|
29
|
+
exports.registerExtraTopNavComponent = registerExtraTopNavComponent;
|
30
|
+
function SetTopnavToggleref(ref) {
|
31
|
+
return {
|
32
|
+
type: actionTypes.SET_TOPNAV_TOGGLE_REF,
|
33
|
+
payload: ref
|
34
|
+
};
|
35
|
+
}
|
36
|
+
exports.SetTopnavToggleref = SetTopnavToggleref;
|
37
|
+
function SetExpandSidebar(isExpanded) {
|
38
|
+
return {
|
39
|
+
type: actionTypes.SET_EXPAND_SIDEBAR,
|
40
|
+
payload: isExpanded,
|
41
|
+
};
|
42
|
+
}
|
43
|
+
exports.SetExpandSidebar = SetExpandSidebar;
|
44
|
+
function SetMinimalSidebar(isMinimal) {
|
45
|
+
return {
|
46
|
+
type: actionTypes.SET_MINIMAL_SIDEBAR,
|
47
|
+
payload: isMinimal,
|
48
|
+
};
|
49
|
+
}
|
50
|
+
exports.SetMinimalSidebar = SetMinimalSidebar;
|
51
|
+
function SetLocalApps(localApps) {
|
52
|
+
return {
|
53
|
+
type: actionTypes.SET_LOCAL_APPLICATIONS,
|
54
|
+
payload: localApps,
|
55
|
+
};
|
56
|
+
}
|
57
|
+
exports.SetLocalApps = SetLocalApps;
|
58
|
+
function SetSelectedSidebarOption(menuType) {
|
59
|
+
return {
|
60
|
+
type: actionTypes.SET_SELECTED_SIDEBAR_OPTION,
|
61
|
+
payload: menuType,
|
62
|
+
};
|
63
|
+
}
|
64
|
+
exports.SetSelectedSidebarOption = SetSelectedSidebarOption;
|
65
|
+
function ExpandApp(appKey, isExpanded) {
|
66
|
+
return {
|
67
|
+
type: actionTypes.EXPAND_APP,
|
68
|
+
payload: {
|
69
|
+
appKey,
|
70
|
+
isExpanded
|
71
|
+
},
|
72
|
+
};
|
73
|
+
}
|
74
|
+
exports.ExpandApp = ExpandApp;
|
75
|
+
function SetShowExpandedApps(expanded) {
|
76
|
+
return {
|
77
|
+
type: actionTypes.SET_SHOW_EXPANDED_APPS,
|
78
|
+
payload: expanded
|
79
|
+
};
|
80
|
+
}
|
81
|
+
exports.SetShowExpandedApps = SetShowExpandedApps;
|
@@ -0,0 +1,13 @@
|
|
1
|
+
import React from 'react';
|
2
|
+
import { SidebarDisplayModes } from "../constants/UtilityConstants";
|
3
|
+
import { SidebarOption } from "../interfaces/Models";
|
4
|
+
interface SidebarProps {
|
5
|
+
currentNav: string;
|
6
|
+
appContext?: string;
|
7
|
+
topNavHeight: string;
|
8
|
+
sidebarDisplayMode: SidebarDisplayModes;
|
9
|
+
sidebarOptions: Array<SidebarOption>;
|
10
|
+
}
|
11
|
+
declare function Sidebar(props: SidebarProps): JSX.Element;
|
12
|
+
declare const MemoizedSidebar: React.MemoExoticComponent<typeof Sidebar>;
|
13
|
+
export default MemoizedSidebar;
|
@@ -0,0 +1,193 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
|
3
|
+
if (k2 === undefined) k2 = k;
|
4
|
+
Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
|
5
|
+
}) : (function(o, m, k, k2) {
|
6
|
+
if (k2 === undefined) k2 = k;
|
7
|
+
o[k2] = m[k];
|
8
|
+
}));
|
9
|
+
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
|
10
|
+
Object.defineProperty(o, "default", { enumerable: true, value: v });
|
11
|
+
}) : function(o, v) {
|
12
|
+
o["default"] = v;
|
13
|
+
});
|
14
|
+
var __importStar = (this && this.__importStar) || function (mod) {
|
15
|
+
if (mod && mod.__esModule) return mod;
|
16
|
+
var result = {};
|
17
|
+
if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
|
18
|
+
__setModuleDefault(result, mod);
|
19
|
+
return result;
|
20
|
+
};
|
21
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
22
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
23
|
+
};
|
24
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
25
|
+
const react_1 = require("react");
|
26
|
+
const jsx_runtime_1 = require("react/jsx-runtime");
|
27
|
+
const react_2 = __importStar(require("react"));
|
28
|
+
const react_redux_1 = require("react-redux");
|
29
|
+
const classnames_1 = __importDefault(require("classnames"));
|
30
|
+
const SidebarForm_1 = __importDefault(require("./SidebarForm"));
|
31
|
+
const SidebarActions_1 = require("../actions/SidebarActions");
|
32
|
+
const SidebarMainLink_1 = __importDefault(require("./SidebarMainLink"));
|
33
|
+
const SidebarSubMenu_1 = __importDefault(require("./SidebarSubMenu"));
|
34
|
+
const SidebarConstants_1 = require("../constants/SidebarConstants");
|
35
|
+
const UtilityConstants_1 = require("../constants/UtilityConstants");
|
36
|
+
const Models_1 = require("../interfaces/Models");
|
37
|
+
// icon imports
|
38
|
+
const icomoon_library_json_1 = __importDefault(require("../resources/icomoon-library.json"));
|
39
|
+
const icomoon_react_1 = __importDefault(require("icomoon-react"));
|
40
|
+
const styles = require('../stylesheets/sidebar.scss');
|
41
|
+
// TODO - get proper icons
|
42
|
+
const SidebarMainLinks = [
|
43
|
+
{
|
44
|
+
id: SidebarConstants_1.SidebarMenuTypes.Home,
|
45
|
+
label: 'My Home',
|
46
|
+
icon: ((0, jsx_runtime_1.jsx)(icomoon_react_1.default, { iconSet: icomoon_library_json_1.default, icon: "home" }, void 0)),
|
47
|
+
onClick: () => console.log('My Home'),
|
48
|
+
subMenu: false,
|
49
|
+
},
|
50
|
+
{
|
51
|
+
id: SidebarConstants_1.SidebarMenuTypes.MyApps,
|
52
|
+
label: 'My Apps',
|
53
|
+
icon: ((0, jsx_runtime_1.jsx)(icomoon_react_1.default, { iconSet: icomoon_library_json_1.default, icon: "my-apps" }, void 0)),
|
54
|
+
onClick: () => console.log('My Apps'),
|
55
|
+
subMenu: false,
|
56
|
+
},
|
57
|
+
{
|
58
|
+
id: SidebarConstants_1.SidebarMenuTypes.Management,
|
59
|
+
label: 'Administration',
|
60
|
+
icon: ((0, jsx_runtime_1.jsx)(icomoon_react_1.default, { iconSet: icomoon_library_json_1.default, icon: "marketplace-administration" }, void 0)),
|
61
|
+
onClick: () => console.log('Management'),
|
62
|
+
subMenu: false,
|
63
|
+
},
|
64
|
+
{
|
65
|
+
id: SidebarConstants_1.SidebarMenuTypes.Marketplace,
|
66
|
+
label: 'Marketplace',
|
67
|
+
icon: ((0, jsx_runtime_1.jsx)(icomoon_react_1.default, { iconSet: icomoon_library_json_1.default, icon: "marketplace" }, void 0)),
|
68
|
+
onClick: () => console.log('Marketplace'),
|
69
|
+
subMenu: false,
|
70
|
+
},
|
71
|
+
{
|
72
|
+
id: SidebarConstants_1.SidebarMenuTypes.Collaboration,
|
73
|
+
label: 'Collaboration',
|
74
|
+
icon: ((0, jsx_runtime_1.jsx)(icomoon_react_1.default, { iconSet: icomoon_library_json_1.default, icon: "collboration" }, void 0)),
|
75
|
+
onClick: () => console.log('Collaboration'),
|
76
|
+
subMenu: false,
|
77
|
+
},
|
78
|
+
{
|
79
|
+
id: SidebarConstants_1.SidebarMenuTypes.Engagement,
|
80
|
+
label: 'Engagement',
|
81
|
+
icon: ((0, jsx_runtime_1.jsx)(icomoon_react_1.default, { iconSet: icomoon_library_json_1.default, icon: "engagement" }, void 0)),
|
82
|
+
onClick: () => console.log('Engagement'),
|
83
|
+
subMenu: false,
|
84
|
+
}
|
85
|
+
];
|
86
|
+
function Sidebar(props) {
|
87
|
+
const { appContext, topNavHeight, sidebarDisplayMode, sidebarOptions } = props;
|
88
|
+
const reduxDispatch = (0, react_redux_1.useDispatch)();
|
89
|
+
const expanded = (0, react_redux_1.useSelector)((state) => sidebarDisplayMode === UtilityConstants_1.SidebarDisplayModes.ALL ? true : state.sidebar.expanded);
|
90
|
+
const isMinimal = (0, react_redux_1.useSelector)((state) => state.sidebar.isMinimal);
|
91
|
+
const topNavToggleref = (0, react_redux_1.useSelector)((state) => state.sidebar.topnavToggleref);
|
92
|
+
const selectedOption = mapContextToAppsId();
|
93
|
+
function mapContextToAppsId() {
|
94
|
+
let selectedSidebarOption = SidebarConstants_1.SidebarMenuTypes.MyApps;
|
95
|
+
if (appContext === 'management') {
|
96
|
+
selectedSidebarOption = SidebarConstants_1.SidebarMenuTypes.Management;
|
97
|
+
}
|
98
|
+
else if (appContext === 'marketplace') {
|
99
|
+
selectedSidebarOption = SidebarConstants_1.SidebarMenuTypes.Marketplace;
|
100
|
+
}
|
101
|
+
else if (appContext === 'collaboration') {
|
102
|
+
selectedSidebarOption = SidebarConstants_1.SidebarMenuTypes.Collaboration;
|
103
|
+
}
|
104
|
+
else if (appContext === 'home') {
|
105
|
+
selectedSidebarOption = SidebarConstants_1.SidebarMenuTypes.Home;
|
106
|
+
}
|
107
|
+
return selectedSidebarOption;
|
108
|
+
}
|
109
|
+
// When component is loaded fetch the userInfo's available applications
|
110
|
+
(0, react_2.useEffect)(() => {
|
111
|
+
let selectedSidebarOption = mapContextToAppsId();
|
112
|
+
reduxDispatch((0, SidebarActions_1.SetMinimalSidebar)(sidebarDisplayMode === UtilityConstants_1.SidebarDisplayModes.MINIMAL));
|
113
|
+
reduxDispatch((0, SidebarActions_1.SetSelectedSidebarOption)(selectedSidebarOption));
|
114
|
+
}, [reduxDispatch, appContext]);
|
115
|
+
//when sidebar is loaded attach listener to detect clicks external to it
|
116
|
+
function useExternalClickListener(ref) {
|
117
|
+
(0, react_2.useEffect)(() => {
|
118
|
+
function handleClickOutside(event) {
|
119
|
+
let eventPath = event.composedPath();
|
120
|
+
if (ref.current && !(eventPath.includes(ref.current) || eventPath.includes(topNavToggleref.current)) && expanded === true) {
|
121
|
+
reduxDispatch((0, SidebarActions_1.SetExpandSidebar)(false));
|
122
|
+
}
|
123
|
+
}
|
124
|
+
// Bind the event listener
|
125
|
+
document.addEventListener("mousedown", handleClickOutside);
|
126
|
+
return () => {
|
127
|
+
// Unbind the event listener on clean up
|
128
|
+
document.removeEventListener("mousedown", handleClickOutside);
|
129
|
+
};
|
130
|
+
}, [ref, topNavToggleref, expanded]);
|
131
|
+
}
|
132
|
+
const [showForm, setShowForm] = (0, react_2.useState)(false);
|
133
|
+
const formDisplay = showForm ? (0, jsx_runtime_1.jsx)(SidebarForm_1.default, {}, void 0) : '';
|
134
|
+
function CheckManagementAndMarketplaceAccess() {
|
135
|
+
const apps = (0, react_redux_1.useSelector)((state) => { var _a; return ((_a = state.auth.userInfo) === null || _a === void 0 ? void 0 : _a.applications) || new Array(); });
|
136
|
+
const appCategories = apps.filter((e) => e.attributes !== undefined)
|
137
|
+
.filter((e) => e.attributes['category'] !== undefined)
|
138
|
+
.filter((d) => Object.keys(d.attributes).length > 0)
|
139
|
+
.map((app) => app.attributes['category'].toLowerCase());
|
140
|
+
const appCategoriesForSubApps = apps.filter((e) => e.attributes !== undefined)
|
141
|
+
.filter((e) => e.attributes['category'] !== undefined)
|
142
|
+
.map((app) => app.attributes['category'].toLowerCase());
|
143
|
+
let appCategorySubAppsCount = appCategoriesForSubApps.reduce((object, element) => {
|
144
|
+
object[element] = ++object[element] || 1;
|
145
|
+
return object;
|
146
|
+
}, {});
|
147
|
+
if (appCategorySubAppsCount['my_apps'] >= 1) {
|
148
|
+
const index = SidebarMainLinks.findIndex((e) => e.id === 'my_apps');
|
149
|
+
SidebarMainLinks[index].subMenu = true;
|
150
|
+
}
|
151
|
+
if (appCategorySubAppsCount['management'] >= 1) {
|
152
|
+
const index = SidebarMainLinks.findIndex((e) => e.id === 'management');
|
153
|
+
SidebarMainLinks[index].subMenu = true;
|
154
|
+
}
|
155
|
+
const isCollaboration = sidebarOptions.filter(option => option.category === Models_1.SidebarCategory.COLLABORATION);
|
156
|
+
if (appCategorySubAppsCount['engagement'] >= 1) {
|
157
|
+
const index = SidebarMainLinks.findIndex((e) => e.id === 'engagement');
|
158
|
+
SidebarMainLinks[index].subMenu = true;
|
159
|
+
}
|
160
|
+
if (appCategorySubAppsCount['collaboration'] >= 1 || isCollaboration.length) {
|
161
|
+
const index = SidebarMainLinks.findIndex((e) => e.id === 'collaboration');
|
162
|
+
SidebarMainLinks[index].subMenu = true;
|
163
|
+
}
|
164
|
+
const hasManagementAccess = appCategories.includes(Models_1.SidebarCategory.MANAGEMENT);
|
165
|
+
const hasMarketplaceAccess = appCategories.includes(Models_1.SidebarCategory.MARKETPLACE);
|
166
|
+
const hasHomeAccess = appCategories.includes(Models_1.SidebarCategory.MY_HOME);
|
167
|
+
const hasMyAppAccess = appCategories.includes(Models_1.SidebarCategory.MY_APPS);
|
168
|
+
const hasCollaborationAccess = appCategories.includes(Models_1.SidebarCategory.COLLABORATION) || sidebarOptions.map(option => option.category).includes(Models_1.SidebarCategory.COLLABORATION);
|
169
|
+
return SidebarMainLinks.filter(mainLinkProps => (mainLinkProps.id.toLowerCase() !== SidebarConstants_1.SidebarMenuTypes.Marketplace || hasMarketplaceAccess))
|
170
|
+
.filter(mainLinkProps => (mainLinkProps.id.toLowerCase() !== SidebarConstants_1.SidebarMenuTypes.Management || hasManagementAccess))
|
171
|
+
.filter(mainLinkProps => (mainLinkProps.id.toLowerCase() !== SidebarConstants_1.SidebarMenuTypes.Home || hasHomeAccess))
|
172
|
+
.filter(mainLinkProps => (mainLinkProps.id.toLowerCase() !== SidebarConstants_1.SidebarMenuTypes.MyApps || hasMyAppAccess))
|
173
|
+
.filter(mainLinkProps => (mainLinkProps.id.toLowerCase() !== SidebarConstants_1.SidebarMenuTypes.Collaboration || hasCollaborationAccess))
|
174
|
+
.map((mainLinkProps, index) => (0, react_1.createElement)(SidebarMainLink_1.default, Object.assign({ appContext: appContext }, mainLinkProps, { key: `lsac-sidebar-main-link-${index}`, selectedOption: selectedOption })));
|
175
|
+
}
|
176
|
+
const mainLinks = CheckManagementAndMarketplaceAccess();
|
177
|
+
const topNavHeightBuffer = {
|
178
|
+
top: topNavHeight
|
179
|
+
};
|
180
|
+
const sidebarRef = (0, react_2.useRef)(null);
|
181
|
+
useExternalClickListener(sidebarRef);
|
182
|
+
const handleMouseLeave = () => {
|
183
|
+
if (!isMinimal) {
|
184
|
+
reduxDispatch((0, SidebarActions_1.SetExpandSidebar)(false));
|
185
|
+
reduxDispatch((0, SidebarActions_1.SetMinimalSidebar)(true));
|
186
|
+
}
|
187
|
+
reduxDispatch((0, SidebarActions_1.SetSelectedSidebarOption)(selectedOption));
|
188
|
+
reduxDispatch((0, SidebarActions_1.SetShowExpandedApps)(false));
|
189
|
+
};
|
190
|
+
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: 'lsac-sidebar-container' }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ className: (0, classnames_1.default)('lsac-sidebar', { expanded, isMinimal }), style: topNavHeightBuffer, ref: sidebarRef, onMouseLeave: handleMouseLeave }, { children: [(0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'icon-strip' }, { children: mainLinks }), void 0), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: 'submenu' }, { children: (0, jsx_runtime_1.jsx)(SidebarSubMenu_1.default, {}, void 0) }), void 0)] }), void 0), formDisplay] }), void 0));
|
191
|
+
}
|
192
|
+
const MemoizedSidebar = react_2.default.memo(Sidebar);
|
193
|
+
exports.default = MemoizedSidebar;
|