From cab8fbece33e9c6188b911552790f459c740f4cd Mon Sep 17 00:00:00 2001 From: Pawel Kowalczyk Date: Tue, 20 Nov 2018 12:22:04 +0100 Subject: [PATCH] advanced-tab-and-sample-git-start-for-repositories Feature #13865 Arvados-DCO-1.1-Signed-off-by: Pawel Kowalczyk --- src/store/advanced-tab/advanced-tab.ts | 70 +++++++++++------ .../context-menu/context-menu-actions.ts | 19 +++-- .../repositories/repositories-actions.ts | 10 ++- .../advanced-tab-dialog.tsx | 2 +- .../action-sets/repository-action-set.ts | 6 +- .../repositories-sample-git-dialog.tsx | 78 +++++++++++++++++++ .../rich-text-editor-dialog.tsx | 4 +- .../repositories-panel/repositories-panel.tsx | 18 +++-- src/views/workbench/workbench.tsx | 2 + 9 files changed, 164 insertions(+), 45 deletions(-) create mode 100644 src/views-components/repositories-sample-git-dialog/repositories-sample-git-dialog.tsx diff --git a/src/store/advanced-tab/advanced-tab.ts b/src/store/advanced-tab/advanced-tab.ts index ba0cf77d..d845c468 100644 --- a/src/store/advanced-tab/advanced-tab.ts +++ b/src/store/advanced-tab/advanced-tab.ts @@ -14,6 +14,7 @@ import { CollectionResource } from '~/models/collection'; import { ProjectResource } from '~/models/project'; import { ServiceRepository } from '~/services/services'; import { FilterBuilder } from '~/services/api/filter-builder'; +import { RepositoriesResource } from '~/models/repositories'; export const ADVANCED_TAB_DIALOG = 'advancedTabDialog'; @@ -46,34 +47,46 @@ enum ProjectData { DELETE_AT = 'delete_at' } -export const openAdvancedTabDialog = (uuid: string) => +enum RepositoryData { + REPOSITORY = 'repository', + CREATED_AT = 'created_at' +} + +export const openAdvancedTabDialog = (uuid: string, index?: number) => async (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => { const { resources } = getState(); const kind = extractUuidKind(uuid); const data = getResource(uuid)(resources); - const user = await services.userService.get(data.ownerUuid); - const metadata = await services.linkService.list({ - filters: new FilterBuilder() - .addEqual('headUuid', uuid) - .getFilters() - }); - if (data) { - if (kind === ResourceKind.COLLECTION) { - const dataCollection: AdvancedTabDialogData = advancedTabData(uuid, metadata, user, collectionApiResponse, data, CollectionData.COLLECTION, GroupContentsResourcePrefix.COLLECTION, CollectionData.STORAGE_CLASSES_CONFIRMED, data.storageClassesConfirmed); - dispatch(dialogActions.OPEN_DIALOG({ id: ADVANCED_TAB_DIALOG, data: dataCollection })); - } else if (kind === ResourceKind.PROCESS) { - const dataProcess: AdvancedTabDialogData = advancedTabData(uuid, metadata, user, containerRequestApiResponse, data, ProcessData.CONTAINER_REQUEST, GroupContentsResourcePrefix.PROCESS, ProcessData.OUTPUT_NAME, data.outputName); - dispatch(dialogActions.OPEN_DIALOG({ id: ADVANCED_TAB_DIALOG, data: dataProcess })); - } else if (kind === ResourceKind.PROJECT) { - const dataProject: AdvancedTabDialogData = advancedTabData(uuid, metadata, user, groupRequestApiResponse, data, ProjectData.GROUP, GroupContentsResourcePrefix.PROJECT, ProjectData.DELETE_AT, data.deleteAt); - dispatch(dialogActions.OPEN_DIALOG({ id: ADVANCED_TAB_DIALOG, data: dataProject })); + const repositoryData = getState().repositories.items[index!]; + if (data || repositoryData) { + if (data) { + const user = await services.userService.get(data.ownerUuid); + const metadata = await services.linkService.list({ + filters: new FilterBuilder() + .addEqual('headUuid', uuid) + .getFilters() + }); + if (kind === ResourceKind.COLLECTION) { + const dataCollection: AdvancedTabDialogData = advancedTabData(uuid, metadata, user, collectionApiResponse, data, CollectionData.COLLECTION, GroupContentsResourcePrefix.COLLECTION, CollectionData.STORAGE_CLASSES_CONFIRMED, data.storageClassesConfirmed); + dispatch(dialogActions.OPEN_DIALOG({ id: ADVANCED_TAB_DIALOG, data: dataCollection })); + } else if (kind === ResourceKind.PROCESS) { + const dataProcess: AdvancedTabDialogData = advancedTabData(uuid, metadata, user, containerRequestApiResponse, data, ProcessData.CONTAINER_REQUEST, GroupContentsResourcePrefix.PROCESS, ProcessData.OUTPUT_NAME, data.outputName); + dispatch(dialogActions.OPEN_DIALOG({ id: ADVANCED_TAB_DIALOG, data: dataProcess })); + } else if (kind === ResourceKind.PROJECT) { + const dataProject: AdvancedTabDialogData = advancedTabData(uuid, metadata, user, groupRequestApiResponse, data, ProjectData.GROUP, GroupContentsResourcePrefix.PROJECT, ProjectData.DELETE_AT, data.deleteAt); + dispatch(dialogActions.OPEN_DIALOG({ id: ADVANCED_TAB_DIALOG, data: dataProject })); + } + + } else if (kind === ResourceKind.REPOSITORY) { + const dataRepository: AdvancedTabDialogData = advancedTabData(uuid, '', '', repositoryApiResponse, repositoryData, RepositoryData.REPOSITORY, 'repositories', RepositoryData.CREATED_AT, repositoryData.createdAt); + dispatch(dialogActions.OPEN_DIALOG({ id: ADVANCED_TAB_DIALOG, data: dataRepository })); } } else { dispatch(snackbarActions.OPEN_SNACKBAR({ message: "Could not open advanced tab for this resource.", hideDuration: 2000, kind: SnackbarKind.ERROR })); } }; -const advancedTabData = (uuid: string, metadata: any, user: any, apiResponseKind: any, data: any, resourceKind: CollectionData | ProcessData | ProjectData, resourcePrefix: GroupContentsResourcePrefix, resourceKindProperty: CollectionData | ProcessData | ProjectData, property: any) => { +const advancedTabData = (uuid: string, metadata: any, user: any, apiResponseKind: any, data: any, resourceKind: CollectionData | ProcessData | ProjectData | RepositoryData, resourcePrefix: GroupContentsResourcePrefix | 'repositories', resourceKindProperty: CollectionData | ProcessData | ProjectData | RepositoryData, property: any) => { return { uuid, user, @@ -82,9 +95,9 @@ const advancedTabData = (uuid: string, metadata: any, user: any, apiResponseKind pythonHeader: pythonHeader(resourceKind), pythonExample: pythonExample(uuid, resourcePrefix), cliGetHeader: cliGetHeader(resourceKind), - cliGetExample: cliGetExample(uuid, resourcePrefix), + cliGetExample: cliGetExample(uuid, resourceKind), cliUpdateHeader: cliUpdateHeader(resourceKind, resourceKindProperty), - cliUpdateExample: cliUpdateExample(uuid, resourceKind, property, resourceKind), + cliUpdateExample: cliUpdateExample(uuid, resourceKind, property, resourceKindProperty), curlHeader: curlHeader(resourceKind, resourceKindProperty), curlExample: curlExample(uuid, resourcePrefix, property, resourceKind, resourceKindProperty), }; @@ -104,8 +117,8 @@ const pythonExample = (uuid: string, resourcePrefix: string) => { const cliGetHeader = (resourceKind: string) => `An example arv command to get a ${resourceKind} using its uuid:`; -const cliGetExample = (uuid: string, resourcePrefix: string) => { - const cliGetExample = `arv ${resourcePrefix} get \\ +const cliGetExample = (uuid: string, resourceKind: string) => { + const cliGetExample = `arv ${resourceKind} get \\ --uuid ${uuid}`; return cliGetExample; @@ -227,5 +240,18 @@ const groupRequestApiResponse = (apiResponse: ProjectResource) => { "delete_at": ${stringify(deleteAt)}, "properties": ${stringifyObject(properties)}`; + return response; +}; + +const repositoryApiResponse = (apiResponse: RepositoriesResource) => { + const { uuid, ownerUuid, createdAt, modifiedAt, modifiedByClientUuid, modifiedByUserUuid, name } = apiResponse; + const response = `"uuid": "${uuid}", +"owner_uuid": "${ownerUuid}", +"modified_by_client_uuid": ${stringify(modifiedByClientUuid)}, +"modified_by_user_uuid": ${stringify(modifiedByUserUuid)}, +"modified_at": ${stringify(modifiedAt)}, +"name": ${stringify(name)}, +"created_at": "${createdAt}"`; + return response; }; \ No newline at end of file diff --git a/src/store/context-menu/context-menu-actions.ts b/src/store/context-menu/context-menu-actions.ts index a59f376d..5a7a6018 100644 --- a/src/store/context-menu/context-menu-actions.ts +++ b/src/store/context-menu/context-menu-actions.ts @@ -13,6 +13,7 @@ import { UserResource } from '~/models/user'; import { isSidePanelTreeCategory } from '~/store/side-panel-tree/side-panel-tree-actions'; import { extractUuidKind, ResourceKind } from '~/models/resource'; import { Process } from '~/store/processes/process'; +import { RepositoriesResource } from '~/models/repositories'; export const contextMenuActions = unionize({ OPEN_CONTEXT_MENU: ofType<{ position: ContextMenuPosition, resource: ContextMenuResource }>(), @@ -29,6 +30,7 @@ export type ContextMenuResource = { kind: ResourceKind, menuKind: ContextMenuKind; isTrashed?: boolean; + index?: number }; export const isKeyboardClick = (event: React.MouseEvent) => event.nativeEvent.detail === 0; @@ -59,15 +61,16 @@ export const openCollectionFilesContextMenu = (event: React.MouseEvent) => +export const openRepositoryContextMenu = (event: React.MouseEvent, index: number, repository: RepositoriesResource) => (dispatch: Dispatch, getState: () => RootState) => { - dispatch(openContextMenu(event, { - name: '', - uuid: '', - ownerUuid: '', - kind: ResourceKind.REPOSITORY, - menuKind: ContextMenuKind.REPOSITORY - })); + dispatch(openContextMenu(event, { + name: '', + uuid: repository.uuid, + ownerUuid: repository.ownerUuid, + kind: ResourceKind.REPOSITORY, + menuKind: ContextMenuKind.REPOSITORY, + index + })); }; export const openRootProjectContextMenu = (event: React.MouseEvent, projectUuid: string) => diff --git a/src/store/repositories/repositories-actions.ts b/src/store/repositories/repositories-actions.ts index 7f953b82..2660f7ac 100644 --- a/src/store/repositories/repositories-actions.ts +++ b/src/store/repositories/repositories-actions.ts @@ -8,14 +8,22 @@ import { RootState } from '~/store/store'; import { ServiceRepository } from "~/services/services"; import { navigateToRepositories } from "~/store/navigation/navigation-action"; import { unionize, ofType, UnionOf } from "~/common/unionize"; +import { dialogActions } from '~/store/dialog/dialog-actions'; export const repositoriesActions = unionize({ SET_REPOSITORIES: ofType(), }); - export type RepositoriesActions = UnionOf; +export type RepositoriesActions = UnionOf; export const REPOSITORIES_PANEL = 'repositoriesPanel'; +export const REPOSITORIES_SAMPLE_GIT_NAME = 'repositoriesSampleGit'; + +export const openRepositoriesSampleGitDialog = () => + (dispatch: Dispatch, getState: () => RootState, services: ServiceRepository) => { + const uuidPrefix = getState().properties.uuidPrefix; + dispatch(dialogActions.OPEN_DIALOG({ id: REPOSITORIES_SAMPLE_GIT_NAME, data: { uuidPrefix } })); + }; const repositoriesBindedActions = bindDataExplorerActions(REPOSITORIES_PANEL); diff --git a/src/views-components/advanced-tab-dialog/advanced-tab-dialog.tsx b/src/views-components/advanced-tab-dialog/advanced-tab-dialog.tsx index 9a31a69e..8bce416d 100644 --- a/src/views-components/advanced-tab-dialog/advanced-tab-dialog.tsx +++ b/src/views-components/advanced-tab-dialog/advanced-tab-dialog.tsx @@ -78,7 +78,7 @@ export const AdvancedTabDialog = compose( {value === 0 &&
{dialogContentExample(apiResponse, classes)}
} - {value === 1 &&
{metadata.items.length > 0 ? : dialogContentHeader('(No metadata links found)')}
} + {value === 1 &&
{metadata !== '' && metadata.items.length > 0 ? : dialogContentHeader('(No metadata links found)')}
} {value === 2 && dialogContent(pythonHeader, pythonExample, classes)} {value === 3 &&
{dialogContent(cliGetHeader, cliGetExample, classes)} diff --git a/src/views-components/context-menu/action-sets/repository-action-set.ts b/src/views-components/context-menu/action-sets/repository-action-set.ts index 2f3a985f..1332a67b 100644 --- a/src/views-components/context-menu/action-sets/repository-action-set.ts +++ b/src/views-components/context-menu/action-sets/repository-action-set.ts @@ -5,6 +5,7 @@ import { ContextMenuActionSet } from "~/views-components/context-menu/context-menu-action-set"; import { AdvancedIcon, RemoveIcon, ShareIcon } from "~/components/icon/icon"; import { openFileRemoveDialog, openRenameFileDialog } from '~/store/collection-panel/collection-panel-files/collection-panel-files-actions'; +import { openAdvancedTabDialog } from "~/store/advanced-tab/advanced-tab"; export const repositoryActionSet: ContextMenuActionSet = [[{ name: "Attributes", @@ -22,10 +23,9 @@ export const repositoryActionSet: ContextMenuActionSet = [[{ name: "Advanced", icon: AdvancedIcon, execute: (dispatch, resource) => { - dispatch(openFileRemoveDialog(resource.uuid)); + dispatch(openAdvancedTabDialog(resource.uuid, resource.index)); } -}, -{ +}, { name: "Remove", icon: RemoveIcon, execute: (dispatch, resource) => { diff --git a/src/views-components/repositories-sample-git-dialog/repositories-sample-git-dialog.tsx b/src/views-components/repositories-sample-git-dialog/repositories-sample-git-dialog.tsx new file mode 100644 index 00000000..0941b53e --- /dev/null +++ b/src/views-components/repositories-sample-git-dialog/repositories-sample-git-dialog.tsx @@ -0,0 +1,78 @@ +// Copyright (C) The Arvados Authors. All rights reserved. +// +// SPDX-License-Identifier: AGPL-3.0 + +import * as React from "react"; +import { Dialog, DialogTitle, DialogContent, DialogActions, Button, Typography } from "@material-ui/core"; +import { WithDialogProps } from "~/store/dialog/with-dialog"; +import { withDialog } from '~/store/dialog/with-dialog'; +import { REPOSITORIES_SAMPLE_GIT_NAME } from "~/store/repositories/repositories-actions"; +import { DefaultCodeSnippet } from '~/components/default-code-snippet/default-code-snippet'; +import { StyleRulesCallback, WithStyles, withStyles } from '@material-ui/core/styles'; +import { ArvadosTheme } from '~/common/custom-theme'; +import { compose } from "redux"; + +type CssRules = 'codeSnippet' | 'link' | 'spacing'; + +const styles: StyleRulesCallback = (theme: ArvadosTheme) => ({ + codeSnippet: { + borderRadius: theme.spacing.unit * 0.5, + border: '1px solid', + borderColor: theme.palette.grey["400"], + }, + link: { + textDecoration: 'none', + color: theme.palette.primary.main, + "&:hover": { + color: theme.palette.primary.dark, + transition: 'all 0.5s ease' + } + }, + spacing: { + paddingTop: theme.spacing.unit * 2 + } +}); + +interface RepositoriesSampleGitDataProps { + uuidPrefix: string; +} + +type RepositoriesSampleGitProps = RepositoriesSampleGitDataProps & WithStyles; + +export const RepositoriesSampleGitDialog = compose( + withDialog(REPOSITORIES_SAMPLE_GIT_NAME), + withStyles(styles))( + (props: WithDialogProps & RepositoriesSampleGitProps) => + + Sample git quick start: + + + + See also: + + + + + + + + + ); + +const snippetText = (uuidPrefix: string) => `git clone git@git.${uuidPrefix}.arvadosapi.com:arvados.git +cd arvados +# edit files +git add the/files/you/changed +git commit +git push +`; diff --git a/src/views-components/rich-text-editor-dialog/rich-text-editor-dialog.tsx b/src/views-components/rich-text-editor-dialog/rich-text-editor-dialog.tsx index a9973554..86422baf 100644 --- a/src/views-components/rich-text-editor-dialog/rich-text-editor-dialog.tsx +++ b/src/views-components/rich-text-editor-dialog/rich-text-editor-dialog.tsx @@ -3,8 +3,8 @@ // SPDX-License-Identifier: AGPL-3.0 import * as React from "react"; -import { Dialog, DialogTitle, DialogContent, DialogActions, Button, DialogContentText } from "@material-ui/core"; -import { WithDialogProps } from "../../store/dialog/with-dialog"; +import { Dialog, DialogTitle, DialogContent, DialogActions, Button } from "@material-ui/core"; +import { WithDialogProps } from "~/store/dialog/with-dialog"; import { withDialog } from '~/store/dialog/with-dialog'; import { RICH_TEXT_EDITOR_DIALOG_NAME } from "~/store/rich-text-editor-dialog/rich-text-editor-dialog-actions"; import RichTextEditor from 'react-rte'; diff --git a/src/views/repositories-panel/repositories-panel.tsx b/src/views/repositories-panel/repositories-panel.tsx index 3d2d32c0..cafbefd2 100644 --- a/src/views/repositories-panel/repositories-panel.tsx +++ b/src/views/repositories-panel/repositories-panel.tsx @@ -11,7 +11,7 @@ import { Link } from 'react-router-dom'; import { Dispatch, compose } from 'redux'; import { RootState } from '~/store/store'; import { HelpIcon, AddIcon, MoreOptionsIcon } from '~/components/icon/icon'; -import { loadRepositoriesData } from '~/store/repositories/repositories-actions'; +import { loadRepositoriesData, openRepositoriesSampleGitDialog } from '~/store/repositories/repositories-actions'; import { RepositoriesResource } from '~/models/repositories'; import { openRepositoryContextMenu } from '~/store/context-menu/context-menu-actions'; @@ -63,16 +63,18 @@ const mapStateToProps = (state: RootState) => { }; }; -const mapDispatchToProps = (dispatch: Dispatch): Pick => ({ +const mapDispatchToProps = (dispatch: Dispatch): Pick => ({ loadRepositories: () => dispatch(loadRepositoriesData()), - onOptionsMenuOpen: (event) => { - dispatch(openRepositoryContextMenu(event)); + onOptionsMenuOpen: (event, index, repository) => { + dispatch(openRepositoryContextMenu(event, index, repository)); }, + openRepositoriesSampleGitDialog: () => dispatch(openRepositoriesSampleGitDialog()) }); interface RepositoriesActionProps { loadRepositories: () => void; - onOptionsMenuOpen: (event: React.MouseEvent) => void; + onOptionsMenuOpen: (event: React.MouseEvent, index: number, repository: RepositoriesResource) => void; + openRepositoriesSampleGitDialog: () => void; } interface RepositoriesDataProps { @@ -90,7 +92,7 @@ export const RepositoriesPanel = compose( this.props.loadRepositories(); } render() { - const { classes, repositories, onOptionsMenuOpen } = this.props; + const { classes, repositories, onOptionsMenuOpen, openRepositoriesSampleGitDialog } = this.props; console.log(repositories); return ( @@ -111,7 +113,7 @@ export const RepositoriesPanel = compose(
- + @@ -133,7 +135,7 @@ export const RepositoriesPanel = compose( {repository.cloneUrls.join("\n")} - + onOptionsMenuOpen(event, index, repository)} className={classes.moreOptionsButton}> diff --git a/src/views/workbench/workbench.tsx b/src/views/workbench/workbench.tsx index d0509d0a..c9bcd91b 100644 --- a/src/views/workbench/workbench.tsx +++ b/src/views/workbench/workbench.tsx @@ -49,6 +49,7 @@ import { AdvancedTabDialog } from '~/views-components/advanced-tab-dialog/advanc import { ProcessInputDialog } from '~/views-components/process-input-dialog/process-input-dialog'; import { ProjectPropertiesDialog } from '~/views-components/project-properties-dialog/project-properties-dialog'; import { RepositoriesPanel } from '~/views/repositories-panel/repositories-panel'; +import { RepositoriesSampleGitDialog } from '~/views-components/repositories-sample-git-dialog/repositories-sample-git-dialog'; type CssRules = 'root' | 'container' | 'splitter' | 'asidePanel' | 'contentWrapper' | 'content'; @@ -147,6 +148,7 @@ export const WorkbenchPanel = + -- 2.30.2