Release v0.1.4
This commit is contained in:
@@ -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",
|
||||
|
||||
@@ -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]
|
||||
|
||||
@@ -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,
|
||||
|
||||
@@ -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)
|
||||
|
||||
@@ -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:
|
||||
|
||||
@@ -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(
|
||||
|
||||
@@ -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,
|
||||
|
||||
@@ -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,
|
||||
|
||||
@@ -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",
|
||||
|
||||
@@ -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(
|
||||
assets_by_id = _selected_assets_for_owner(
|
||||
session,
|
||||
tenant_id=tenant_id,
|
||||
user_id=user_id,
|
||||
asset_id=file_id,
|
||||
require_write=operation == "move",
|
||||
is_admin=is_admin,
|
||||
owner_type=source_owner_type,
|
||||
owner_id=source_owner_id,
|
||||
file_ids=file_ids,
|
||||
)
|
||||
assets_by_id[asset.id] = asset
|
||||
|
||||
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")
|
||||
|
||||
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
|
||||
|
||||
owner_type_norm = owner_type.lower().strip() if owner_type else None
|
||||
owner_id_norm = owner_id
|
||||
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:
|
||||
|
||||
@@ -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": {
|
||||
|
||||
@@ -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];
|
||||
|
||||
@@ -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>
|
||||
|
||||
1047
webui/src/features/files/components/ManagedFileChooser.tsx
Normal file
1047
webui/src/features/files/components/ManagedFileChooser.tsx
Normal file
File diff suppressed because it is too large
Load Diff
@@ -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)
|
||||
|
||||
@@ -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";
|
||||
|
||||
@@ -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
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user