Skip to content

adds icechunk catalog #670

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
lazarusA merged 7 commits into from
Jun 21, 2026
Merged

adds icechunk catalog #670

Show file tree
Hide file tree
Changes from 5 commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
25a7982
mv catalog to zarr fetch store in modal
lazarusA Jun 21, 2026
85c098a
wire-in catalogs
lazarusA Jun 21, 2026
340c7d9
search colors
lazarusA Jun 21, 2026
5978f12
search
lazarusA Jun 21, 2026
46cfaa4
descriptions
lazarusA Jun 21, 2026
77161ca
states, redundancy
lazarusA Jun 21, 2026
a3f2451
minimal keyboard arrows functionality
lazarusA Jun 21, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
103 changes: 0 additions & 103 deletions src/components/ui/MainPanel/CuratedDatasets.tsx
View file
Open in desktop

This file was deleted.

119 changes: 83 additions & 36 deletions src/components/ui/MainPanel/DataSetsModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,27 +5,33 @@ import { useShallow } from 'zustand/shallow';
import {
Dialog,
DialogContent,
DialogHeader,
DialogDescription,
DialogTitle,
} from "@/components/ui/dialog";
import {
ButtonGroup,
} from "@/components/ui/button-group";
import { ButtonGroup } from "@/components/ui/button-group";
import { Button } from "@/components/ui/button-enhanced";
import { DescriptionContent } from './DescriptionContent';
import CuratedDatasets from './CuratedDatasets';
import StoreCatalog from './StoreCatalog';
import { ZARR_CATALOG, ICECHUNK_CATALOG } from "@/assets/index";
import RemoteZarr from './RemoteZarr';
import LocalContent from './LocalContent';
import RemoteIcechunk from './RemoteIcechunk';

type Tab = 'curated' | 'remote' | 'local' | 'icechunk';
type Tab = 'remote' | 'local' | 'icechunk';

const TABS: { value: Tab; label: string }[] = [
{ value: 'curated', label: 'Curated' },
{ value: 'remote', label: 'Remote Zarr' },
{ value: 'icechunk', label: 'Icechunk' },
{ value: 'local', label: 'Local' },
{ value: 'remote', label: 'Remote Zarr' },
{ value: 'icechunk', label: 'Icechunk' },
{ value: 'local', label: 'Local' },
];

const TAB_DESCRIPTIONS: Record<Tab, string> = {
remote: 'Browse and open remote Zarr stores via URL or from the catalog.',
icechunk: 'Connect to versioned Icechunk stores for transactional data access.',
local: 'Open a Zarr dataset stored on your local filesystem.',
};

