@jupytergis/base 0.6.0 → 0.6.1

package/lib/shared/components/Badge.d.ts

@@ -3,5 +3,5 @@ interface IBadgeProps extends React.HTMLAttributes<HTMLButtonElement> {
     variant?: 'destructive' | 'outline' | 'secondary';
     size?: 'sm' | 'lg' | 'icon';
 }
-declare function Badge({ variant, ...props }: IBadgeProps): React.JSX.Element;
+declare function Badge({ variant, className, ...props }: IBadgeProps): React.JSX.Element;
 export default Badge;

package/lib/shared/components/Badge.js

@@ -10,10 +10,11 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import * as React from 'react';
+import { cn } from './utils';
 function Badge(_a) {
-    var { variant } = _a, props = __rest(_a, ["variant"]);
+    var { variant, className } = _a, props = __rest(_a, ["variant", "className"]);
     return (
     // @ts-expect-error lol
-    React.createElement("div", Object.assign({ "data-variant": variant, className: 'jgis-badge' }, props)));
+    React.createElement("div", Object.assign({ "data-variant": variant, className: cn('jgis-badge', className) }, props)));
 }
 export default Badge;

package/lib/shared/components/Button.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 interface IButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
     asChild?: boolean;
     variant?: 'destructive' | 'outline' | 'secondary' | 'ghost' | 'link' | 'icon';
-    size?: 'sm' | 'lg' | 'icon';
+    size?: 'sm' | 'lg' | 'icon' | 'icon-sm';
 }
 declare const Button: React.ForwardRefExoticComponent<IButtonProps & React.RefAttributes<HTMLButtonElement>>;
 export { Button };

package/lib/shared/components/Button.js

@@ -11,10 +11,11 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import { Slot } from '@radix-ui/react-slot';
 import * as React from 'react';
+import { cn } from './utils';
 const Button = React.forwardRef((_a, ref) => {
     var { variant, className, size, asChild = false } = _a, props = __rest(_a, ["variant", "className", "size", "asChild"]);
     const Comp = asChild ? Slot : 'button';
-    return (React.createElement(Comp, Object.assign({ "data-size": size, "data-variant": variant, className: `jgis-button ${className ? className : ''}`, ref: ref }, props)));
+    return (React.createElement(Comp, Object.assign({ "data-size": size, "data-variant": variant, className: cn('jgis-button', className), ref: ref }, props)));
 });
 Button.displayName = 'Button';
 export { Button };

package/lib/stacBrowser/components/StacFilterSection.js

@@ -1,6 +1,9 @@
+import { faXmark } from '@fortawesome/free-solid-svg-icons';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { ChevronRight } from 'lucide-react';
 import React, { useMemo } from 'react';
 import Badge from "../../shared/components/Badge";
+import { Button } from "../../shared/components/Button";
 import { DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, } from "../../shared/components/DropdownMenu";
 const StacFilterSection = ({ section, data, selectedCollections, selectedData, handleCheckedChange, }) => {
     const items = useMemo(() => {
@@ -38,12 +41,19 @@ const StacFilterSection = ({ section, data, selectedCollections, selectedData, h
                     } }, product.productCode))))))));
         }
     }, [section, data, selectedCollections, selectedData, handleCheckedChange]);
