@camunda/camunda-composite-components 0.0.34-rc1 → 0.0.34
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/lib/esm/api/api.d.ts +2 -1
- package/lib/esm/api/api.js +7 -2
- package/lib/esm/api/endpoints.const.d.ts +8 -0
- package/lib/esm/api/endpoints.const.js +12 -0
- package/lib/esm/api/notifications.js +10 -2
- package/lib/esm/components/c3-navigation/c3-navigation-sidebar/c3-notification-sidebar.js +3 -2
- package/lib/esm/components/c3-navigation/c3-navigation.types.d.ts +3 -2
- package/lib/esm/components/c3-user-configuration/c3-user-configuration-provider.d.ts +9 -3
- package/lib/esm/icons/c3-icons.d.ts +1 -1
- package/lib/esm/icons/c3-icons.js +3 -3
- package/lib/esm/icons/c3-icons.types.d.ts +1 -0
- package/package.json +1 -1
package/lib/esm/api/api.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Stage } from "./endpoints.const";
|
|
1
|
+
import { Endpoints, Stage } from "./endpoints.const";
|
|
2
2
|
export declare class HttpError extends Error {
|
|
3
3
|
status: number;
|
|
4
4
|
constructor(message: string, status: number);
|
|
@@ -6,6 +6,7 @@ export declare class HttpError extends Error {
|
|
|
6
6
|
export interface RequestPayload {
|
|
7
7
|
base?: "notifications";
|
|
8
8
|
stage?: Stage;
|
|
9
|
+
endpoints?: Endpoints;
|
|
9
10
|
url: string;
|
|
10
11
|
method: "get" | "post" | "put" | "delete" | "patch";
|
|
11
12
|
headers?: {
|
package/lib/esm/api/api.js
CHANGED
|
@@ -31,10 +31,15 @@ export async function request(payload) {
|
|
|
31
31
|
}
|
|
32
32
|
const body = payload.body ? JSON.stringify(payload.body) : undefined;
|
|
33
33
|
let base;
|
|
34
|
-
if (payload.base
|
|
34
|
+
if (payload.base) {
|
|
35
35
|
switch (payload.base) {
|
|
36
36
|
case "notifications":
|
|
37
|
-
|
|
37
|
+
if (payload.endpoints?.notifications) {
|
|
38
|
+
base = payload.endpoints.notifications;
|
|
39
|
+
}
|
|
40
|
+
else if (payload.stage) {
|
|
41
|
+
base = getEndpoint(payload.stage, NOTIFICATIONS);
|
|
42
|
+
}
|
|
38
43
|
break;
|
|
39
44
|
}
|
|
40
45
|
}
|
|
@@ -4,6 +4,14 @@ export interface Endpoint {
|
|
|
4
4
|
int: string;
|
|
5
5
|
prod: string;
|
|
6
6
|
}
|
|
7
|
+
export interface Endpoints {
|
|
8
|
+
notifications?: string;
|
|
9
|
+
}
|
|
7
10
|
export declare const NOTIFICATIONS: Endpoint;
|
|
8
11
|
export declare type Stage = "dev" | "int" | "prod";
|
|
9
12
|
export declare function getEndpoint(stage: Stage, endpoint: Endpoint): string;
|
|
13
|
+
export declare function getEndpointByOptions(options: {
|
|
14
|
+
stage?: Stage;
|
|
15
|
+
endpoints?: Endpoints;
|
|
16
|
+
endpoint: Endpoint;
|
|
17
|
+
}): string;
|
|
@@ -16,3 +16,15 @@ export function getEndpoint(stage, endpoint) {
|
|
|
16
16
|
throw new Error(`Unknown stage: ${stage}`);
|
|
17
17
|
}
|
|
18
18
|
}
|
|
19
|
+
export function getEndpointByOptions(options) {
|
|
20
|
+
switch (options.endpoint.id) {
|
|
21
|
+
case "notifications":
|
|
22
|
+
if (options.endpoints?.notifications) {
|
|
23
|
+
return options.endpoints.notifications;
|
|
24
|
+
}
|
|
25
|
+
else if (options.stage) {
|
|
26
|
+
return getEndpoint(options.stage, options.endpoint);
|
|
27
|
+
}
|
|
28
|
+
}
|
|
29
|
+
throw new Error(`Missing stage or notifications endpoint`);
|
|
30
|
+
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { EventSourcePolyfill } from "event-source-polyfill";
|
|
2
2
|
import { request } from "./api";
|
|
3
|
-
import {
|
|
3
|
+
import { getEndpointByOptions, NOTIFICATIONS } from "./endpoints.const";
|
|
4
4
|
export class NotificationService {
|
|
5
5
|
static async getNotifications(options) {
|
|
6
6
|
let notifications = [];
|
|
@@ -9,6 +9,7 @@ export class NotificationService {
|
|
|
9
9
|
method: "get",
|
|
10
10
|
base: "notifications",
|
|
11
11
|
stage: options.stage,
|
|
12
|
+
endpoints: options.endpoints,
|
|
12
13
|
camundaAuth: {
|
|
13
14
|
token: options.userToken,
|
|
14
15
|
refreshTokenMethod: options.getNewUserToken,
|
|
@@ -27,6 +28,7 @@ export class NotificationService {
|
|
|
27
28
|
method: "post",
|
|
28
29
|
base: "notifications",
|
|
29
30
|
stage: options.stage,
|
|
31
|
+
endpoints: options.endpoints,
|
|
30
32
|
camundaAuth: {
|
|
31
33
|
token: options.userToken,
|
|
32
34
|
refreshTokenMethod: options.getNewUserToken,
|
|
@@ -49,6 +51,7 @@ export class NotificationService {
|
|
|
49
51
|
method: "patch",
|
|
50
52
|
base: "notifications",
|
|
51
53
|
stage: options.stage,
|
|
54
|
+
endpoints: options.endpoints,
|
|
52
55
|
camundaAuth: {
|
|
53
56
|
token: options.userToken,
|
|
54
57
|
refreshTokenMethod: options.getNewUserToken,
|
|
@@ -70,6 +73,7 @@ export class NotificationService {
|
|
|
70
73
|
method: "patch",
|
|
71
74
|
base: "notifications",
|
|
72
75
|
stage: options.stage,
|
|
76
|
+
endpoints: options.endpoints,
|
|
73
77
|
camundaAuth: {
|
|
74
78
|
token: options.userToken,
|
|
75
79
|
refreshTokenMethod: options.getNewUserToken,
|
|
@@ -87,7 +91,11 @@ export class NotificationService {
|
|
|
87
91
|
});
|
|
88
92
|
}
|
|
89
93
|
static notificationsStream(options, handler) {
|
|
90
|
-
const
|
|
94
|
+
const baseUrl = getEndpointByOptions({
|
|
95
|
+
...options,
|
|
96
|
+
endpoint: NOTIFICATIONS,
|
|
97
|
+
});
|
|
98
|
+
const source = new EventSourcePolyfill(`${baseUrl}/notifications/events`, {
|
|
91
99
|
headers: {
|
|
92
100
|
authorization: `Bearer ${options.userToken}`,
|
|
93
101
|
},
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { Button } from "@carbon/react";
|
|
1
|
+
import { Button, useTheme } from "@carbon/react";
|
|
2
2
|
import { Notification as NotificationIcon } from "@carbon/react/icons";
|
|
3
3
|
import React, { useContext, useEffect, useState } from "react";
|
|
4
4
|
import styled from "styled-components";
|
|
@@ -41,6 +41,7 @@ const EmptyStateDescription = styled(NotificationDescription) `
|
|
|
41
41
|
margin-top: 8px;
|
|
42
42
|
`;
|
|
43
43
|
export const C3NotificationSidebar = ({ sideBar }) => {
|
|
44
|
+
const { theme } = useTheme();
|
|
44
45
|
const { isOpen, onLinkClick } = sideBar;
|
|
45
46
|
const [isSidebarOpen, setIsSidebarOpen] = useState(isOpen);
|
|
46
47
|
const { notifications, markAsRead, dismiss, markAllAsRead, dismissAll, analytics, enabled, } = useContext(C3NotificationContext);
|
|
@@ -85,7 +86,7 @@ export const C3NotificationSidebar = ({ sideBar }) => {
|
|
|
85
86
|
ariaLabel: sideBar.ariaLabel || "Notification Sidebar",
|
|
86
87
|
isOpen: isSidebarOpen,
|
|
87
88
|
setIsOpen,
|
|
88
|
-
}, icon: hasUnreadNotifications ? (React.createElement(C3NotificationsUnreadIcon, { size: 20 })) : (React.createElement(NotificationIcon, { size: 20, label: "Notifications" })) },
|
|
89
|
+
}, icon: hasUnreadNotifications ? (React.createElement(C3NotificationsUnreadIcon, { size: 20, theme: theme })) : (React.createElement(NotificationIcon, { size: 20, label: "Notifications" })) },
|
|
89
90
|
React.createElement(PanelHeader, null,
|
|
90
91
|
React.createElement(PanelTitle, null, "Notifications"),
|
|
91
92
|
notifications.length > 0 && (
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { Tag } from "@carbon/react";
|
|
3
|
-
import { Stage } from "../../api/endpoints.const";
|
|
3
|
+
import { Endpoints, Stage } from "../../api/endpoints.const";
|
|
4
4
|
import { C3NavigationAppBarProps, C3NavigationInfoSideBarProps, C3NavigationNotificationsSideBarProps, C3NavigationOrgSideBarProps, C3NavigationUserSideBarProps } from "./c3-navigation-sidebar/c3-navigation-sidebar.types";
|
|
5
5
|
export interface C3NavigationAppProps {
|
|
6
6
|
prefix: string;
|
|
@@ -41,7 +41,8 @@ export interface C3NavigationNavBarProps {
|
|
|
41
41
|
orgName?: string;
|
|
42
42
|
}
|
|
43
43
|
export interface C3NotificationsProps {
|
|
44
|
-
stage
|
|
44
|
+
stage?: Stage;
|
|
45
|
+
endpoints?: Endpoints;
|
|
45
46
|
activeOrganizationId: string;
|
|
46
47
|
userToken: string;
|
|
47
48
|
getNewUserToken: () => Promise<string>;
|
|
@@ -1,11 +1,17 @@
|
|
|
1
1
|
import React, { FC, ReactNode } from "react";
|
|
2
|
-
import { Stage } from "../../api/endpoints.const";
|
|
3
|
-
|
|
4
|
-
stage: Stage;
|
|
2
|
+
import { Endpoints, Stage } from "../../api/endpoints.const";
|
|
3
|
+
declare type C3UserConfigurationBase = {
|
|
5
4
|
activeOrganizationId: string;
|
|
6
5
|
userToken: string;
|
|
7
6
|
getNewUserToken: () => Promise<string>;
|
|
8
7
|
};
|
|
8
|
+
declare type C3UserConfigurationWithEndpoints = C3UserConfigurationBase & {
|
|
9
|
+
endpoints: Endpoints;
|
|
10
|
+
};
|
|
11
|
+
declare type C3UserConfigurationWithStage = C3UserConfigurationBase & {
|
|
12
|
+
stage: Stage;
|
|
13
|
+
};
|
|
14
|
+
export declare type C3UserConfiguration = C3UserConfigurationWithEndpoints | C3UserConfigurationWithStage;
|
|
9
15
|
export declare const C3UserConfigurationContext: React.Context<C3UserConfiguration | null>;
|
|
10
16
|
declare const C3UserConfigurationProvider: FC<C3UserConfiguration & {
|
|
11
17
|
children?: ReactNode;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
import { C3IconProps } from "./c3-icons.types";
|
|
3
3
|
export declare const C3AppMenuIcon: ({ size }: C3IconProps) => JSX.Element;
|
|
4
|
-
export declare const C3NotificationsUnreadIcon: ({ size }: C3IconProps) => JSX.Element;
|
|
4
|
+
export declare const C3NotificationsUnreadIcon: ({ size, theme, }: C3IconProps) => JSX.Element;
|
|
5
5
|
export declare const C3BellIcon: ({ size }: C3IconProps) => JSX.Element;
|
|
@@ -2,8 +2,8 @@ import React from "react";
|
|
|
2
2
|
export const C3AppMenuIcon = ({ size }) => (React.createElement("svg", { width: size, height: size, viewBox: `0 0 ${size} ${size}`, fill: "transparent", xmlns: "http://www.w3.org/2000/svg" },
|
|
3
3
|
React.createElement("path", { fill: "transparent", style: { mixBlendMode: "multiply" }, d: "M0 0h20v20H0z" }),
|
|
4
4
|
React.createElement("path", { d: "M11.5 1h-3v3h3V1ZM4 1H1v3h3V1Zm15 0h-3v3h3V1Zm-7.5 7.5h-3v3h3v-3ZM4 8.5H1v3h3v-3Zm15 0h-3v3h3v-3ZM11.5 16h-3v3h3v-3ZM4 16H1v3h3v-3Zm15 0h-3v3h3v-3Z" })));
|
|
5
|
-
export const C3NotificationsUnreadIcon = ({ size }) => (React.createElement("svg", { width: size, height: size, viewBox: `0 0 ${size} ${size}`, fill: "
|
|
6
|
-
React.createElement("path", {
|
|
7
|
-
React.createElement("path", {
|
|
5
|
+
export const C3NotificationsUnreadIcon = ({ size, theme = "g10", }) => (React.createElement("svg", { width: size, height: size, viewBox: `0 0 ${size} ${size}`, fill: "none", xmlns: "http://www.w3.org/2000/svg" },
|
|
6
|
+
React.createElement("path", { fillRule: "evenodd", clipRule: "evenodd", d: "M10.625.857V.625h-1.25v1.282A6.258 6.258 0 0 0 3.75 8.125v2.241l-1.692 1.692a.625.625 0 0 0-.183.442v1.875A.625.625 0 0 0 2.5 15h4.375v.486a3.22 3.22 0 0 0 2.813 3.249 3.129 3.129 0 0 0 3.437-3.11V15H17.5a.624.624 0 0 0 .625-.625V12.5a.625.625 0 0 0-.183-.442l-.939-.939a6.174 6.174 0 0 1-1.46.308l1.332 1.332v.991H3.125v-.991l1.692-1.692A.625.625 0 0 0 5 10.625v-2.5a5 5 0 0 1 4.148-4.927A6.202 6.202 0 0 1 10.625.857Zm5.625 9.235V8.125a6.258 6.258 0 0 0-5.044-6.131 5.003 5.003 0 0 0-.743 1.152A5 5 0 0 1 15 8.125v2.125c.432 0 .85-.055 1.25-.158Zm-4.924 6.859c.351-.352.549-.829.549-1.326V15h-3.75v.625a1.875 1.875 0 0 0 3.2 1.326Z", fill: "$icon-primary" }),
|
|
7
|
+
React.createElement("path", { d: "M15 10.25a5 5 0 1 0 0-10 5 5 0 0 0 0 10Z", fill: theme === "g10" ? "#0F62FE" : "#78A9FF" })));
|
|
8
8
|
export const C3BellIcon = ({ size }) => (React.createElement("svg", { width: size, height: size, viewBox: `0 0 ${size} ${size}`, fill: "transparent", xmlns: "http://www.w3.org/2000/svg" },
|
|
9
9
|
React.createElement("path", { d: "M50.2373 33.7627L45.5 29.0253V22.75C45.4944 18.4134 43.881 14.2329 40.9718 11.0169C38.0626 7.80093 34.0643 5.77786 29.75 5.3389V1.75H26.25V5.3389C21.9357 5.77786 17.9374 7.80093 15.0282 11.0169C12.119 14.2329 10.5056 18.4134 10.5 22.75V29.0253L5.76275 33.7627C5.60018 33.9252 5.47122 34.118 5.38324 34.3303C5.29526 34.5426 5.24998 34.7702 5.25 35V40.25C5.25 40.7141 5.43437 41.1592 5.76256 41.4874C6.09075 41.8156 6.53587 42 7 42H19.25V43.75C19.25 46.0706 20.1719 48.2962 21.8128 49.9372C23.4538 51.5781 25.6794 52.5 28 52.5C30.3206 52.5 32.5462 51.5781 34.1872 49.9372C35.8281 48.2962 36.75 46.0706 36.75 43.75V42H49C49.4641 42 49.9092 41.8156 50.2374 41.4874C50.5656 41.1592 50.75 40.7141 50.75 40.25V35C50.75 34.7702 50.7047 34.5426 50.6168 34.3303C50.5288 34.118 50.3998 33.9252 50.2373 33.7627ZM33.25 43.75C33.25 45.1424 32.6969 46.4777 31.7123 47.4623C30.7277 48.4469 29.3924 49 28 49C26.6076 49 25.2723 48.4469 24.2877 47.4623C23.3031 46.4777 22.75 45.1424 22.75 43.75V42H33.25V43.75Z", fill: "#FF8201" })));
|