type Props = {
open: boolean;
onOpenChange: (v: boolean) => void;
Expand All @@ -34,8 +40,10 @@ type Props = {

const DatasetsModal = ({ open, onOpenChange, isSafari }: Props) => {
const [activeOption, setActiveOption] = useState<string>('');
const [selectedUrl, setSelectedUrl] = useState<string>('');
const [selectedIcechunkUrl, setSelectedIcechunkUrl] = useState<string>('');
const [hasFetched, setHasFetched] = useState(false);
const [activeTab, setActiveTab] = useState<Tab>('curated');
const [activeTab, setActiveTab] = useState<Tab>('remote');

const { initStore, setInitStore, setOpenVariables, status } = useGlobalStore(
useShallow(state => ({
Expand All @@ -47,25 +55,46 @@ const DatasetsModal = ({ open, onOpenChange, isSafari }: Props) => {
);

const showDescription = hasFetched && status === null;

const openDescription = () => setHasFetched(true);

const handleTabChange = (tab: Tab) => {
setActiveTab(tab);
setHasFetched(false);
setSelectedUrl('');
setSelectedIcechunkUrl('');
setActiveOption('');
};

const handleOpenChange = (v: boolean) => {
if (!v) {
setSelectedUrl('');
setSelectedIcechunkUrl('');
setActiveOption('');
setHasFetched(false);
}
onOpenChange(v);
};

return (
<Dialog open={open} onOpenChange={onOpenChange}>
<Dialog open={open} onOpenChange={handleOpenChange}>
<DialogContent className="max-w-md max-h-[80vh] overflow-y-auto p-0">
<DialogTitle className="sr-only">Open Dataset</DialogTitle>
<DialogHeader className="sr-only">
<DialogTitle>Open dataset</DialogTitle>
<DialogDescription>{TAB_DESCRIPTIONS[activeTab]}</DialogDescription>
</DialogHeader>

{/* Header */}
<div className="px-4 pt-4 pb-3 border-b border-border">
<p className="text-xs font-medium mb-2 uppercase tracking-wide">
Open dataset
</p>
<ButtonGroup className="justify-between border-1 rounded-md">
{!showDescription && (
<>
<p className="text-xs font-medium mb-2 uppercase tracking-wide text-muted-foreground">
Open dataset
</p>
<p className="text-xs text-muted-foreground mb-2">
{TAB_DESCRIPTIONS[activeTab]}
</p>
</>
)}
<ButtonGroup className="justify-between border rounded-md">
{TABS.map(({ value, label }) => (
<Button
key={value}
Expand All @@ -81,21 +110,26 @@ const DatasetsModal = ({ open, onOpenChange, isSafari }: Props) => {
</ButtonGroup>
</div>

<div className="p-4 flex flex-col gap-1 -mt-3">
{activeTab === 'curated' && (
<CuratedDatasets
activeOption={activeOption}
setActiveOption={setActiveOption}
setInitStore={setInitStore}
onOpenDescription={openDescription}
/>
)}
<div className="p-4 flex flex-col gap-1 -mt-4">
{activeTab === 'remote' && (
<RemoteZarr
initStore={initStore}
setInitStore={setInitStore}
onOpenDescription={openDescription}
/>
<>
<StoreCatalog
catalog={ZARR_CATALOG}
placeholder="Search Zarr Stores..."
gradient="zarr"
activeOption={activeOption}
setActiveOption={setActiveOption}
setInitStore={setSelectedUrl}
onOpenDescription={() => {}}
/>
<RemoteZarr
key={selectedUrl}
initStore={initStore}
setInitStore={setInitStore}
onOpenDescription={openDescription}
selectedUrl={selectedUrl}
/>
</>
)}
{activeTab === 'local' && (
<LocalContent
Expand All @@ -105,10 +139,23 @@ const DatasetsModal = ({ open, onOpenChange, isSafari }: Props) => {
/>
)}
{activeTab === 'icechunk' && (
<RemoteIcechunk
setInitStore={setInitStore}
onOpenDescription={openDescription}
/>
<>
<StoreCatalog
catalog={ICECHUNK_CATALOG}
placeholder="Search Icechunk Stores..."
gradient="icechunk"
activeOption={activeOption}
setActiveOption={setActiveOption}
setInitStore={setSelectedIcechunkUrl}
onOpenDescription={() => {}}
/>
<RemoteIcechunk
key={selectedIcechunkUrl}
setInitStore={setInitStore}
onOpenDescription={openDescription}
selectedUrl={selectedIcechunkUrl}
/>
</>
)}
{showDescription && (
<DescriptionContent
Expand Down
7 changes: 4 additions & 3 deletions src/components/ui/MainPanel/RemoteIcechunk.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -93,10 +93,11 @@ const HeaderRows = ({ rows, set }: HeaderRowsProps) => {
type Props = {
setInitStore: (v: string) => void;
onOpenDescription: () => void;
selectedUrl?: string
};

const RemoteIcechunk = ({ setInitStore, onOpenDescription }: Props) => {
const [url, setUrl] = useState('');
const RemoteIcechunk = ({ setInitStore, onOpenDescription, selectedUrl = '' }: Props) => {
const [url, setUrl] = useState(selectedUrl);

const [showSettings, setShowSettings] = useState(false);

Expand Down Expand Up @@ -155,7 +156,7 @@ const RemoteIcechunk = ({ setInitStore, onOpenDescription }: Props) => {
<div className="flex flex-col gap-3">

{/* URL + Fetch */}
<div className="flex items-center gap-2">
<div className="flex items-center gap-2 mt-2">
<Input
className="w-full"
placeholder="Store URL"
Expand Down
Loading
Loading