+    const isTriggerDisabled = (section === 'Platform' || section === 'Data / Product') &&
+        selectedCollections.length === 0;
     return (React.createElement("div", { className: "jgis-stac-filter-section-container" },
         React.createElement(DropdownMenu, { modal: false },
-            React.createElement(DropdownMenuTrigger, { className: "jgis-stac-filter-trigger" },
+            React.createElement(DropdownMenuTrigger, { className: "jgis-stac-filter-trigger", disabled: isTriggerDisabled },
                 section,
                 React.createElement(ChevronRight, { className: "DropdownMenuIcon" })),
             React.createElement(DropdownMenuContent, { side: "right" }, items)),
-        React.createElement("div", { className: "jgis-stac-filter-section-badges" }, selectedData.map(data => (React.createElement(Badge, { key: data }, data))))));
+        React.createElement("div", { className: "jgis-stac-filter-section-badges" }, selectedData.map(data => (React.createElement(Badge, { key: data, className: "jgis-stac-badge" },
+            React.createElement("span", null, data),
+            React.createElement(Button, { variant: "icon", size: "icon-sm", className: "jgis-stac-badge-icon", onClick: () => {
+                    handleCheckedChange(data, '');
+                } },
+                React.createElement(FontAwesomeIcon, { icon: faXmark }))))))));
 };
 export default StacFilterSection;

package/lib/stacBrowser/components/StacPanelFilters.js

@@ -6,7 +6,7 @@ import { Calendar } from "../../shared/components/Calendar";
 import Checkbox from "../../shared/components/Checkbox";
 import { Popover, PopoverContent, PopoverTrigger, } from "../../shared/components/Popover";
 import StacFilterSection from "./StacFilterSection";
-import { datasets as datasetsList, platforms, products, } from "../constants";
+import { datasets as datasetsList, platforms as platformsList, products as productsList, } from "../constants";
 const StacPanelFilters = ({ filterState, filterSetters, startTime, setStartTime, endTime, setEndTime, useWorldBBox, setUseWorldBBox, }) => {
     const handleDatasetSelection = (dataset, collection) => {
         const collections = new Set(filterState.collections);
@@ -19,6 +19,22 @@ const StacPanelFilters = ({ filterState, filterSetters, startTime, setStartTime,
             });
             if (datasetsForCollection.length === 0) {
                 collections.delete(collection);
+                const platforms = new Set(filterState.platforms);
+                const products = new Set(filterState.products);
+                // Remove platforms belonging to this collection
+                if (platformsList[collection]) {
+                    platformsList[collection].forEach(platform => {
+                        platforms.delete(platform);
+                    });
+                }
+                // Remove products belonging to this collection
+                productsList
+                    .filter(product => product.collections.includes(collection))
+                    .forEach(product => {
+                    products.delete(product.productCode);
+                });
+                filterSetters.platforms(platforms);
+                filterSetters.products(products);
             }
         }
         else {
@@ -59,7 +75,7 @@ const StacPanelFilters = ({ filterState, filterSetters, startTime, setStartTime,
                 React.createElement(PopoverContent, null,
                     React.createElement(Calendar, { mode: "single", selected: endTime, onSelect: setEndTime, autoFocus: true })))),
         React.createElement(StacFilterSection, { section: "Collection", data: datasetsList, selectedCollections: Array.from(filterState.collections), selectedData: Array.from(filterState.datasets), handleCheckedChange: handleDatasetSelection }),
-        React.createElement(StacFilterSection, { section: "Platform", data: platforms, selectedCollections: Array.from(filterState.collections), selectedData: Array.from(filterState.platforms), handleCheckedChange: platform => handleToggle('platforms', platform) }),
-        React.createElement(StacFilterSection, { section: "Data / Product", data: products, selectedCollections: Array.from(filterState.collections), selectedData: Array.from(filterState.products), handleCheckedChange: product => handleToggle('products', product) })));
+        React.createElement(StacFilterSection, { section: "Platform", data: platformsList, selectedCollections: Array.from(filterState.collections), selectedData: Array.from(filterState.platforms), handleCheckedChange: platform => handleToggle('platforms', platform) }),
+        React.createElement(StacFilterSection, { section: "Data / Product", data: productsList, selectedCollections: Array.from(filterState.collections), selectedData: Array.from(filterState.products), handleCheckedChange: product => handleToggle('products', product) })));
 };
 export default StacPanelFilters;

package/lib/toolbar/widget.d.ts

