@gooddata/sdk-ui-ext 10.19.0-alpha.2 → 10.19.0-alpha.21

package/esm/notificationsPanel/components/Popup.d.ts

@@ -0,0 +1,9 @@
+import React from "react";
+export declare function Popup({ children, popup, }: {
+    children: ({ toggle, id }: {
+        toggle: () => void;
+        id: string;
+    }) => React.ReactNode;
+    popup: React.ReactNode;
+}): React.JSX.Element;
+//# sourceMappingURL=Popup.d.ts.map

package/esm/notificationsPanel/components/Popup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Popup.d.ts","sourceRoot":"","sources":["../../../src/notificationsPanel/components/Popup.tsx"],"names":[],"mappings":"AACA,OAAO,KAAwC,MAAM,OAAO,CAAC;AAM7D,wBAAgB,KAAK,CAAC,EAClB,QAAQ,EACR,KAAK,GACR,EAAE;IACC,QAAQ,EAAE,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE;QAAE,MAAM,EAAE,MAAM,IAAI,CAAC;QAAC,EAAE,EAAE,MAAM,CAAA;KAAE,KAAK,KAAK,CAAC,SAAS,CAAC;IAClF,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC;CAC1B,qBAsBA"}

package/esm/notificationsPanel/components/Popup.js

@@ -0,0 +1,15 @@
+// (C) 2024-2025 GoodData Corporation
+import React, { useRef, useState, useCallback } from "react";
+import { Bubble } from "@gooddata/sdk-ui-kit";
+import { v4 as uuidv4 } from "uuid";
+const ALIGN_POINTS = [{ align: "bc tr" }, { align: "tc br" }];
+export function Popup({ children, popup, }) {
+    const [isOpen, setIsOpen] = useState(false);
+    const { current: id } = useRef(`popup-${uuidv4()}`);
+    const toggle = useCallback(() => setIsOpen((x) => !x), []);
+    const close = useCallback(() => setIsOpen(false), []);
+    return (React.createElement(React.Fragment, null,
+        children({ toggle, id }),
+        isOpen ? (React.createElement(Bubble, { alignPoints: ALIGN_POINTS, alignTo: `#${id}`, closeOnOutsideClick: true, closeOnParentScroll: true, onClose: close }, popup)) : null));
+}
+//# sourceMappingURL=Popup.js.map

package/esm/notificationsPanel/components/Popup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Popup.js","sourceRoot":"","sources":["../../../src/notificationsPanel/components/Popup.tsx"],"names":[],"mappings":"AAAA,qCAAqC;AACrC,OAAO,KAAK,EAAE,EAAE,MAAM,EAAE,QAAQ,EAAE,WAAW,EAAE,MAAM,OAAO,CAAC;AAC7D,OAAO,EAAE,MAAM,EAAE,MAAM,sBAAsB,CAAC;AAC9C,OAAO,EAAE,EAAE,IAAI,MAAM,EAAE,MAAM,MAAM,CAAC;AAEpC,MAAM,YAAY,GAAG,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,CAAC,CAAC;AAE9D,MAAM,UAAU,KAAK,CAAC,EAClB,QAAQ,EACR,KAAK,GAIR;IACG,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC5C,MAAM,EAAE,OAAO,EAAE,EAAE,EAAE,GAAG,MAAM,CAAC,SAAS,MAAM,EAAE,EAAE,CAAC,CAAC;IACpD,MAAM,MAAM,GAAG,WAAW,CAAC,GAAG,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;IAC3D,MAAM,KAAK,GAAG,WAAW,CAAC,GAAG,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE,EAAE,CAAC,CAAC;IAEtD,OAAO,CACH;QACK,QAAQ,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC;QACxB,MAAM,CAAC,CAAC,CAAC,CACN,oBAAC,MAAM,IACH,WAAW,EAAE,YAAY,EACzB,OAAO,EAAE,IAAI,EAAE,EAAE,EACjB,mBAAmB,QACnB,mBAAmB,QACnB,OAAO,EAAE,KAAK,IAEb,KAAK,CACD,CACZ,CAAC,CAAC,CAAC,IAAI,CACT,CACN,CAAC;AACN,CAAC"}

package/esm/notificationsPanel/data/useNotifications.d.ts

