File Preview: {selectedFile.path.split('/').slice(-1)}
} width="60%" open={isOpen} footer={() => ( @@ -48,12 +66,74 @@ export const PreviewModalBody: React.FC<{ )} onCancel={handleClose} > +
+ {!selectedFile.path.endsWith('.hazmapper') && (
+ <>
+ {!isReadOnly && api === 'tapis' && (
+
+ {({ onClick }) => (
+
+ )}
+
+ )}
+
+ {user && (
+
+ {({ onClick }) => (
+
+ )}
+
+ )}
+
+ {({ onClick }) => (
+
+ )}
+
+
+ )}
+
{isLoading &&
@@ -63,16 +143,14 @@ export const PreviewModalBody: React.FC<{
type TPreviewModal = React.FC<{
api: string;
- system: string;
scheme?: string;
- path: string;
+ selectedFile: TFileListing;
children: TModalChildren;
}>;
export const PreviewModal: TPreviewModal = ({
api,
- system,
scheme,
- path,
+ selectedFile,
children,
}) => {
const [isModalOpen, setIsModalOpen] = useState(false);
@@ -91,9 +169,8 @@ export const PreviewModal: TPreviewModal = ({
{isModalOpen && (
Rename {selectedFilesName[0]?.name}
} width="60%" open={isOpen} + destroyOnClose footer={null} // Remove the footer from here onCancel={handleCancel} > - +
+
+
+
+ )}
diff --git a/client/modules/datafiles/src/DatafilesSideNav/DatafilesSideNav.tsx b/client/modules/datafiles/src/DatafilesSideNav/DatafilesSideNav.tsx
index 7ddba05d1e..f9412bed83 100644
--- a/client/modules/datafiles/src/DatafilesSideNav/DatafilesSideNav.tsx
+++ b/client/modules/datafiles/src/DatafilesSideNav/DatafilesSideNav.tsx
@@ -2,16 +2,18 @@ import React from 'react';
import { NavLink } from 'react-router-dom';
import styles from './DatafilesSideNav.module.css';
import { useAuthenticatedUser } from '@client/hooks';
+import { Tooltip } from 'antd';
-const DataFilesNavLink: React.FC> = ({
- to,
- children,
-}) => {
+const DataFilesNavLink: React.FC<
+ React.PropsWithChildren<{ to: string; tooltip?: string }>
+> = ({ to, tooltip, children }) => {
return (
-
-
-
+
+
+
+
);
};
@@ -28,37 +30,70 @@ export const DatafilesSideNav: React.FC = () => {
>
{user && (
<>
-
+
My Data
-
+
+
HPC Work
- My Projects
-
- Shared with Me
+
+ My Projects
-Box.com
- Dropbox.com
- Google Drive
+
+ Box.com
+
+
+ Dropbox.com
+
+
+ Google Drive
+
)} -
+
Published
-
+
Published (NEES)
-
+
Community Data
diff --git a/client/modules/datafiles/src/DatafilesToolbar/DatafilesToolbar.tsx b/client/modules/datafiles/src/DatafilesToolbar/DatafilesToolbar.tsx
index 31b6341d67..8b08bbc73f 100644
--- a/client/modules/datafiles/src/DatafilesToolbar/DatafilesToolbar.tsx
+++ b/client/modules/datafiles/src/DatafilesToolbar/DatafilesToolbar.tsx
@@ -3,16 +3,20 @@ import styles from './DatafilesToolbar.module.css';
import {
useAuthenticatedUser,
useFileListingRouteParams,
+ useProjectDetail,
useSelectedFiles,
+ useSelectedFilesForSystem,
} from '@client/hooks';
import DatafilesModal from '../DatafilesModal/DatafilesModal';
import TrashButton from './TrashButton';
import { Button, ButtonProps, ConfigProvider, ThemeConfig } from 'antd';
+import { useMatches, useParams } from 'react-router-dom';
const toolbarTheme: ThemeConfig = {
components: {
Button: {
colorPrimaryHover: 'rgba(0, 0, 0, 0.88)',
+ motionDurationMid: '0',
},
},
};
@@ -27,22 +31,83 @@ const ToolbarButton: React.FC = (props) => {
export const DatafilesToolbar: React.FC<{ searchInput?: React.ReactNode }> = ({
searchInput,
}) => {
- const { api, system, scheme, path } = useFileListingRouteParams();
- const { selectedFiles } = useSelectedFiles(api, system, path);
+ const routeParams = useFileListingRouteParams();
+ const { scheme } = routeParams;
+ let { api, system, path } = routeParams;
+ const { neesid } = useParams();
+ let { projectId } = useParams();
+
const { user } = useAuthenticatedUser();
+ const matches = useMatches();
+ const isProjects = matches.find((m) => m.id === 'project');
+ const isPublished = matches.find((m) => m.id === 'published');
+ const isEntityListing = matches.find((m) => m.id === 'entity-listing');
+ const isNees = matches.find((m) => m.id === 'nees');
+
+ const isReadOnly =
+ isPublished || isNees || system === 'designsafe.storage.community';
+
+ if (!isProjects) projectId = '';
+ const { data } = useProjectDetail(projectId ?? '');
+ if (projectId) {
+ system = `project-${data?.baseProject.uuid}`;
+ api = 'tapis';
+ }
+ if (isPublished) {
+ system = 'designsafe.storage.published';
+ api = 'tapis';
+ }
+ if (isNees) {
+ system = 'nees.public';
+ api = 'tapis';
+ }
+ if (isNees && !path) {
+ path = `/${neesid}`;
+ }
+
+ /*
+ Project landing pages have multiple selectable listings, so use the
+ useSelectedFilesForSystem hook to capture every selection on the page.
+ */
+ const { selectedFiles: listingSelectedFiles } = useSelectedFiles(
+ api,
+ system,
+ path
+ );
+ const publicationSelectedFiles = useSelectedFilesForSystem('tapis', system);
+ const selectedFiles = isEntityListing
+ ? publicationSelectedFiles
+ : listingSelectedFiles;
+
const rules = useMemo(
function () {
// Rules for which toolbar buttons are active for a given selection.
return {
canPreview:
selectedFiles.length === 1 && selectedFiles[0].type === 'file',
- canRename: user && selectedFiles.length === 1,
- canCopy: user && selectedFiles.length >= 1,
- canTrash: user && selectedFiles.length >= 1,
+ canRename:
+ user &&
+ selectedFiles.length === 1 &&
+ !isReadOnly &&
+ !selectedFiles[0].path.endsWith('.hazmapper'),
+ canCopy:
+ user &&
+ selectedFiles.length >= 1 &&
+ !selectedFiles[0].path.endsWith('.hazmapper'),
+ canTrash:
+ user &&
+ selectedFiles.length >= 1 &&
+ !isReadOnly &&
+ !selectedFiles[0].path.endsWith('.hazmapper'),
+ // Disable downloads from frontera.work until we have a non-flaky mount on ds-download.
+ canDownload:
+ selectedFiles.length >= 1 &&
+ system !== 'designsafe.storage.frontera.work' &&
+ !selectedFiles[0].path.endsWith('.hazmapper'),
};
},
- [selectedFiles, user]
+ [selectedFiles, isReadOnly, user, system]
);
return (
@@ -62,11 +127,28 @@ export const DatafilesToolbar: React.FC<{ searchInput?: React.ReactNode }> = ({
)}
-
+ {({ onClick }) => (
+
+
+ Move
+
+ )}
+
+
{({ onClick }) => (
= ({
)}
-
+
{({ onClick }) => (
= ({
Trash
+
+ {({ onClick }) => (
+
+
+ Download
+
+ )}
+
);
diff --git a/client/modules/datafiles/src/DatafilesToolbar/TrashButton.tsx b/client/modules/datafiles/src/DatafilesToolbar/TrashButton.tsx
index 1ddd578cf0..fdbfa6e8c5 100644
--- a/client/modules/datafiles/src/DatafilesToolbar/TrashButton.tsx
+++ b/client/modules/datafiles/src/DatafilesToolbar/TrashButton.tsx
@@ -1,6 +1,12 @@
import React, { useCallback } from 'react';
-import { useAuthenticatedUser, useTrash } from '@client/hooks';
+import {
+ useAuthenticatedUser,
+ useCheckFilesForAssociation,
+ useNotifyContext,
+ useTrash,
+} from '@client/hooks';
import { Button, ButtonProps, ConfigProvider } from 'antd';
+import { useParams } from 'react-router-dom';
interface TrashButtonProps{children}
- {children}
+ -
)} -
-
+ The selected file(s) are associated to one or more categories.
+ Please remove category associations before proceeding.
+
+ ),
+ placement: 'bottomLeft',
+ });
+ return;
+ }
+
const userUsername: string | undefined = user?.username;
let trashPath: string;
- if (typeof userUsername === 'string') {
+ if (typeof userUsername === 'string' && !system.startsWith('project-')) {
trashPath = userUsername + '/.Trash';
updateFilesPath(trashPath);
} else {
@@ -42,7 +75,12 @@ const TrashButton: React.FC