@@ -11,6 +11,7 @@ export declare class Separator extends Widget {
     constructor();
 }
 export declare class ToolbarWidget extends ReactiveToolbar {
+    private _model;
     constructor(options: ToolbarWidget.IOptions);
 }
 export declare namespace ToolbarWidget {

package/lib/toolbar/widget.js

@@ -1,4 +1,4 @@
-import { UsersItem } from '@jupyter/collaboration';
+import { UsersItem, DefaultIconRenderer } from '@jupyter/collaboration';
 import { CommandToolbarButton } from '@jupyterlab/apputils';
 import { MenuSvg, ReactWidget, ReactiveToolbar, ToolbarButton, addIcon, redoIcon, undoIcon, } from '@jupyterlab/ui-components';
 import { Widget } from '@lumino/widgets';
@@ -17,9 +17,29 @@ export class Separator extends Widget {
         this.addClass(TOOLBAR_SEPARATOR_CLASS);
     }
 }
+function createUserIconRenderer(model) {
+    let selectedUserId;
+    return (props) => {
+        const { user } = props;
+        const isSelected = user.userId === selectedUserId;
+        const className = isSelected ? 'selected' : '';
+        const onClick = () => {
+            if (user.userId === selectedUserId) {
+                selectedUserId = undefined;
+                model.setUserToFollow(undefined);
+            }
+            else {
+                selectedUserId = user.userId;
+                model.setUserToFollow(user.userId);
+            }
+        };
+        return (React.createElement(DefaultIconRenderer, { user: user, onClick: onClick, className: className }));
+    };
+}
 export class ToolbarWidget extends ReactiveToolbar {
     constructor(options) {
         super();
+        this._model = options.model;
         this.addClass('jGIS-toolbar-widget');
         if (options.commands) {
             const undoButton = new CommandToolbarButton({
@@ -102,7 +122,8 @@ export class ToolbarWidget extends ReactiveToolbar {
                 'temporal-controller-button';
             this.addItem('spacer', ReactiveToolbar.createSpacerItem());
             // Users
-            this.addItem('users', ReactWidget.create(React.createElement(UsersItem, { model: options.model })));
+            const iconRenderer = createUserIconRenderer(this._model);
+            this.addItem('users', ReactWidget.create(React.createElement(UsersItem, { model: this._model, iconRenderer: iconRenderer })));
         }
     }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jupytergis/base",
-  "version": "0.6.0",
+  "version": "0.6.1",
   "description": "A JupyterLab extension for 3D modelling.",
   "keywords": [
     "jupyter",
@@ -44,7 +44,7 @@
     "@jupyter/collaboration": "^3.1.0",
     "@jupyter/react-components": "^0.16.6",
     "@jupyter/ydoc": "^2.0.0 || ^3.0.0",
-    "@jupytergis/schema": "^0.6.0",
+    "@jupytergis/schema": "^0.6.1",
     "@jupyterlab/application": "^4.3.0",
     "@jupyterlab/apputils": "^4.3.0",
     "@jupyterlab/completer": "^4.3.0",

package/style/shared/button.css

@@ -162,3 +162,8 @@
   height: 2.5rem;
   width: 2.5rem;
 }
+
+.jgis-button[data-size='icon-sm'] {
+  height: 1rem;
+  width: 1rem;
+}

package/style/stacBrowser.css

@@ -56,6 +56,10 @@
   gap: 0.15rem;
 }
 
+.jgis-stac-filter-trigger:disabled {
+  cursor: not-allowed;
+}
+
 .jgis-stac-filter-section-container {
   display: flex;
   flex-direction: column;
@@ -72,3 +76,16 @@
   width: 1rem;
   height: 1rem;
 }
+
+.jgis-stac-badge {
+  gap: 0.25rem;
+  padding-right: 0.3rem !important;
+}
+
+.jgis-stac-badge-icon:hover {
+  background-color: color-mix(
+    in srgb,
+    var(--jp-error-color0),
+    transparent 20%
+  ) !important;
+}