@@ -2,7 +2,7 @@ import { IAnalyticalBackend } from "@gooddata/sdk-backend-spi";
 /**
  * Hook for fetching all and unread notifications.
  *
- * @public
+ * @internal
  */
 export interface IUseNotificationsProps {
     /**
@@ -26,7 +26,7 @@ export interface IUseNotificationsProps {
     itemsPerPage: number;
 }
 /**
- * @public
+ * @internal
  */
 export declare function useNotifications({ workspace, refreshInterval, itemsPerPage }: IUseNotificationsProps): {
     notifications: import("@gooddata/sdk-model").INotification[];

package/esm/notificationsPanel/data/useNotifications.js

@@ -4,7 +4,7 @@ import { useCallback, useMemo, useState } from "react";
 import { useOrganization } from "../@staging/OrganizationContext/OrganizationContext.js";
 import { useFetchNotifications } from "./useFetchNotifications.js";
 /**
- * @public
+ * @internal
  */
 export function useNotifications({ workspace, refreshInterval, itemsPerPage }) {
     const effectiveWorkspace = useWorkspace(workspace);

package/esm/sdk-ui-ext.d.ts

@@ -1114,33 +1114,6 @@ export declare type ISizeInfoDefault = ISizeInfo & {
     default: number;
 };
 
-/**
- * Hook for fetching all and unread notifications.
- *
- * @public
- */
-export declare interface IUseNotificationsProps {
-    /**
-     * Workspace to fetch notifications from.
-     *
-     * - If not provided, the workspace from WorkspaceProvider is used.
-     * - If not provided and there is no WorkspaceProvider, notifications will be loaded from all workspaces.
-     */
-    workspace?: string;
-    /**
-     * Backend to fetch notifications from.
-     */
-    backend?: IAnalyticalBackend;
-    /**
-     * Refresh interval in milliseconds.
-     */
-    refreshInterval: number;
-    /**
-     * Number of items per page.
-     */
-    itemsPerPage: number;
-}
-
 /**
  * @internal
  */
@@ -1309,27 +1282,6 @@ export declare type TelemetryEvent = "multiple-users-deleted" | "multiple-groups
  */
 export declare type TrackEventCallback = (event: TelemetryEvent) => void;
 
-/**
- * @public
- */
-export declare function useNotifications({ workspace, refreshInterval, itemsPerPage }: IUseNotificationsProps): {
-    notifications: INotification[];
-    notificationsStatus: "error" | "loading" | "pending" | "success";
-    notificationsError: GoodDataSdkError;
-    notificationsHasNextPage: boolean;
-    notificationsLoadNextPage: () => void;
-    notificationsReset: () => void;
-    unreadNotifications: INotification[];
-    unreadNotificationsStatus: "error" | "loading" | "pending" | "success";
-    unreadNotificationsError: GoodDataSdkError;
-    unreadNotificationsHasNextPage: boolean;
-    unreadNotificationsLoadNextPage: () => void;
-    unreadNotificationsReset: () => void;
-    unreadNotificationsCount: number;
-    markNotificationAsRead: (notificationId: string) => Promise<void>;
-    markAllNotificationsAsRead: () => Promise<void>;
-};
-
 /**
  * @internal
  */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gooddata/sdk-ui-ext",
-  "version": "10.19.0-alpha.2",
+  "version": "10.19.0-alpha.21",
   "description": "GoodData.UI SDK - Extensions",
   "repository": {
     "type": "git",
@@ -55,19 +55,19 @@
     "ts-invariant": "^0.7.5",
     "tslib": "^2.5.0",
     "uuid": "^8.3.2",
-    "@gooddata/sdk-backend-base": "10.19.0-alpha.2",
-    "@gooddata/sdk-embedding": "10.19.0-alpha.2",
-    "@gooddata/sdk-backend-spi": "10.19.0-alpha.2",
-    "@gooddata/sdk-model": "10.19.0-alpha.2",
-    "@gooddata/sdk-ui": "10.19.0-alpha.2",
-    "@gooddata/sdk-ui-charts": "10.19.0-alpha.2",
-    "@gooddata/sdk-ui-filters": "10.19.0-alpha.2",
-    "@gooddata/sdk-ui-kit": "10.19.0-alpha.2",
-    "@gooddata/sdk-ui-geo": "10.19.0-alpha.2",
-    "@gooddata/sdk-ui-pivot": "10.19.0-alpha.2",
-    "@gooddata/sdk-ui-theme-provider": "10.19.0-alpha.2",
-    "@gooddata/sdk-ui-vis-commons": "10.19.0-alpha.2",
-    "@gooddata/util": "10.19.0-alpha.2"
+    "@gooddata/sdk-backend-base": "10.19.0-alpha.21",
+    "@gooddata/sdk-backend-spi": "10.19.0-alpha.21",
+    "@gooddata/sdk-embedding": "10.19.0-alpha.21",
+    "@gooddata/sdk-ui": "10.19.0-alpha.21",
+    "@gooddata/sdk-model": "10.19.0-alpha.21",
+    "@gooddata/sdk-ui-charts": "10.19.0-alpha.21",
+    "@gooddata/sdk-ui-filters": "10.19.0-alpha.21",
+    "@gooddata/sdk-ui-geo": "10.19.0-alpha.21",
+    "@gooddata/sdk-ui-pivot": "10.19.0-alpha.21",
+    "@gooddata/sdk-ui-kit": "10.19.0-alpha.21",
+    "@gooddata/sdk-ui-theme-provider": "10.19.0-alpha.21",
+    "@gooddata/util": "10.19.0-alpha.21",
+    "@gooddata/sdk-ui-vis-commons": "10.19.0-alpha.21"
   },
   "peerDependencies": {
     "react": "^16.10.0 || ^17.0.0 || ^18.0.0",
@@ -124,9 +124,9 @@
     "@types/json-stable-stringify": "^1.0.32",
     "@types/codemirror": "^5.60.7",
     "@types/js-yaml": "^4.0.9",
-    "@gooddata/i18n-toolkit": "10.19.0-alpha.2",
-    "@gooddata/reference-workspace": "10.19.0-alpha.2",
-    "@gooddata/sdk-backend-mockingbird": "10.19.0-alpha.2"
+    "@gooddata/i18n-toolkit": "10.19.0-alpha.21",
+    "@gooddata/reference-workspace": "10.19.0-alpha.21",
+    "@gooddata/sdk-backend-mockingbird": "10.19.0-alpha.21"
   },
   "scripts": {
     "clean": "rm -rf ci dist esm coverage *.log styles/css tsconfig.tsbuildinfo",

package/src/notificationsPanel/Notification/DefaultNotification.scss

@@ -1,4 +1,4 @@
-// (C) 2024 GoodData Corporation
+// (C) 2024-2025 GoodData Corporation
 
 .gd-ui-ext-notification {
     $root: &;
@@ -36,6 +36,10 @@
                 display: none;
             }
         }
+
+        #{$root}__unread-status {
+            border: 1.4px solid var(--gd-palette-complementary-2);
+        }
     }
 
     &__unsupported {
@@ -79,13 +83,12 @@
     &__details {
         display: flex;
         flex-direction: column;
-        justify-content: space-between;
+        justify-content: center;
         flex-shrink: 1;
 
         width: 100%;
         height: 100%;
-
-        overflow: hidden;
+        min-width: 0;
     }
 
     &__title {
@@ -130,5 +133,29 @@
         display: flex;
         flex-direction: row;
         align-items: center;
+        height: 16px;
+    }
+
+    &__error {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        gap: 5px;
+        height: 16px;
+        font-size: 12px;
+        font-weight: 400;
+        color: var(--gd-palette-error-base);
+        white-space: nowrap;
+        position: relative;
+    }
+
+    &__error-icon {
+        width: 12px;
+        height: 12px;
+    }
+
+    &__error-popup {
+        font-size: 12px;
+        line-height: 18px;
     }
 }

package/src/notificationsPanel/NotificationsPanel/DefaultNotificationsPanel.scss

@@ -8,6 +8,7 @@
     background-color: var(--gd-palette-complementary-0);
 
     box-shadow: 0 2px 10px 0 var(--gd-shadow-color);
+    border-radius: var(--gd-modal-borderRadius, 3px);
 
     display: flex;
     flex-direction: column;

package/src/notificationsPanel/NotificationsPanel/DefaultNotificationsPanelButton.scss

@@ -13,6 +13,7 @@
     }
 
     &__icon {
+        --gd-icon-fill-color: #fff;
         opacity: 0.8;
         display: flex;
         align-items: center;

package/src/notificationsPanel/notificationPanel.scss

@@ -1,4 +1,5 @@
 // (C) 2024-2025 GoodData Corporation
+@use "@gooddata/sdk-ui-kit/styles/scss/bubble.scss";
 @use "@gooddata/sdk-ui-kit/styles/scss/overlay.scss";
 @use "@gooddata/sdk-ui-kit/styles/scss/tabs.scss";
 @use "@gooddata/sdk-ui-kit/src/@ui/UiIcon/UiIcon.scss";