Release v0.1.4

This commit is contained in:
2026-07-02 14:59:52 +02:00
parent a7895ad394
commit 98dee06d54
18 changed files with 1953 additions and 139 deletions

View File

@@ -1,6 +1,6 @@
{
"name": "@govoplan/files-webui",
"version": "0.1.1",
"version": "0.1.4",
"private": true,
"type": "module",
"main": "webui/src/index.ts",
@@ -19,7 +19,7 @@
"LICENSE"
],
"peerDependencies": {
"@govoplan/core-webui": "^0.1.1",
"@govoplan/core-webui": "^0.1.4",
"lucide-react": "^0.555.0",
"react": "^19.0.0",
"react-dom": "^19.0.0",

View File

@@ -4,14 +4,14 @@ build-backend = "setuptools.build_meta"
[project]
name = "govoplan-files"
version = "0.1.3"
version = "0.1.4"
description = "GovOPlaN files module with backend and WebUI integration."
readme = "README.md"
requires-python = ">=3.12"
license = { file = "LICENSE" }
authors = [{ name = "GovOPlaN" }]
dependencies = [
"govoplan-core>=0.1.3",
"govoplan-core>=0.1.4",
]
[tool.setuptools.packages.find]

View File

@@ -66,7 +66,7 @@ def _files_router(context: ModuleContext):
manifest = ModuleManifest(
id="files",
name="Files",
version="0.1.2",
version="0.1.4",
dependencies=("access",),
optional_dependencies=(),
permissions=PERMISSIONS,

View File

@@ -44,7 +44,7 @@ from govoplan_files.backend.schemas import (
_conflict_resolutions,
)
from govoplan_core.db.models import Group, UserGroupMembership
from govoplan_files.backend.db.models import FileAsset, FileFolder, FileShare
from govoplan_files.backend.db.models import CampaignAttachmentUse, FileAsset, FileBlob, FileFolder, FileShare, FileVersion
from govoplan_core.db.session import get_session
from govoplan_files.backend.runtime import settings
from govoplan_files.backend.storage.paths import UnsafeFilePathError, filename_from_path, normalize_logical_path
@@ -195,6 +195,92 @@ def _asset_response(session: Session, asset: FileAsset, *, include_shares: bool
)
def _asset_list_response(session: Session, assets: list[FileAsset], *, include_shares: bool = False) -> list[FileAssetResponse]:
if not assets:
return []
asset_ids = [asset.id for asset in assets]
version_ids = [asset.current_version_id for asset in assets if asset.current_version_id]
if len(version_ids) != len(assets):
raise FileStorageError("File has no current version")
version_blob_rows: list[tuple[FileVersion, FileBlob]] = []
for chunk in _chunks(version_ids):
version_blob_rows.extend(
session.query(FileVersion, FileBlob)
.join(FileBlob, FileBlob.id == FileVersion.blob_id)
.filter(FileVersion.id.in_(chunk))
.all()
)
versions_by_id = {version.id: version for version, _blob in version_blob_rows}
blobs_by_version_id = {version.id: blob for version, blob in version_blob_rows}
shares_by_asset_id: dict[str, list[FileShareResponse]] = {asset_id: [] for asset_id in asset_ids}
if include_shares:
for chunk in _chunks(asset_ids):
share_rows = (
session.query(FileShare)
.filter(FileShare.file_asset_id.in_(chunk))
.order_by(FileShare.created_at.desc())
.all()
)
for row in share_rows:
shares_by_asset_id.setdefault(row.file_asset_id, []).append(
FileShareResponse(
id=row.id,
target_type=row.target_type,
target_id=row.target_id,
permission=row.permission,
created_at=row.created_at.isoformat(),
revoked_at=row.revoked_at.isoformat() if row.revoked_at else None,
)
)
sent_asset_ids: set[str] = set()
for chunk in _chunks(asset_ids):
sent_rows = (
session.query(CampaignAttachmentUse.file_asset_id)
.filter(CampaignAttachmentUse.file_asset_id.in_(chunk), CampaignAttachmentUse.use_stage == "sent")
.distinct()
.all()
)
sent_asset_ids.update(row[0] for row in sent_rows)
responses: list[FileAssetResponse] = []
for asset in assets:
version = versions_by_id.get(asset.current_version_id or "")
blob = blobs_by_version_id.get(asset.current_version_id or "")
if not version or not blob:
raise FileStorageError("File version not found")
responses.append(
FileAssetResponse(
id=asset.id,
tenant_id=asset.tenant_id,
owner_type=asset.owner_type,
owner_id=_owner_id(asset),
display_path=asset.display_path,
filename=asset.filename,
description=asset.description,
size_bytes=blob.size_bytes,
content_type=blob.content_type,
checksum_sha256=blob.checksum_sha256,
version_id=version.id,
created_at=asset.created_at.isoformat(),
updated_at=asset.updated_at.isoformat(),
deleted_at=asset.deleted_at.isoformat() if asset.deleted_at else None,
audit_relevant=asset.id in sent_asset_ids,
metadata=asset.metadata_ or {},
shares=shares_by_asset_id.get(asset.id, []),
)
)
return responses
def _chunks(values: list[str], size: int = 900):
for index in range(0, len(values), size):
yield values[index:index + size]
def _folder_owner_id(folder: FileFolder) -> str:
return folder.owner_user_id if folder.owner_type == "user" else folder.owner_group_id # type: ignore[return-value]
@@ -349,7 +435,7 @@ def list_files(
path_prefix=path_prefix,
is_admin=_is_admin(principal),
)
return FileListResponse(files=[_asset_response(session, asset, include_shares=True) for asset in assets])
return FileListResponse(files=_asset_list_response(session, assets, include_shares=True))
@router.post("/upload", response_model=FileUploadResponse)

View File

@@ -11,7 +11,7 @@ from sqlalchemy.orm import Session
from govoplan_files.backend.db.models import FileAsset
from govoplan_files.backend.storage.common import FileConflictResolution, FileStorageError, UploadedStoredFile
from govoplan_files.backend.storage.backends import StorageBackendError, get_storage_backend
from govoplan_files.backend.storage.files import create_file_asset, current_version_and_blob
from govoplan_files.backend.storage.files import create_file_asset, current_versions_and_blobs
from govoplan_files.backend.storage.paths import filename_from_path, normalize_folder, normalize_logical_path
@@ -45,9 +45,11 @@ def _read_zip_member(
def create_zip_file(session: Session, assets: Iterable[FileAsset], output_path: str | Path) -> None:
backend = get_storage_backend()
asset_list = list(assets)
version_blobs = current_versions_and_blobs(session, asset_list)
with zipfile.ZipFile(output_path, mode="w", compression=zipfile.ZIP_DEFLATED) as archive:
for asset in assets:
_version, blob = current_version_and_blob(session, asset)
for asset in asset_list:
_version, blob = version_blobs[asset.id]
info = zipfile.ZipInfo(asset.display_path)
info.compress_type = zipfile.ZIP_DEFLATED
with archive.open(info, "w") as member:

View File

@@ -13,7 +13,9 @@ from typing import Any, Iterator
from sqlalchemy.orm import Session
from govoplan_files.backend.db.models import FileAsset
from govoplan_files.backend.storage.files import current_version_and_blob, list_assets_for_user, read_asset_bytes
from govoplan_files.backend.storage.backends import StorageBackendError, get_storage_backend
from govoplan_files.backend.storage.common import FileStorageError
from govoplan_files.backend.storage.files import current_versions_and_blobs, list_assets_for_user
from govoplan_files.backend.storage.paths import normalize_folder, normalize_logical_path, safe_storage_component
@@ -172,6 +174,8 @@ def prepare_campaign_snapshot(
owner_id = _asset_owner_id(asset)
if owner_id:
assets_by_owner[(asset.owner_type, owner_id)].append(asset)
version_blobs = current_versions_and_blobs(session, shared_assets)
backend = get_storage_backend() if include_bytes else None
manifest: dict[str, ManagedAttachmentFile] = {}
prepared_by_id: dict[str, tuple[str, str]] = {}
@@ -206,11 +210,14 @@ def prepare_campaign_snapshot(
continue
target = _safe_local_target(local_root, relative_path)
target.parent.mkdir(parents=True, exist_ok=True)
version, blob = version_blobs[asset.id]
if include_bytes:
data, version, blob = read_asset_bytes(session, asset)
try:
data = backend.get_bytes(blob.storage_key) if backend else b""
except StorageBackendError as exc:
raise FileStorageError(str(exc)) from exc
target.write_bytes(data)
else:
version, blob = current_version_and_blob(session, asset)
target.touch()
local_key = str(target.resolve())
manifest[local_key] = ManagedAttachmentFile(

View File

@@ -8,7 +8,7 @@ from sqlalchemy.orm import Session
from govoplan_files.backend.db.models import CampaignAttachmentUse, FileAsset, FileBlob, FileVersion
from govoplan_files.backend.storage.common import utcnow
from govoplan_files.backend.storage.files import current_version_and_blob, list_assets_for_user
from govoplan_files.backend.storage.files import current_versions_and_blobs, list_assets_for_user
if TYPE_CHECKING:
from govoplan_campaign.backend.db.models import CampaignJob
@@ -204,6 +204,7 @@ def record_campaign_attachment_uses_for_jobs(
)
assets_by_campaign: dict[tuple[str, str], dict[str, FileAsset]] = {}
version_blobs_by_campaign: dict[tuple[str, str], dict[str, tuple[FileVersion, FileBlob]]] = {}
for job_id, attachments in fallback_attachments_by_job.items():
job = job_by_id[job_id]
campaign_key = (job.tenant_id, job.campaign_id)
@@ -221,6 +222,8 @@ def record_campaign_attachment_uses_for_jobs(
by_key[asset.display_path.strip("/")] = asset
by_key.setdefault(asset.filename, asset)
assets_by_campaign[campaign_key] = by_key
version_blobs_by_campaign[campaign_key] = current_versions_and_blobs(session, assets)
version_blobs = version_blobs_by_campaign[campaign_key]
for attachment in attachments:
matches = attachment.get("matches") if isinstance(attachment.get("matches"), list) else []
@@ -230,7 +233,10 @@ def record_campaign_attachment_uses_for_jobs(
asset = next((by_key[key] for key in _candidate_match_keys(raw) if key in by_key), None)
if not asset:
continue
version, blob = current_version_and_blob(session, asset)
version_blob = version_blobs.get(asset.id)
if not version_blob:
continue
version, blob = version_blob
_add_use(
session,
job,

View File

@@ -265,6 +265,32 @@ def current_version_and_blob(session: Session, asset: FileAsset) -> tuple[FileVe
return version, blob
def current_versions_and_blobs(session: Session, assets: Iterable[FileAsset]) -> dict[str, tuple[FileVersion, FileBlob]]:
asset_list = list(assets)
if not asset_list:
return {}
version_ids = [asset.current_version_id for asset in asset_list if asset.current_version_id]
if len(version_ids) != len(asset_list):
raise FileStorageError("File has no current version")
rows: list[tuple[FileVersion, FileBlob]] = []
for chunk in _chunks(version_ids):
rows.extend(
session.query(FileVersion, FileBlob)
.join(FileBlob, FileBlob.id == FileVersion.blob_id)
.filter(FileVersion.id.in_(chunk))
.all()
)
by_version_id = {version.id: (version, blob) for version, blob in rows}
result: dict[str, tuple[FileVersion, FileBlob]] = {}
for asset in asset_list:
version_blob = by_version_id.get(asset.current_version_id or "")
if not version_blob:
raise FileStorageError("File version not found")
result[asset.id] = version_blob
return result
def read_asset_bytes(session: Session, asset: FileAsset) -> tuple[bytes, FileVersion, FileBlob]:
version, blob = current_version_and_blob(session, asset)
backend = get_storage_backend()
@@ -437,6 +463,11 @@ def _asset_owner_id(asset: FileAsset) -> str:
raise FileStorageError("File has no valid owner")
def _chunks(values: list[str], size: int = 900):
for index in range(0, len(values), size):
yield values[index:index + size]
def _active_asset_exists(session: Session, *, tenant_id: str, owner_type: str, owner_id: str, path: str, exclude_asset_id: str | None = None) -> bool:
return _active_asset_at_path(
session,

View File

@@ -33,6 +33,7 @@ from govoplan_files.backend.storage.files import (
asset_is_audit_relevant,
create_file_asset,
current_version_and_blob,
current_versions_and_blobs,
get_asset_for_user,
list_assets_for_user,
read_asset_bytes,
@@ -64,6 +65,7 @@ __all__ = [
"create_folder",
"create_zip_file",
"current_version_and_blob",
"current_versions_and_blobs",
"ensure_group_access",
"ensure_owner_access",
"extract_zip_upload",

View File

@@ -69,17 +69,13 @@ def transfer_selection(
if target_folder == folder_path or target_folder.startswith(f"{folder_path}/"):
raise FileStorageError("Cannot move a folder into itself or one of its child folders")
assets_by_id: dict[str, FileAsset] = {}
for file_id in file_ids:
asset = get_asset_for_user(
session,
tenant_id=tenant_id,
user_id=user_id,
asset_id=file_id,
require_write=operation == "move",
is_admin=is_admin,
)
assets_by_id[asset.id] = asset
assets_by_id = _selected_assets_for_owner(
session,
tenant_id=tenant_id,
owner_type=source_owner_type,
owner_id=source_owner_id,
file_ids=file_ids,
)
folder_asset_targets: dict[str, str] = {}
folder_target_paths: dict[str, str] = {}
@@ -297,6 +293,33 @@ def _collapse_folder_roots(folder_paths: list[str]) -> list[str]:
return collapsed
def _selected_assets_for_owner(
session: Session,
*,
tenant_id: str,
owner_type: str,
owner_id: str,
file_ids: list[str],
) -> dict[str, FileAsset]:
selected_file_ids = list(dict.fromkeys(file_ids))
if not selected_file_ids:
return {}
assets = {
asset.id: asset
for asset in _asset_query_for_owner(
session,
tenant_id=tenant_id,
owner_type=owner_type,
owner_id=owner_id,
)
.filter(FileAsset.id.in_(selected_file_ids), FileAsset.deleted_at.is_(None))
.all()
}
if len(assets) != len(selected_file_ids):
raise FileStorageError("File not found")
return assets
def _path_under_root(path: str, root: str) -> bool:
normalized = normalize_logical_path(path)
return normalized == root or normalized.startswith(f"{root}/")
@@ -349,13 +372,26 @@ def rename_selection(
if mode == "direct" and (len(selected_file_ids) + len(selected_folder_roots)) != 1:
raise FileStorageError("Direct rename requires exactly one selected item")
assets: dict[str, FileAsset] = {}
for file_id in selected_file_ids:
asset = get_asset_for_user(session, tenant_id=tenant_id, user_id=user_id, asset_id=file_id, require_write=True, is_admin=is_admin)
assets[asset.id] = asset
owner_type_norm = owner_type.lower().strip() if owner_type else None
owner_id_norm = owner_id
assets: dict[str, FileAsset] = {}
if selected_file_ids:
if owner_type_norm and owner_id_norm:
ensure_owner_access(session, tenant_id=tenant_id, owner_type=owner_type_norm, owner_id=owner_id_norm, user_id=user_id, is_admin=is_admin)
assets.update(
_selected_assets_for_owner(
session,
tenant_id=tenant_id,
owner_type=owner_type_norm,
owner_id=owner_id_norm,
file_ids=selected_file_ids,
)
)
else:
for file_id in selected_file_ids:
asset = get_asset_for_user(session, tenant_id=tenant_id, user_id=user_id, asset_id=file_id, require_write=True, is_admin=is_admin)
assets[asset.id] = asset
folder_rows_by_path: dict[str, FileFolder] = {}
affected_folder_paths: set[str] = set()
if selected_folder_roots and owner_type_norm and owner_id_norm:

View File

@@ -1,6 +1,6 @@
{
"name": "@govoplan/files-webui",
"version": "0.1.2",
"version": "0.1.4",
"private": true,
"type": "module",
"main": "src/index.ts",
@@ -21,7 +21,7 @@
"react-dom": "^19.0.0",
"react-router-dom": "^7.1.1",
"lucide-react": "^0.555.0",
"@govoplan/core-webui": "^0.1.2"
"@govoplan/core-webui": "^0.1.4"
},
"peerDependenciesMeta": {
"@govoplan/core-webui": {

View File

@@ -1,4 +1,4 @@
import { ApiError, apiFetch, apiUrl, authHeaders, csrfToken, type ApiSettings } from "@govoplan/core-webui";
import { ApiError, apiFetch, apiUrl, authHeaders, csrfToken, type ApiSettings, type FilesManagedFileLinkTarget } from "@govoplan/core-webui";
export type FileSpace = {
id: string;
@@ -181,13 +181,17 @@ export function bulkDeleteFiles(settings: ApiSettings, fileIds: string[]): Promi
export type FileBulkShareResponse = { shares: FileShare[]; shared_count: number };
export function shareFilesWithCampaign(settings: ApiSettings, fileIds: string[], campaignId: string): Promise<FileBulkShareResponse> {
export function shareFilesWithTarget(settings: ApiSettings, fileIds: string[], target: FilesManagedFileLinkTarget): Promise<FileBulkShareResponse> {
return apiFetch<FileBulkShareResponse>(settings, "/api/v1/files/bulk-shares", {
method: "POST",
body: JSON.stringify({ file_ids: fileIds, target_type: "campaign", target_id: campaignId, permission: "read" })
body: JSON.stringify({ file_ids: fileIds, target_type: target.type, target_id: target.id, permission: target.permission ?? "read" })
});
}
export function shareFilesWithCampaign(settings: ApiSettings, fileIds: string[], campaignId: string): Promise<FileBulkShareResponse> {
return shareFilesWithTarget(settings, fileIds, { type: "campaign", id: campaignId, label: "campaign" });
}
export async function shareFileWithCampaign(settings: ApiSettings, fileId: string, campaignId: string): Promise<FileShare> {
const response = await shareFilesWithCampaign(settings, [fileId], campaignId);
const share = response.shares[0];

View File

@@ -1,4 +1,4 @@
import { useEffect, useMemo, useState, type DragEvent as ReactDragEvent, type KeyboardEvent as ReactKeyboardEvent, type MouseEvent as ReactMouseEvent } from "react";
import { useEffect, useMemo, useRef, useState, type DragEvent as ReactDragEvent, type KeyboardEvent as ReactKeyboardEvent, type MouseEvent as ReactMouseEvent } from "react";
import { ChevronRight, Copy, Download, File, Folder, Home, Link2, MoveRight, Plus, Search, Trash2, UploadCloud } from "lucide-react";
import {
Button,
@@ -78,6 +78,9 @@ import { useFileDragDropState } from "./hooks/useFileDragDropState";
type UploadPhase = "idle" | "uploading" | "unpacking" | "finalizing";
const DEFAULT_FILE_LIST_ROW_HEIGHT = 58;
const FILE_LIST_OVERSCAN_ROWS = 8;
export default function FilesPage({ settings, auth }: { settings: ApiSettings; auth: AuthInfo }) {
const canDownload = hasScope(auth, "files:download");
const canUpload = hasScope(auth, "files:upload");
@@ -141,6 +144,28 @@ export default function FilesPage({ settings, auth }: { settings: ApiSettings; a
const entries = buildExplorerEntries(visibleFiles, folders, currentFolder, searchActive);
return sortExplorerEntries(entries, sortColumn, sortDirection);
}, [visibleFiles, folders, currentFolder, searchActive, sortColumn, sortDirection]);
const fileListViewportRef = useRef<HTMLDivElement | null>(null);
const fileListMeasureRowRef = useRef<HTMLDivElement | null>(null);
const [fileListViewportHeight, setFileListViewportHeight] = useState(0);
const [fileListScrollTop, setFileListScrollTop] = useState(0);
const [fileListRowHeight, setFileListRowHeight] = useState(DEFAULT_FILE_LIST_ROW_HEIGHT);
const virtualExplorerRows = useMemo(() => {
const rowHeight = Math.max(1, fileListRowHeight);
const entryScrollTop = Math.max(0, fileListScrollTop - rowHeight);
const viewportHeight = Math.max(fileListViewportHeight, rowHeight * FILE_LIST_OVERSCAN_ROWS);
const startIndex = Math.max(0, Math.floor(entryScrollTop / rowHeight) - FILE_LIST_OVERSCAN_ROWS);
const endIndex = Math.min(
explorerEntries.length,
Math.ceil((entryScrollTop + viewportHeight) / rowHeight) + FILE_LIST_OVERSCAN_ROWS
);
return {
startIndex,
topSpacerHeight: startIndex * rowHeight,
bottomSpacerHeight: Math.max(0, (explorerEntries.length - endIndex) * rowHeight),
entries: explorerEntries.slice(startIndex, endIndex)
};
}, [explorerEntries, fileListRowHeight, fileListScrollTop, fileListViewportHeight]);
const visibleEntryKeys = useMemo(() => explorerEntries.map(entrySelectionKey), [explorerEntries]);
const {
selectedFileIds,
@@ -172,6 +197,47 @@ export default function FilesPage({ settings, auth }: { settings: ApiSettings; a
const activeDialogSpace = activeDialogTarget ? spaces.find((space) => space.id === activeDialogTarget.spaceId) ?? null : null;
const downloadLabel = selectedDownloadFileIds.length > 1 ? "Download ZIP" : "Download";
useEffect(() => {
const viewport = fileListViewportRef.current;
if (!viewport) return undefined;
const updateViewportHeight = () => {
setFileListViewportHeight(viewport.clientHeight);
setFileListScrollTop(viewport.scrollTop);
};
updateViewportHeight();
if (typeof ResizeObserver === "undefined") return undefined;
const observer = new ResizeObserver(updateViewportHeight);
observer.observe(viewport);
return () => observer.disconnect();
}, []);
useEffect(() => {
const row = fileListMeasureRowRef.current;
if (!row) return undefined;
const updateRowHeight = () => {
const measuredHeight = row.getBoundingClientRect().height;
if (measuredHeight > 0) setFileListRowHeight(Math.round(measuredHeight));
};
updateRowHeight();
if (typeof ResizeObserver === "undefined") return undefined;
const observer = new ResizeObserver(updateRowHeight);
observer.observe(row);
return () => observer.disconnect();
}, [activeSpaceId, currentFolder]);
useEffect(() => {
const viewport = fileListViewportRef.current;
if (!viewport) return;
viewport.scrollTop = 0;
setFileListScrollTop(0);
}, [activeSpaceId, currentFolder, searchActive, searchResults, sortColumn, sortDirection]);
async function loadSpaces() {
setBusy(true);
setError("");
@@ -1161,6 +1227,75 @@ export default function FilesPage({ settings, auth }: { settings: ApiSettings; a
: undefined;
const visibleUploadProgress = uploadPhase === "unpacking" ? null : uploadProgress;
function renderExplorerEntry(entry: ExplorerEntry, rowIndex: number) {
const entryDropTarget = entry.kind === "folder" && activeSpace ? { spaceId: activeSpace.id, folderPath: entry.path } : null;
const isDropTarget = entryDropTarget ? dropTargetKey === dropTargetId(entryDropTarget) : false;
return entry.kind === "folder" ? (
<div
key={entry.id}
className={`file-list-row folder-row ${isEntrySelected(entry) ? "is-selected" : ""} ${isDropTarget ? "is-drop-target" : ""}`}
role="row"
aria-rowindex={rowIndex}
tabIndex={0}
draggable
onDragStart={(event) => handleInternalDragStart(entry, event)}
onDragEnd={() => { setInternalDrag(null); clearDropState(); }}
onDragOver={(event) => entryDropTarget && handleDropTargetDragOver(event, entryDropTarget)}
onDragLeave={clearDropState}
onDrop={(event) => entryDropTarget && void handleDropOnTarget(event, entryDropTarget)}
onMouseDown={preventTextSelectionOnShift}
onClick={(event) => handleEntrySelection(entry, event)}
onDoubleClick={() => { if (!busy && activeSpace) openFolder(activeSpace.id, entry.path); }}
onContextMenu={(event) => openContextMenu(event, "folder", entry)}
onKeyDown={(event) => handleEntryKeyDown(entry, event)}
>
<div className="file-list-name-cell">
<div className="file-list-name">
<Folder className="file-row-icon" size={20} aria-hidden="true" />
<span><strong>{entry.name}</strong><small>{folderContentLabel(entry)}</small></span>
</div>
</div>
<span>{formatBytes(entry.totalSize)}</span>
<span className="file-row-tail"><span>{formatDate(entry.updatedAt)}</span></span>
</div>
) : (
<div
key={entry.id}
className={`file-list-row file-row ${isEntrySelected(entry) ? "is-selected" : ""}`}
role="row"
aria-rowindex={rowIndex}
tabIndex={0}
draggable
onDragStart={(event) => handleInternalDragStart(entry, event)}
onDragEnd={() => { setInternalDrag(null); clearDropState(); }}
onMouseDown={preventTextSelectionOnShift}
onClick={(event) => handleEntrySelection(entry, event)}
onDoubleClick={() => { if (!busy) void downloadFile(settings, entry.file); }}
onContextMenu={(event) => openContextMenu(event, "file", entry)}
onKeyDown={(event) => handleEntryKeyDown(entry, event)}
>
<div className="file-list-name-cell">
<div className="file-list-name">
<File className="file-row-icon" size={20} aria-hidden="true" />
<span>
<strong>{searchActive ? entry.file.display_path : entry.file.filename}</strong>
<small
className={`file-linkage-status ${activeCampaignShareCount(entry.file) > 0 ? "is-linked" : ""}`}
title={campaignShareTitle(entry.file)}
>
{activeCampaignShareCount(entry.file) > 0 && <Link2 size={12} aria-hidden="true" />}
{campaignShareLabel(entry.file)}
</small>
</span>
</div>
</div>
<span>{formatBytes(entry.file.size_bytes)}</span>
<span className="file-row-tail"><span>{formatDate(entry.file.updated_at)}</span></span>
</div>
);
}
return (
<div className="workspace-data-page module-entry-page file-manager-page file-manager-fullscreen">
{error && (
@@ -1258,20 +1393,24 @@ export default function FilesPage({ settings, auth }: { settings: ApiSettings; a
<div
className="file-list-drop-target"
ref={fileListViewportRef}
onScroll={(event) => setFileListScrollTop(event.currentTarget.scrollTop)}
onContextMenu={(event) => openContextMenu(event, "empty")}
onClick={(event) => {
if (event.target === event.currentTarget) applySelectionKeys(new Set<EntrySelectionKey>());
}}
>
<div className="file-list-table" role="table" aria-label="Managed files">
<div className="file-list-table" role="table" aria-label="Managed files" aria-rowcount={explorerEntries.length + 1}>
{(() => {
const normalizedCurrentFolder = normalizeFolder(currentFolder);
const canOpenParent = Boolean(normalizedCurrentFolder && activeSpace);
const targetParentFolder = parentFolderPath(normalizedCurrentFolder);
return (
<div
ref={fileListMeasureRowRef}
className={`file-list-row folder-row file-parent-row ${canOpenParent ? "" : "is-disabled"}`}
role="row"
aria-rowindex={1}
tabIndex={canOpenParent ? 0 : -1}
aria-disabled={!canOpenParent}
aria-label={canOpenParent ? `Open parent folder ${targetParentFolder || activeSpace?.label || "root"}` : "Already at the root folder"}
@@ -1301,71 +1440,13 @@ export default function FilesPage({ settings, auth }: { settings: ApiSettings; a
{explorerEntries.length === 0 && (
<div className="file-list-empty">This folder is empty. Use Upload or Create Folder to add content.</div>
)}
{explorerEntries.map((entry) => {
const entryDropTarget = entry.kind === "folder" && activeSpace ? { spaceId: activeSpace.id, folderPath: entry.path } : null;
const isDropTarget = entryDropTarget ? dropTargetKey === dropTargetId(entryDropTarget) : false;
return entry.kind === "folder" ? (
<div
key={entry.id}
className={`file-list-row folder-row ${isEntrySelected(entry) ? "is-selected" : ""} ${isDropTarget ? "is-drop-target" : ""}`}
role="row"
tabIndex={0}
draggable
onDragStart={(event) => handleInternalDragStart(entry, event)}
onDragEnd={() => { setInternalDrag(null); clearDropState(); }}
onDragOver={(event) => entryDropTarget && handleDropTargetDragOver(event, entryDropTarget)}
onDragLeave={clearDropState}
onDrop={(event) => entryDropTarget && void handleDropOnTarget(event, entryDropTarget)}
onMouseDown={preventTextSelectionOnShift}
onClick={(event) => handleEntrySelection(entry, event)}
onDoubleClick={() => { if (!busy && activeSpace) openFolder(activeSpace.id, entry.path); }}
onContextMenu={(event) => openContextMenu(event, "folder", entry)}
onKeyDown={(event) => handleEntryKeyDown(entry, event)}
>
<div className="file-list-name-cell">
<div className="file-list-name">
<Folder className="file-row-icon" size={20} aria-hidden="true" />
<span><strong>{entry.name}</strong><small>{folderContentLabel(entry)}</small></span>
</div>
</div>
<span>{formatBytes(entry.totalSize)}</span>
<span className="file-row-tail"><span>{formatDate(entry.updatedAt)}</span></span>
</div>
) : (
<div
key={entry.id}
className={`file-list-row file-row ${isEntrySelected(entry) ? "is-selected" : ""}`}
role="row"
tabIndex={0}
draggable
onDragStart={(event) => handleInternalDragStart(entry, event)}
onDragEnd={() => { setInternalDrag(null); clearDropState(); }}
onMouseDown={preventTextSelectionOnShift}
onClick={(event) => handleEntrySelection(entry, event)}
onDoubleClick={() => { if (!busy) void downloadFile(settings, entry.file); }}
onContextMenu={(event) => openContextMenu(event, "file", entry)}
onKeyDown={(event) => handleEntryKeyDown(entry, event)}
>
<div className="file-list-name-cell">
<div className="file-list-name">
<File className="file-row-icon" size={20} aria-hidden="true" />
<span>
<strong>{searchActive ? entry.file.display_path : entry.file.filename}</strong>
<small
className={`file-linkage-status ${activeCampaignShareCount(entry.file) > 0 ? "is-linked" : ""}`}
title={campaignShareTitle(entry.file)}
>
{activeCampaignShareCount(entry.file) > 0 && <Link2 size={12} aria-hidden="true" />}
{campaignShareLabel(entry.file)}
</small>
</span>
</div>
</div>
<span>{formatBytes(entry.file.size_bytes)}</span>
<span className="file-row-tail"><span>{formatDate(entry.file.updated_at)}</span></span>
</div>
);
})}
{virtualExplorerRows.topSpacerHeight > 0 && (
<div className="file-list-virtual-spacer" style={{ height: virtualExplorerRows.topSpacerHeight }} aria-hidden="true" />
)}
{virtualExplorerRows.entries.map((entry, index) => renderExplorerEntry(entry, virtualExplorerRows.startIndex + index + 2))}
{virtualExplorerRows.bottomSpacerHeight > 0 && (
<div className="file-list-virtual-spacer" style={{ height: virtualExplorerRows.bottomSpacerHeight }} aria-hidden="true" />
)}
</div>
</div>
</section>

File diff suppressed because it is too large Load Diff

View File

@@ -2,6 +2,13 @@ import { formatDateTime as formatPlatformDateTime } from "@govoplan/core-webui";
import type { FileFolder, ManagedFile } from "../../../api/files";
import type { DragSelectionState, EntrySelectionKey, ExplorerEntry, FileEntry, FolderEntry, FolderNode, SortColumn, SortDirection } from "../types";
type FolderStats = {
directFiles: number;
childFolders: Set<string>;
totalSize: number;
updatedAt: string;
};
export function buildFolderTree(files: ManagedFile[], folders: FileFolder[]): FolderNode[] {
const byPath = new Map<string, FolderNode>();
const ensureNode = (path: string, persisted: boolean): FolderNode | null => {
@@ -71,21 +78,23 @@ export function buildExplorerEntries(files: ManagedFile[], folders: FileFolder[]
const prefix = folder ? `${folder}/` : "";
const folderMap = new Map<string, FolderEntry>();
const directFiles: FileEntry[] = [];
const folderStats = buildFolderStats(files, folders);
for (const persisted of folders) {
const path = normalizeFolder(persisted.path);
if (!path.startsWith(prefix) || path === folder) continue;
const relative = prefix ? path.slice(prefix.length) : path;
if (!relative || relative.includes("/")) continue;
const stats = folderStats.get(path);
folderMap.set(path, {
kind: "folder",
id: `folder:${path}`,
name: relative,
path,
fileCount: 0,
folderCount: 0,
totalSize: 0,
updatedAt: persisted.updated_at,
fileCount: stats?.directFiles ?? 0,
folderCount: stats?.childFolders.size ?? 0,
totalSize: stats?.totalSize ?? 0,
updatedAt: latestTimestamp(persisted.updated_at, stats?.updatedAt),
persisted: true
});
}
@@ -102,31 +111,22 @@ export function buildExplorerEntries(files: ManagedFile[], folders: FileFolder[]
}
const folderName = relativePath.slice(0, slashIndex);
const folderPath = prefix ? `${folder}/${folderName}` : folderName;
const existing = folderMap.get(folderPath);
if (existing) {
existing.totalSize += file.size_bytes;
if (file.updated_at > existing.updatedAt) existing.updatedAt = file.updated_at;
} else {
if (!folderMap.has(folderPath)) {
const stats = folderStats.get(folderPath);
folderMap.set(folderPath, {
kind: "folder",
id: `folder:${folderPath}`,
name: folderName,
path: folderPath,
fileCount: 0,
folderCount: 0,
totalSize: file.size_bytes,
updatedAt: file.updated_at,
fileCount: stats?.directFiles ?? 0,
folderCount: stats?.childFolders.size ?? 0,
totalSize: stats?.totalSize ?? file.size_bytes,
updatedAt: stats?.updatedAt || file.updated_at,
persisted: false
});
}
}
for (const entry of folderMap.values()) {
const counts = directFolderCounts(files, folders, entry.path);
entry.fileCount = counts.files;
entry.folderCount = counts.folders;
}
return [...Array.from(folderMap.values()), ...directFiles];
}
@@ -164,25 +164,55 @@ export function entryModifiedTime(entry: ExplorerEntry): number {
}
export function directFolderCounts(files: ManagedFile[], folders: FileFolder[], folderPath: string): { files: number; folders: number } {
const normalized = normalizeFolder(folderPath);
const prefix = normalized ? `${normalized}/` : "";
const directFiles = files.filter((file) => parentFolderPath(file.display_path) === normalized).length;
const childFolders = new Set<string>();
const stats = buildFolderStats(files, folders).get(normalizeFolder(folderPath));
return { files: stats?.directFiles ?? 0, folders: stats?.childFolders.size ?? 0 };
}
function buildFolderStats(files: ManagedFile[], folders: FileFolder[]): Map<string, FolderStats> {
const statsByPath = new Map<string, FolderStats>();
const ensureStats = (path: string): FolderStats => {
const normalized = normalizeFolder(path);
const existing = statsByPath.get(normalized);
if (existing) return existing;
const stats: FolderStats = { directFiles: 0, childFolders: new Set(), totalSize: 0, updatedAt: "" };
statsByPath.set(normalized, stats);
return stats;
};
for (const folder of folders) {
const path = normalizeFolder(folder.path);
if (!path.startsWith(prefix) || path === normalized) continue;
const relative = prefix ? path.slice(prefix.length) : path;
if (!relative) continue;
childFolders.add(relative.split("/")[0]);
if (!path) continue;
const parts = path.split("/");
const parentPath = normalizeFolder(parts.slice(0, -1).join("/"));
const name = parts[parts.length - 1];
if (name) ensureStats(parentPath).childFolders.add(name);
ensureStats(path);
}
for (const file of files) {
const path = normalizeFilePath(file.display_path);
if (!path.startsWith(prefix)) continue;
const relative = prefix ? path.slice(prefix.length) : path;
if (!relative || !relative.includes("/")) continue;
childFolders.add(relative.split("/")[0]);
const parts = normalizeFilePath(file.display_path || file.filename).split("/").filter(Boolean);
if (parts.length === 0) continue;
const directParentPath = normalizeFolder(parts.slice(0, -1).join("/"));
ensureStats(directParentPath).directFiles += 1;
for (let index = 0; index < parts.length - 1; index += 1) {
const folderPath = parts.slice(0, index + 1).join("/");
const stats = ensureStats(folderPath);
stats.totalSize += file.size_bytes;
stats.updatedAt = latestTimestamp(stats.updatedAt, file.updated_at);
const parentPath = normalizeFolder(parts.slice(0, index).join("/"));
ensureStats(parentPath).childFolders.add(parts[index]);
}
}
return { files: directFiles, folders: childFolders.size };
return statsByPath;
}
function latestTimestamp(current: string, candidate?: string): string {
if (!candidate) return current;
if (!current) return candidate;
return candidate > current ? candidate : current;
}
export function folderContentLabel(entry: FolderEntry): string {
@@ -209,13 +239,14 @@ export function buildFolderEntryFromSources(files: ManagedFile[], folders: FileF
const sortedDates = childFiles.map((file) => file.updated_at).sort();
const latestFileDate = sortedDates.length > 0 ? sortedDates[sortedDates.length - 1] : undefined;
const updatedAt = latestFileDate || persistedFolder?.updated_at || new Date().toISOString();
const counts = directFolderCounts(files, folders, normalizedPath);
return {
kind: "folder",
id: `folder:${normalizedPath}`,
name: lastPathSegment(normalizedPath) || "Root",
path: normalizedPath,
fileCount: directFolderCounts(files, folders, normalizedPath).files,
folderCount: directFolderCounts(files, folders, normalizedPath).folders,
fileCount: counts.files,
folderCount: counts.folders,
totalSize: childFiles.reduce((total, file) => total + file.size_bytes, 0),
updatedAt,
persisted: Boolean(persistedFolder)

View File

@@ -5,6 +5,8 @@ export { default as FilesPage } from "./features/files/FilesPage";
export * from "./api/files";
export type { PlatformWebModule, PlatformNavItem, PlatformRouteContribution, PlatformRouteContext } from "@govoplan/core-webui";
export { FolderTree } from "./features/files/components/FileManagerComponents";
export { default as ManagedFileChooser } from "./features/files/components/ManagedFileChooser";
export type { ManagedAttachmentSelection, ManagedFolderSelection } from "./features/files/components/ManagedFileChooser";
export { useFileTreeState } from "./features/files/hooks/useFileTreeState";
export type { FolderNode, SortColumn, SortDirection } from "./features/files/types";
export { buildExplorerEntries, buildFolderEntryFromSources, buildFolderTree, candidateRenamedPath, directFolderCounts, entryModifiedTime, entryName, entrySelectionKey, entrySize, fileIdsForSelection, folderAncestorPaths, folderBreadcrumbs, folderContentLabel, formatBytes, formatDate, isFileInFolder, isPathUnderOrSame, joinFolder, lastPathSegment, normalizeFilePath, normalizeFolder, parentFolderPath, parseDragState, sortExplorerEntries, sortFolderNodes, treeNodeKey } from "./features/files/utils/fileManagerUtils";

View File

@@ -1,6 +1,8 @@
import { createElement, lazy } from "react";
import type { FilesFileExplorerUiCapability, PlatformWebModule } from "@govoplan/core-webui";
import { FolderTree } from "./features/files/components/FileManagerComponents";
import ManagedFileChooser from "./features/files/components/ManagedFileChooser";
import { listFileSpaces, listFiles, listFolders, resolveFilePatterns, shareFilesWithTarget } from "./api/files";
const FilesPage = lazy(() => import("./features/files/FilesPage"));
@@ -16,7 +18,15 @@ export const filesModule: PlatformWebModule = {
{ path: "/files", anyOf: fileRead, order: 40, render: ({ settings, auth }) => createElement(FilesPage, { settings, auth }) }
],
uiCapabilities: {
"files.fileExplorer": { FolderTree } satisfies FilesFileExplorerUiCapability
"files.fileExplorer": {
FolderTree,
ManagedFileChooser,
listFileSpaces,
listFiles,
listFolders,
resolveFilePatterns,
shareFilesWithTarget
} satisfies FilesFileExplorerUiCapability
}
};

View File

@@ -391,6 +391,11 @@
text-align: center;
}
.file-list-virtual-spacer {
min-height: 0;
pointer-events: none;
}
.file-context-menu {
position: fixed;
z-index: 110;
@@ -698,3 +703,467 @@
color: var(--text-strong);
outline: none;
}
/* Managed file chooser exposed through the files.fileExplorer capability. */
.managed-file-chooser-dialog {
display: grid;
grid-template-rows: auto minmax(0, 1fr) auto;
width: min(1080px, calc(100vw - 40px));
height: min(820px, calc(100vh - 40px));
max-height: min(820px, calc(100vh - 40px));
overflow: hidden;
}
.managed-file-chooser-dialog > .dialog-header {
padding: 16px 18px;
border-bottom: 1px solid var(--line);
background: var(--panel);
}
.managed-file-chooser-body {
display: flex;
flex-direction: column;
gap: 14px;
min-height: 0;
overflow: hidden;
padding: 0;
}
.managed-file-chooser-body > .alert {
margin: 14px 14px 0;
}
.managed-file-chooser-footer {
flex: 0 0 auto;
padding: 12px 18px;
border-top: 1px solid var(--line);
background: var(--panel);
box-shadow: 0 -8px 24px rgba(15, 23, 42, .06);
}
.managed-file-chooser-layout {
display: grid;
grid-template-columns: minmax(190px, 240px) minmax(0, 1fr);
flex: 1 1 auto;
min-height: 0;
max-height: none;
border: 0;
border-radius: 0;
overflow: hidden;
background: var(--panel);
}
.managed-file-chooser-spaces {
min-width: 0;
padding: 16px;
border-right: 1px solid var(--line);
background: var(--panel-soft);
overflow: auto;
}
.managed-file-chooser-spaces.file-tree-panel {
display: flex;
padding: 0;
overflow: hidden;
}
.managed-file-chooser-spaces .file-tree-list {
display: flex;
flex-direction: column;
min-height: 0;
padding-bottom: 12px;
}
.managed-file-chooser-spaces .file-tree-space.is-active {
display: flex;
flex: 1 1 auto;
flex-direction: column;
min-height: 0;
}
.managed-file-chooser-spaces h3 {
margin: 0 0 12px;
font-size: 13px;
text-transform: uppercase;
letter-spacing: .04em;
color: var(--muted);
}
.managed-file-space-list {
display: grid;
gap: 7px;
}
.managed-file-space-button,
.managed-file-entry {
width: 100%;
border: 1px solid transparent;
border-radius: 9px;
background: transparent;
color: var(--ink);
text-align: left;
cursor: pointer;
}
.managed-file-space-button {
display: grid;
grid-template-columns: 20px minmax(0, 1fr);
gap: 9px;
align-items: start;
padding: 9px;
}
.managed-file-space-button span,
.managed-file-entry > span:not(.managed-file-shared-badge) {
display: grid;
gap: 2px;
min-width: 0;
}
.managed-file-space-button small,
.managed-file-entry small {
color: var(--muted);
font-size: 11px;
}
.managed-file-space-button:hover:not(:disabled),
.managed-file-space-button.is-selected {
border-color: var(--line-dark);
background: var(--panel);
}
.managed-file-space-button.is-selected {
border-color: var(--accent);
box-shadow: inset 3px 0 0 var(--accent);
}
.managed-file-space-button:disabled {
cursor: not-allowed;
opacity: .45;
}
.managed-file-chooser-browser {
display: grid;
grid-template-rows: auto auto minmax(0, 1fr) auto;
min-width: 0;
min-height: 0;
}
.managed-file-chooser-browser.folder-mode {
grid-template-rows: auto minmax(0, 1fr) auto;
}
.managed-file-chooser-toolbar {
display: flex;
justify-content: space-between;
gap: 12px;
align-items: center;
padding: 12px 14px;
border-bottom: 1px solid var(--line);
}
.managed-file-breadcrumb {
display: flex;
flex-wrap: wrap;
gap: 5px;
align-items: center;
min-width: 0;
}
.managed-file-breadcrumb > button,
.managed-file-breadcrumb span button {
display: inline-flex;
gap: 5px;
align-items: center;
border: 0;
border-radius: 6px;
background: transparent;
color: var(--ink);
padding: 5px 6px;
cursor: pointer;
}
.managed-file-breadcrumb button:hover:not(:disabled) {
background: var(--panel-soft);
}
.managed-pattern-editor {
display: grid;
gap: 8px;
padding: 12px 14px;
border-bottom: 1px solid var(--line);
background: var(--panel-soft);
}
.managed-pattern-editor label {
display: grid;
gap: 6px;
font-size: 12px;
font-weight: 700;
}
.managed-file-entry-table {
display: grid;
grid-template-rows: auto minmax(0, 1fr);
min-height: 0;
overflow: hidden;
}
.managed-file-entry-head,
.managed-file-entry {
grid-template-columns: 22px minmax(0, 1fr) 110px 160px;
}
.managed-file-entry-head {
display: grid;
gap: 9px;
align-items: center;
min-height: 38px;
padding: 0 20px;
border-bottom: 1px solid var(--line);
background: var(--panel-soft);
color: var(--muted);
font-size: 12px;
font-weight: 750;
}
.managed-file-entry-head button {
display: inline-flex;
align-items: center;
justify-content: flex-start;
gap: 5px;
width: max-content;
max-width: 100%;
border: 0;
background: transparent;
color: inherit;
padding: 5px 0;
font: inherit;
cursor: pointer;
}
.managed-file-entry-head button.is-sorted {
color: var(--text-strong);
}
.managed-file-entry-list {
display: block;
padding: 10px;
min-height: 0;
overflow: auto;
}
.managed-file-entry {
display: grid;
gap: 9px;
align-items: center;
min-height: 52px;
padding: 8px 10px;
margin: 0 0 4px;
}
.managed-file-entry:last-child {
margin-bottom: 0;
}
.managed-file-entry:hover:not(:disabled) {
border-color: var(--line);
background: var(--panel-soft);
}
.managed-file-entry.is-selected {
border-color: var(--accent);
background: var(--accent-soft);
}
.managed-file-entry:disabled {
color: var(--ink);
opacity: 1;
cursor: default;
}
.managed-file-entry.is-folder:not(:disabled) {
cursor: pointer;
}
.managed-file-entry.is-context-only {
opacity: .56;
}
.managed-file-entry.is-parent:disabled {
opacity: .38;
}
.managed-file-entry-name {
display: grid;
gap: 2px;
min-width: 0;
}
.managed-file-entry-name strong,
.managed-file-entry-name small {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.managed-file-entry-name small {
display: inline-flex;
align-items: center;
gap: 4px;
}
.managed-file-entry-size,
.managed-file-entry-modified {
color: var(--muted);
font-size: 12px;
white-space: nowrap;
}
.managed-file-shared-badge {
display: inline-flex;
gap: 4px;
align-items: center;
border: 1px solid var(--success-line, var(--line));
border-radius: 999px;
padding: 3px 7px;
color: var(--success, var(--muted));
font-size: 11px;
white-space: nowrap;
}
.managed-file-empty {
padding: 28px 16px;
text-align: center;
}
.managed-file-virtual-spacer {
min-height: 0;
pointer-events: none;
}
.managed-file-tree-virtual-list {
flex: 1 1 auto;
min-height: 80px;
overflow: auto;
}
.managed-file-chooser-note {
margin: 0;
padding: 10px 14px;
border-top: 1px solid var(--line);
background: var(--panel-soft);
}
.managed-pattern-summary {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
color: var(--muted);
font-size: 12px;
font-weight: 600;
}
.managed-pattern-results {
display: grid;
grid-template-rows: auto minmax(0, 1fr);
min-width: 0;
min-height: 0;
overflow: hidden;
}
.managed-pattern-results .file-list-table {
min-width: 680px;
min-height: 0;
overflow: auto;
}
.managed-pattern-result-row {
width: 100%;
border-top: 0;
border-right: 0;
border-left: 0;
background: transparent;
color: var(--ink);
text-align: left;
font: inherit;
cursor: pointer;
}
.managed-pattern-result-row .file-list-name > span {
display: grid;
min-width: 0;
}
.managed-pattern-result-row .file-list-name strong {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.managed-pattern-result-row .file-list-name small {
color: var(--muted);
font-size: 11px;
}
.managed-pattern-rendered {
display: block;
color: var(--muted);
}
.split-field-action {
gap: 0;
}
.split-field-action > input,
.split-field-action > select,
.split-field-action > textarea {
border-top-right-radius: 0 !important;
border-bottom-right-radius: 0 !important;
}
.split-field-action > button,
.split-field-action > .button,
.split-field-action > .btn {
align-self: stretch;
margin-left: -1px;
border-top-left-radius: 0;
border-bottom-left-radius: 0;
box-shadow: none;
}
@media (max-width: 850px) {
.managed-file-entry-head,
.managed-file-entry {
grid-template-columns: 22px minmax(0, 1fr) 100px;
}
.managed-file-entry-head > :last-child,
.managed-file-entry-modified {
display: none;
}
}
@media (max-width: 760px) {
.managed-file-chooser-dialog {
width: calc(100vw - 20px);
height: calc(100vh - 20px);
}
.managed-file-chooser-layout {
grid-template-columns: 1fr;
max-height: calc(100vh - 220px);
}
.managed-file-chooser-spaces {
border-right: 0;
border-bottom: 1px solid var(--line);
max-height: 160px;
}
.managed-file-chooser-toolbar {
align-items: flex-start;
flex-direction: column;
}
}