diff --git a/frontend/package.json b/frontend/package.json index fe37789a8..90345afa5 100644 --- a/frontend/package.json +++ b/frontend/package.json @@ -8,8 +8,8 @@ "build": "react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject", - "lint": "node_modules/.bin/eslint --ext js src", - "lint-fix": "node_modules/.bin/eslint --fix --ext js src" + "lint": "npx eslint --ext js src", + "lint-fix": "npx eslint --fix --ext js src" }, "dependencies": { "@apollo/client": "^3.3.19", @@ -64,13 +64,25 @@ }, "devDependencies": { "env-cmd": "^10.1.0", - "prettier": "^2.6.1" + "eslint-config-prettier": "^8.8.0", + "eslint-plugin-prettier": "^4.2.1", + "prettier": "2.8.7" }, "eslintConfig": { + "plugins": [ + "prettier" + ], "extends": [ "react-app", - "react-app/jest" - ] + "react-app/jest", + "plugin:prettier/recommended" + ], + "rules": { + "no-unused-vars": "error", + "no-const-assign": "error", + "eqeqeq": "error", + "no-console": "warn" + } }, "browserslist": { "production": [ diff --git a/frontend/src/api/DataPipeline/createDataPipelineEnvironment.js b/frontend/src/api/DataPipeline/createDataPipelineEnvironment.js index 103cbe098..ba9ef0de4 100644 --- a/frontend/src/api/DataPipeline/createDataPipelineEnvironment.js +++ b/frontend/src/api/DataPipeline/createDataPipelineEnvironment.js @@ -5,7 +5,9 @@ const createDataPipelineEnvironment = ({ input }) => ({ input }, mutation: gql` - mutation createDataPipelineEnvironment($input: NewDataPipelineEnvironmentInput) { + mutation createDataPipelineEnvironment( + $input: NewDataPipelineEnvironmentInput + ) { createDataPipelineEnvironment(input: $input) { envPipelineUri environmentUri diff --git a/frontend/src/api/DataPipeline/deleteDataPipelineEnvironment.js b/frontend/src/api/DataPipeline/deleteDataPipelineEnvironment.js index 732d718c9..417b99075 100644 --- a/frontend/src/api/DataPipeline/deleteDataPipelineEnvironment.js +++ b/frontend/src/api/DataPipeline/deleteDataPipelineEnvironment.js @@ -5,12 +5,8 @@ const deleteDataPipelineEnvironment = ({ envPipelineUri }) => ({ envPipelineUri }, mutation: gql` - mutation deleteDataPipelineEnvironment( - $envPipelineUri: String! - ) { - deleteDataPipelineEnvironment( - envPipelineUri: $envPipelineUri - ) + mutation deleteDataPipelineEnvironment($envPipelineUri: String!) { + deleteDataPipelineEnvironment(envPipelineUri: $envPipelineUri) } ` }); diff --git a/frontend/src/api/DataPipeline/getDataPipelineEnvironment.js b/frontend/src/api/DataPipeline/getDataPipelineEnvironment.js index 2289fb15b..7e1a236ca 100644 --- a/frontend/src/api/DataPipeline/getDataPipelineEnvironment.js +++ b/frontend/src/api/DataPipeline/getDataPipelineEnvironment.js @@ -7,7 +7,7 @@ const getDataPipelineEnvironment = (envPipelineUri) => ({ query: gql` query getDataPipelineEnvironment($envPipelineUri: String!) { getDataPipelineEnvironment(envPipelineUri: $envPipelineUri) { - envPipelineUri + envPipelineUri environmentUri environmentLabel pipelineUri diff --git a/frontend/src/api/DataPipeline/updateDataPipelineEnvironment.js b/frontend/src/api/DataPipeline/updateDataPipelineEnvironment.js index 7ea5ae26a..28ae9eff1 100644 --- a/frontend/src/api/DataPipeline/updateDataPipelineEnvironment.js +++ b/frontend/src/api/DataPipeline/updateDataPipelineEnvironment.js @@ -5,7 +5,9 @@ const updateDataPipelineEnvironment = ({ input }) => ({ input }, mutation: gql` - mutation updateDataPipelineEnvironment($input: NewDataPipelineEnvironmentInput) { + mutation updateDataPipelineEnvironment( + $input: NewDataPipelineEnvironmentInput + ) { updateDataPipelineEnvironment(input: $input) { envPipelineUri environmentUri diff --git a/frontend/src/api/Dataset/createDataset.js b/frontend/src/api/Dataset/createDataset.js index 011afef8e..82e2b30b2 100644 --- a/frontend/src/api/Dataset/createDataset.js +++ b/frontend/src/api/Dataset/createDataset.js @@ -1,7 +1,6 @@ import { gql } from 'apollo-boost'; const createDataset = (input) => { - console.log('rcv', input); return { variables: { input diff --git a/frontend/src/api/Dataset/updateDataset.js b/frontend/src/api/Dataset/updateDataset.js index a77e603de..f35a9cc14 100644 --- a/frontend/src/api/Dataset/updateDataset.js +++ b/frontend/src/api/Dataset/updateDataset.js @@ -1,7 +1,6 @@ import { gql } from 'apollo-boost'; const updateDataset = ({ datasetUri, input }) => { - console.log('rcv', datasetUri, input); return { variables: { datasetUri, diff --git a/frontend/src/api/DatasetTable/getSharedDatasetTables.js b/frontend/src/api/DatasetTable/getSharedDatasetTables.js index 62a5a032b..82c8b68a2 100644 --- a/frontend/src/api/DatasetTable/getSharedDatasetTables.js +++ b/frontend/src/api/DatasetTable/getSharedDatasetTables.js @@ -7,10 +7,10 @@ const getSharedDatasetTables = ({ datasetUri, envUri }) => ({ }, query: gql` query GetSharedDatasetTables($datasetUri: String!, $envUri: String!) { - getSharedDatasetTables(datasetUri: $datasetUri, envUri: $envUri) { - tableUri - GlueTableName - } + getSharedDatasetTables(datasetUri: $datasetUri, envUri: $envUri) { + tableUri + GlueTableName + } } ` }); diff --git a/frontend/src/api/Environment/addConsumptionRoleToEnvironment.js b/frontend/src/api/Environment/addConsumptionRoleToEnvironment.js index fb41386bc..c9595b8bd 100644 --- a/frontend/src/api/Environment/addConsumptionRoleToEnvironment.js +++ b/frontend/src/api/Environment/addConsumptionRoleToEnvironment.js @@ -5,7 +5,9 @@ const addConsumptionRoleToEnvironment = (input) => ({ input }, mutation: gql` - mutation addConsumptionRoleToEnvironment($input: AddConsumptionRoleToEnvironmentInput!) { + mutation addConsumptionRoleToEnvironment( + $input: AddConsumptionRoleToEnvironmentInput! + ) { addConsumptionRoleToEnvironment(input: $input) { consumptionRoleUri consumptionRoleName diff --git a/frontend/src/api/Environment/listDataItemsSharedWithEnvGroup.js b/frontend/src/api/Environment/listDataItemsSharedWithEnvGroup.js index 2297bab75..00f019c19 100644 --- a/frontend/src/api/Environment/listDataItemsSharedWithEnvGroup.js +++ b/frontend/src/api/Environment/listDataItemsSharedWithEnvGroup.js @@ -1,6 +1,10 @@ import { gql } from 'apollo-boost'; -const listDataItemsSharedWithEnvGroup = ({ filter, environmentUri, groupUri }) => ({ +const listDataItemsSharedWithEnvGroup = ({ + filter, + environmentUri, + groupUri +}) => ({ variables: { environmentUri, groupUri, diff --git a/frontend/src/api/Environment/removeConsumptionRole.js b/frontend/src/api/Environment/removeConsumptionRole.js index 3a26a64f7..03d5fbf47 100644 --- a/frontend/src/api/Environment/removeConsumptionRole.js +++ b/frontend/src/api/Environment/removeConsumptionRole.js @@ -1,6 +1,9 @@ import { gql } from 'apollo-boost'; -const removeConsumptionRoleFromEnvironment = ({ environmentUri, consumptionRoleUri }) => ({ +const removeConsumptionRoleFromEnvironment = ({ + environmentUri, + consumptionRoleUri +}) => ({ variables: { environmentUri, consumptionRoleUri diff --git a/frontend/src/api/Groups/listCognitoGroups.js b/frontend/src/api/Groups/listCognitoGroups.js index 49d473a50..3f4cfc5c8 100644 --- a/frontend/src/api/Groups/listCognitoGroups.js +++ b/frontend/src/api/Groups/listCognitoGroups.js @@ -5,12 +5,8 @@ const listCognitoGroups = ({ filter }) => ({ filter }, query: gql` - query listCognitoGroups ( - $filter: CognitoGroupFilter - ) { - listCognitoGroups ( - filter: $filter - ){ + query listCognitoGroups($filter: CognitoGroupFilter) { + listCognitoGroups(filter: $filter) { groupName } } diff --git a/frontend/src/api/Organization/listOrganizationUsers.js b/frontend/src/api/Organization/listOrganizationUsers.js index b1982ea88..26f513aba 100644 --- a/frontend/src/api/Organization/listOrganizationUsers.js +++ b/frontend/src/api/Organization/listOrganizationUsers.js @@ -1,7 +1,6 @@ import { gql } from 'apollo-boost'; const listOrganizationUsers = ({ filter, organizationUri }) => { - console.log('listOrganizationUsers'); return { variables: { organizationUri, diff --git a/frontend/src/api/ShareObject/addSharedItem.js b/frontend/src/api/ShareObject/addSharedItem.js index 8c12845cd..feea53c91 100644 --- a/frontend/src/api/ShareObject/addSharedItem.js +++ b/frontend/src/api/ShareObject/addSharedItem.js @@ -1,7 +1,6 @@ import { gql } from 'apollo-boost'; const addSharedItem = ({ shareUri, input }) => { - console.log('rcv', input); return { variables: { shareUri, diff --git a/frontend/src/api/ShareObject/createShareObject.js b/frontend/src/api/ShareObject/createShareObject.js index ee2d66352..40a2d9927 100644 --- a/frontend/src/api/ShareObject/createShareObject.js +++ b/frontend/src/api/ShareObject/createShareObject.js @@ -1,7 +1,6 @@ import { gql } from 'apollo-boost'; const createShareObject = ({ datasetUri, itemUri, itemType, input }) => { - console.log('rcv', input); return { variables: { datasetUri, diff --git a/frontend/src/api/Tenant/createQuicksightDataSourceSet.js b/frontend/src/api/Tenant/createQuicksightDataSourceSet.js index f7be6e031..e561aa84f 100644 --- a/frontend/src/api/Tenant/createQuicksightDataSourceSet.js +++ b/frontend/src/api/Tenant/createQuicksightDataSourceSet.js @@ -1,11 +1,11 @@ import { gql } from 'apollo-boost'; -const createQuicksightDataSourceSet = ({vpcConnectionId}) => ({ +const createQuicksightDataSourceSet = ({ vpcConnectionId }) => ({ variables: { vpcConnectionId }, mutation: gql` - mutation createQuicksightDataSourceSet ($vpcConnectionId: String!) { + mutation createQuicksightDataSourceSet($vpcConnectionId: String!) { createQuicksightDataSourceSet(vpcConnectionId: $vpcConnectionId) } ` diff --git a/frontend/src/api/Tenant/getPlatformAuthorSession.js b/frontend/src/api/Tenant/getPlatformAuthorSession.js index c2b7728ac..633acfcde 100644 --- a/frontend/src/api/Tenant/getPlatformAuthorSession.js +++ b/frontend/src/api/Tenant/getPlatformAuthorSession.js @@ -6,9 +6,7 @@ const getPlatformAuthorSession = (awsAccount) => ({ }, query: gql` query getPlatformAuthorSession($awsAccount: String) { - getPlatformAuthorSession( - awsAccount: $awsAccount - ) + getPlatformAuthorSession(awsAccount: $awsAccount) } ` }); diff --git a/frontend/src/api/Tenant/updateSSMParameter.js b/frontend/src/api/Tenant/updateSSMParameter.js index 731c3465f..41ce0f515 100644 --- a/frontend/src/api/Tenant/updateSSMParameter.js +++ b/frontend/src/api/Tenant/updateSSMParameter.js @@ -1,12 +1,12 @@ import { gql } from 'apollo-boost'; -const updateSSMParameter = ({name,value}) => ({ +const updateSSMParameter = ({ name, value }) => ({ variables: { name, value }, mutation: gql` - mutation updateSSMParameter ($name: String!, $value: String!) { + mutation updateSSMParameter($name: String!, $value: String!) { updateSSMParameter(name: $name, value: $value) } ` diff --git a/frontend/src/api/Worksheet/runAthenaSqlQuery.js b/frontend/src/api/Worksheet/runAthenaSqlQuery.js index 8c69c3b93..497ef53d4 100644 --- a/frontend/src/api/Worksheet/runAthenaSqlQuery.js +++ b/frontend/src/api/Worksheet/runAthenaSqlQuery.js @@ -7,8 +7,16 @@ const runAthenaSqlQuery = ({ sqlQuery, environmentUri, worksheetUri }) => ({ worksheetUri }, query: gql` - query runAthenaSqlQuery($environmentUri: String!, $worksheetUri: String!, $sqlQuery: String!) { - runAthenaSqlQuery(environmentUri: $environmentUri, worksheetUri: $worksheetUri, sqlQuery: $sqlQuery) { + query runAthenaSqlQuery( + $environmentUri: String! + $worksheetUri: String! + $sqlQuery: String! + ) { + runAthenaSqlQuery( + environmentUri: $environmentUri + worksheetUri: $worksheetUri + sqlQuery: $sqlQuery + ) { rows { cells { columnName diff --git a/frontend/src/components/ShareStatus.js b/frontend/src/components/ShareStatus.js index 44196555c..a1d4b9afd 100644 --- a/frontend/src/components/ShareStatus.js +++ b/frontend/src/components/ShareStatus.js @@ -4,8 +4,25 @@ import Label from './Label'; const ShareStatus = (props) => { const { status } = props; const setTagColor = () => { - if (['Approved', 'Share_Approved', 'Revoke_Approved', 'Share_Succeeded', 'Revoke_Succeeded'].includes(status)) return 'success'; - if (['Rejected', 'Revoked', 'Share_Rejected', 'Share_Failed', 'Revoke_Failed'].includes(status)) + if ( + [ + 'Approved', + 'Share_Approved', + 'Revoke_Approved', + 'Share_Succeeded', + 'Revoke_Succeeded' + ].includes(status) + ) + return 'success'; + if ( + [ + 'Rejected', + 'Revoked', + 'Share_Rejected', + 'Share_Failed', + 'Revoke_Failed' + ].includes(status) + ) return 'error'; if (['PendingApproval', 'Submitted'].includes(status)) return 'warning'; return 'info'; diff --git a/frontend/src/components/popovers/NotificationsPopover.js b/frontend/src/components/popovers/NotificationsPopover.js index 273133cfe..24bd19464 100644 --- a/frontend/src/components/popovers/NotificationsPopover.js +++ b/frontend/src/components/popovers/NotificationsPopover.js @@ -1,4 +1,4 @@ -import {useCallback, useEffect, useRef, useState} from 'react'; +import { useCallback, useEffect, useRef, useState } from 'react'; import { Avatar, Badge, @@ -21,7 +21,6 @@ import markNotificationAsRead from '../../api/Notification/markAsRead'; import BellIcon from '../../icons/Bell'; import useClient from '../../hooks/useClient'; import * as Defaults from '../defaults'; -import { PagedResponseDefault } from '../defaults'; const NotificationsPopover = () => { const anchorRef = useRef(null); @@ -47,50 +46,55 @@ const NotificationsPopover = () => { fetchItems({ unread: true }); } setLoading(false); - },[client]); - - const fetchItems = useCallback(async (notificationFilter) => { - setLoading(true); - let filter = Object.assign({}, Defaults.SelectListFilter, notificationFilter) - const response = await client.query( - listNotifications(filter) - ); - if (!response.errors) { - setNotifications(response.data.listNotifications.nodes); - } - setLoading(false); - },[client]); + }, [client]); + const fetchItems = useCallback( + async (notificationFilter) => { + setLoading(true); + let filter = Object.assign( + {}, + Defaults.SelectListFilter, + notificationFilter + ); + const response = await client.query(listNotifications(filter)); + if (!response.errors) { + setNotifications(response.data.listNotifications.nodes); + } + setLoading(false); + }, + [client] + ); - const markAsRead = useCallback(async (notificationUri) => { - const response = await client.mutate( - markNotificationAsRead(notificationUri) - ); - },[client]); + const markAsRead = useCallback( + async (notificationUri) => { + await client.mutate(markNotificationAsRead(notificationUri)); + }, + [client] + ); const handleRemoveNotification = (idx) => { - let notificiationUri = notifications[idx].notificationUri + let notificiationUri = notifications[idx].notificationUri; setNotifications((prevstate) => { const rows = [...prevstate]; rows.splice(idx, 1); return rows; }); - setCountInbox(countInbox - 1) - markAsRead(notificiationUri) + setCountInbox(countInbox - 1); + markAsRead(notificiationUri); }; const clearNotifications = (idx) => { - let readNotifications = notifications - setNotifications([]) - setCountInbox(0) - readNotifications.forEach(note => { - markAsRead(note.notificationUri) + let readNotifications = notifications; + setNotifications([]); + setCountInbox(0); + readNotifications.forEach((note) => { + markAsRead(note.notificationUri); }); }; useEffect(() => { if (client) { - getCountInbox() + getCountInbox(); } }, [client]); @@ -162,13 +166,13 @@ const NotificationsPopover = () => { } /> - { - handleRemoveNotification(idx); - }} - > - - + { + handleRemoveNotification(idx); + }} + > + + ))} diff --git a/frontend/src/contexts/AmplifyContext.js b/frontend/src/contexts/AmplifyContext.js index 873a09f6e..c9f722227 100644 --- a/frontend/src/contexts/AmplifyContext.js +++ b/frontend/src/contexts/AmplifyContext.js @@ -114,7 +114,7 @@ export const AuthProvider = (props) => { }); }) .catch((e) => { - console.log('Failed to authenticate user', e); + console.error('Failed to authenticate user', e); }); }; diff --git a/frontend/src/hooks/useToken.js b/frontend/src/hooks/useToken.js index 3bfed84c5..dc2ec566d 100644 --- a/frontend/src/hooks/useToken.js +++ b/frontend/src/hooks/useToken.js @@ -2,7 +2,7 @@ import { useEffect, useState } from 'react'; import { Auth } from 'aws-amplify'; import { SET_ERROR } from '../store/errorReducer'; import { useDispatch } from '../store'; -import useAuth from "./useAuth"; +import useAuth from './useAuth'; const useToken = () => { const dispatch = useDispatch(); diff --git a/frontend/src/serviceWorker.js b/frontend/src/serviceWorker.js index 6a6d3dcb2..892e72c70 100644 --- a/frontend/src/serviceWorker.js +++ b/frontend/src/serviceWorker.js @@ -125,9 +125,7 @@ function checkValidServiceWorker(swUrl, config) { } }) .catch(() => { - console.log( - 'No internet connection found. App is running in offline mode.' - ); + console.log( 'No internet connection found. App is running in offline mode.' ); }); } diff --git a/frontend/src/views/Administration/AdministrationView.js b/frontend/src/views/Administration/AdministrationView.js index db2be01a3..063b3fc86 100644 --- a/frontend/src/views/Administration/AdministrationView.js +++ b/frontend/src/views/Administration/AdministrationView.js @@ -15,10 +15,12 @@ import { import useSettings from '../../hooks/useSettings'; import ChevronRightIcon from '../../icons/ChevronRight'; import AdministrationTeams from './AdministrationTeams'; -import DashboardViewer from './AdministratorDashboardViewer' +import DashboardViewer from './AdministratorDashboardViewer'; - -const tabs = [{ label: 'Teams', value: 'teams' },{ label: 'Monitoring', value: 'dashboard' }]; +const tabs = [ + { label: 'Teams', value: 'teams' }, + { label: 'Monitoring', value: 'dashboard' } +]; const AdministrationView = () => { const { settings } = useSettings(); @@ -98,4 +100,3 @@ const AdministrationView = () => { }; export default AdministrationView; - diff --git a/frontend/src/views/Administration/AdministratorDashboardViewer.js b/frontend/src/views/Administration/AdministratorDashboardViewer.js index 196738482..f25ffc6a6 100644 --- a/frontend/src/views/Administration/AdministratorDashboardViewer.js +++ b/frontend/src/views/Administration/AdministratorDashboardViewer.js @@ -11,13 +11,13 @@ import { Container, Divider, TextField, - Typography, + Typography } from '@mui/material'; import { AddOutlined, ArrowRightAlt } from '@mui/icons-material'; import { LoadingButton } from '@mui/lab'; import getMonitoringDashboardId from '../../api/Tenant/getMonitoringDashboardId'; import getMonitoringVPCConnectionId from '../../api/Tenant/getMonitoringVPCConnectionId'; -import updateSSMParameter from "../../api/Tenant/updateSSMParameter"; +import updateSSMParameter from '../../api/Tenant/updateSSMParameter'; import getTrustAccount from '../../api/Environment/getTrustAccount'; import createQuicksightDataSourceSet from '../../api/Tenant/createQuicksightDataSourceSet'; import getPlatformAuthorSession from '../../api/Tenant/getPlatformAuthorSession'; @@ -50,7 +50,7 @@ const DashboardViewer = () => { } }, [client, dispatch]); - const fetchMonitoringVPCConnectionId = useCallback( async () => { + const fetchMonitoringVPCConnectionId = useCallback(async () => { const response = await client.query(getMonitoringVPCConnectionId()); if (!response.errors) { setVpcConnectionId(response.data.getMonitoringVPCConnectionId); @@ -59,14 +59,16 @@ const DashboardViewer = () => { } }, [client, dispatch]); - const fetchMonitoringDashboardId = useCallback( async () => { + const fetchMonitoringDashboardId = useCallback(async () => { const response = await client.query(getMonitoringDashboardId()); if (!response.errors) { setDashboardId(response.data.getMonitoringDashboardId); - if (response.data.getMonitoringDashboardId !== "updateme"){ - const resp = await client.query(getPlatformReaderSession(response.data.getMonitoringDashboardId)); - if (!resp.errors){ - setSessionUrl(resp.data.getPlatformReaderSession) + if (response.data.getMonitoringDashboardId !== 'updateme') { + const resp = await client.query( + getPlatformReaderSession(response.data.getMonitoringDashboardId) + ); + if (!resp.errors) { + setSessionUrl(resp.data.getPlatformReaderSession); const options = { url: resp.data.getPlatformReaderSession, scrolling: 'no', @@ -80,7 +82,7 @@ const DashboardViewer = () => { container: dashboardRef.current }; QuickSightEmbedding.embedDashboard(options); - }else{ + } else { dispatch({ type: SET_ERROR, error: resp.errors[0].message }); } } @@ -101,16 +103,24 @@ const DashboardViewer = () => { dispatch({ type: SET_ERROR, error: e.message }) ); } - }, [client, dispatch,fetchMonitoringDashboardId, fetchMonitoringVPCConnectionId, fetchTrustedAccount]); + }, [ + client, + dispatch, + fetchMonitoringDashboardId, + fetchMonitoringVPCConnectionId, + fetchTrustedAccount + ]); - async function submitVpc(values, setStatus, setSubmitting, setErrors){ + async function submitVpc(values, setStatus, setSubmitting, setErrors) { try { - setVpcConnectionId(values.vpc) - const response = await client.mutate(updateSSMParameter({name:"VPCConnectionId", value:values.vpc})); + setVpcConnectionId(values.vpc); + const response = await client.mutate( + updateSSMParameter({ name: 'VPCConnectionId', value: values.vpc }) + ); if (!response.errors) { - setStatus({success: true}); + setStatus({ success: true }); setSubmitting(false); - }else{ + } else { dispatch({ type: SET_ERROR, error: response.errors[0].message }); } } catch (err) { @@ -120,18 +130,20 @@ const DashboardViewer = () => { setSubmitting(false); dispatch({ type: SET_ERROR, error: err.message }); } - }; + } - async function submitDash(values, setStatus, setSubmitting, setErrors){ + async function submitDash(values, setStatus, setSubmitting, setErrors) { try { - setDashboardId(values.dash) - const response = await client.mutate(updateSSMParameter({name:"DashboardId", value:values.dash})); + setDashboardId(values.dash); + const response = await client.mutate( + updateSSMParameter({ name: 'DashboardId', value: values.dash }) + ); if (!response.errors) { - setStatus({success: true}); + setStatus({ success: true }); setSubmitting(false); const resp = await client.query(getPlatformReaderSession(values.dash)); - if (!resp.errors){ - setSessionUrl(resp.data.getPlatformReaderSession) + if (!resp.errors) { + setSessionUrl(resp.data.getPlatformReaderSession); const options = { url: resp.data.getPlatformReaderSession, scrolling: 'no', @@ -145,10 +157,10 @@ const DashboardViewer = () => { container: dashboardRef.current }; QuickSightEmbedding.embedDashboard(options); - }else{ + } else { dispatch({ type: SET_ERROR, error: resp.errors[0].message }); } - }else{ + } else { dispatch({ type: SET_ERROR, error: response.errors[0].message }); } } catch (err) { @@ -158,20 +170,24 @@ const DashboardViewer = () => { setSubmitting(false); dispatch({ type: SET_ERROR, error: err.message }); } - }; + } - async function createQuicksightdata () { - setIsCreatingDataSource(true) - const response = await client.mutate(createQuicksightDataSourceSet({vpcConnectionId})); + async function createQuicksightdata() { + setIsCreatingDataSource(true); + const response = await client.mutate( + createQuicksightDataSourceSet({ vpcConnectionId }) + ); if (response.errors) { dispatch({ type: SET_ERROR, error: response.errors[0].message }); } - setIsCreatingDataSource(false) + setIsCreatingDataSource(false); } const startAuthorSession = async () => { setIsOpeningSession(true); - const response = await client.query(getPlatformAuthorSession(trustedAccount)); + const response = await client.query( + getPlatformAuthorSession(trustedAccount) + ); if (!response.errors) { window.open(response.data.getPlatformAuthorSession, '_blank'); } else { @@ -180,230 +196,254 @@ const DashboardViewer = () => { setIsOpeningSession(false); }; - return ( - - - - - - - - - 1. Enable Quicksight Enterprise Edition in AWS Account = {trustedAccount}. Check the user guide for more details. - - - - - 2. Create a VPC Connection between Quicksight and RDS VPC. Check the user guide for more details. - - - - - - - - - - - - - - 3. Introduce or Update the VPC Connection ID value in the following box: - - - - - { - await submitVpc(values, setStatus, setSubmitting, setErrors); - }} - > - {({ - errors, - handleBlur, - handleChange, - handleSubmit, - isSubmitting, - setFieldValue, - touched, - values - }) => ( -
- - - - - - - Save - - - -
- )} - - - - - - - - 4. Click on the button to automatically create the data source connecting our RDS Aurora database with Quicksight - - - - - } - sx={{ mt: 1, mb: 2, ml: 2 }} - variant="outlined" - onClick={() => { - createQuicksightdata().catch((e) => - dispatch({ type: SET_ERROR, error: e.message }) - ); - }} - > - Create Quicksight data source - - - - - - - - - - - - - - - - 5. Go to Quicksight to build your Analysis and publish a Dashboard. Check the user guide for more details. - - - - - } - variant="outlined" - onClick={startAuthorSession} - sx={{ mt: 1, mb: 2, ml: 2 }} - > - Start Quicksight session - - - - - - - - 6. Introduce or update your Dashboard ID - - - - - { - await submitDash(values, setStatus, setSubmitting, setErrors); - }} - > - {({ - errors, - handleBlur, - handleChange, - handleSubmit, - isSubmitting, - setFieldValue, - touched, - values - }) => ( -
- - - - - - - Save - - - -
- )} - - - - - - - - - - -
- - - - + + + + + + + + + 1. Enable Quicksight Enterprise Edition in AWS Account ={' '} + {trustedAccount}. Check the user guide for more details. + + + + + 2. Create a VPC Connection between Quicksight and RDS VPC. + Check the user guide for more details. + + + + + + + + + + + + + + 3. Introduce or Update the VPC Connection ID value in the + following box: + + + + + { + await submitVpc( + values, + setStatus, + setSubmitting, + setErrors + ); + }} + > + {({ + errors, + handleBlur, + handleChange, + handleSubmit, + isSubmitting, + setFieldValue, + touched, + values + }) => ( +
+ + + + + + + Save + + + +
+ )} + + + + + + + + 4. Click on the button to automatically create the data + source connecting our RDS Aurora database with Quicksight + + + + + } + sx={{ mt: 1, mb: 2, ml: 2 }} + variant="outlined" + onClick={() => { + createQuicksightdata().catch((e) => + dispatch({ type: SET_ERROR, error: e.message }) + ); + }} + > + Create Quicksight data source + + + + + + + + + + + + + + + + 5. Go to Quicksight to build your Analysis and publish a + Dashboard. Check the user guide for more details. + + + + + } + variant="outlined" + onClick={startAuthorSession} + sx={{ mt: 1, mb: 2, ml: 2 }} + > + Start Quicksight session + + + + + + + + 6. Introduce or update your Dashboard ID + + + + + { + await submitDash( + values, + setStatus, + setSubmitting, + setErrors + ); + }} + > + {({ + errors, + handleBlur, + handleChange, + handleSubmit, + isSubmitting, + setFieldValue, + touched, + values + }) => ( +
+ + + + + + + Save + + + +
+ )} + + + + + + + + + + +
+ + + + ); }; diff --git a/frontend/src/views/Catalog/RequestAccessModal.js b/frontend/src/views/Catalog/RequestAccessModal.js index 360c9246f..af59ea628 100644 --- a/frontend/src/views/Catalog/RequestAccessModal.js +++ b/frontend/src/views/Catalog/RequestAccessModal.js @@ -95,14 +95,14 @@ const RequestAccessModal = (props) => { term: '', groupUri: groupUri }, - environmentUri, + environmentUri }) ); if (!response.errors) { setRoleOptions( response.data.listEnvironmentConsumptionRoles.nodes.map((g) => ({ value: g.consumptionRoleUri, - label: [g.consumptionRoleName,' [',g.IAMRoleArn,']'].join(''), + label: [g.consumptionRoleName, ' [', g.IAMRoleArn, ']'].join('') })) ); } else { @@ -126,8 +126,10 @@ const RequestAccessModal = (props) => { async function submit(values, setStatus, setSubmitting, setErrors) { try { let response; - let type = values.consumptionRole? 'ConsumptionRole' : 'Group'; - let principal = values.consumptionRole? values.consumptionRole : values.groupUri; + let type = values.consumptionRole ? 'ConsumptionRole' : 'Group'; + let principal = values.consumptionRole + ? values.consumptionRole + : values.groupUri; if (hit.resourceKind === 'dataset') { response = await client.mutate( createShareObject({ @@ -217,7 +219,9 @@ const RequestAccessModal = (props) => { Request Access - Data access is requested for the whole requester Team or for the selected Consumption role. The request will be submitted to the data owners, track its progress in the Shares menu on the left. + Data access is requested for the whole requester Team or for the + selected Consumption role. The request will be submitted to the data + owners, track its progress in the Shares menu on the left. { onChange={(event) => { setFieldValue('consumptionRole', ''); fetchRoles( - values.environment.environmentUri, event.target.value + values.environment.environmentUri, + event.target.value ).catch((e) => - dispatch({ type: SET_ERROR, error: e.message }) + dispatch({ + type: SET_ERROR, + error: e.message + }) ); setFieldValue('groupUri', event.target.value); }} @@ -387,24 +395,28 @@ const RequestAccessModal = (props) => { {roleOptions.length > 0 ? ( { - setFieldValue('consumptionRole', event.target.value); + setFieldValue( + 'consumptionRole', + event.target.value + ); }} select value={values.consumptionRole} variant="outlined" > {roleOptions.map((role) => ( - + {role.label} ))} @@ -412,9 +424,13 @@ const RequestAccessModal = (props) => { ) : ( { const handleInputKeyup = (event) => { if (event.code === 'Enter') { - setFilter({page: 1, term: event.target.value}); + setFilter({ page: 1, term: event.target.value }); fetchItems().catch((e) => dispatch({ type: SET_ERROR, error: e.message }) ); diff --git a/frontend/src/views/Datasets/DatasetList.js b/frontend/src/views/Datasets/DatasetList.js index a62fea7df..dd9453ef9 100644 --- a/frontend/src/views/Datasets/DatasetList.js +++ b/frontend/src/views/Datasets/DatasetList.js @@ -94,7 +94,7 @@ const DatasetList = () => { const fetchItems = useCallback(async () => { setLoading(true); - const response = await client.query(listDatasets({filter})); + const response = await client.query(listDatasets({ filter })); if (!response.errors) { setItems(response.data.listDatasets); } else { @@ -110,7 +110,7 @@ const DatasetList = () => { const handleInputKeyup = (event) => { if (event.code === 'Enter') { - setFilter({page: 1, term: event.target.value}); + setFilter({ page: 1, term: event.target.value }); fetchItems().catch((e) => dispatch({ type: SET_ERROR, error: e.message }) ); diff --git a/frontend/src/views/Environments/EnvironmentConsoleAccess.js b/frontend/src/views/Environments/EnvironmentConsoleAccess.js index 890ab3d27..a87523805 100644 --- a/frontend/src/views/Environments/EnvironmentConsoleAccess.js +++ b/frontend/src/views/Environments/EnvironmentConsoleAccess.js @@ -1,4 +1,3 @@ -import { useState } from 'react'; import PropTypes from 'prop-types'; import { Card, @@ -7,53 +6,8 @@ import { Divider, Typography } from '@mui/material'; -import { useSnackbar } from 'notistack'; -import getEnvironmentAssumeRoleUrl from '../../api/Environment/getEnvironmentAssumeRoleUrl'; -import generateEnvironmentAccessToken from '../../api/Environment/generateEnvironmentAccessToken'; -import useClient from '../../hooks/useClient'; -import { SET_ERROR } from '../../store/errorReducer'; -import { useDispatch } from '../../store'; const EnvironmentConsoleAccess = ({ environment }) => { - const client = useClient(); - const dispatch = useDispatch(); - const { enqueueSnackbar } = useSnackbar(); - - const generateCredentials = async () => { - const response = await client.query( - generateEnvironmentAccessToken({ - environmentUri: environment.environmentUri - }) - ); - if (!response.errors) { - await navigator.clipboard.writeText( - response.data.generateEnvironmentAccessToken - ); - enqueueSnackbar('Credentials copied to clipboard', { - anchorOrigin: { - horizontal: 'right', - vertical: 'top' - }, - variant: 'success' - }); - } else { - dispatch({ type: SET_ERROR, error: response.errors[0].message }); - } - }; - - const goToAWSConsole = async () => { - const response = await client.query( - getEnvironmentAssumeRoleUrl({ - environmentUri: environment.environmentUri - }) - ); - if (!response.errors) { - window.open(response.data.getEnvironmentAssumeRoleUrl, '_blank'); - } else { - dispatch({ type: SET_ERROR, error: response.errors[0].message }); - } - }; - return ( diff --git a/frontend/src/views/Environments/EnvironmentCreateForm.js b/frontend/src/views/Environments/EnvironmentCreateForm.js index 77bc5ee04..d68570880 100644 --- a/frontend/src/views/Environments/EnvironmentCreateForm.js +++ b/frontend/src/views/Environments/EnvironmentCreateForm.js @@ -606,7 +606,7 @@ const EnvironmentCreateForm = (props) => { /> -{/* + {/* { /> -{/* + {/* { -{/* { const client = useClient(); const fetchItems = useCallback(async () => { setLoading(true); - const response = await client.query(listEnvironments({filter})); + const response = await client.query(listEnvironments({ filter })); if (!response.errors) { setItems(response.data.listEnvironments); } else { @@ -84,7 +84,7 @@ const EnvironmentList = () => { const handleInputKeyup = (event) => { if (event.code === 'Enter') { - setFilter({page: 1, term: event.target.value}); + setFilter({ page: 1, term: event.target.value }); fetchItems().catch((e) => dispatch({ type: SET_ERROR, error: e.message }) ); diff --git a/frontend/src/views/Environments/EnvironmentRoleAddForm.js b/frontend/src/views/Environments/EnvironmentRoleAddForm.js index 09cd47f28..70e62f034 100644 --- a/frontend/src/views/Environments/EnvironmentRoleAddForm.js +++ b/frontend/src/views/Environments/EnvironmentRoleAddForm.js @@ -1,21 +1,12 @@ -import React, { useCallback, useEffect, useState } from 'react'; +import React, { useEffect, useState } from 'react'; import PropTypes from 'prop-types'; import { useSnackbar } from 'notistack'; import { - Autocomplete, Box, - Card, CardContent, - CardHeader, CircularProgress, Dialog, - Divider, - FormControlLabel, - FormGroup, - FormHelperText, MenuItem, - Paper, - Switch, TextField, Typography } from '@mui/material'; @@ -28,20 +19,18 @@ import { useDispatch } from '../../store'; import useClient from '../../hooks/useClient'; import * as Defaults from '../../components/defaults'; import listEnvironmentGroups from '../../api/Environment/listEnvironmentGroups'; -import addConsumptionRoleToEnvironment from '../../api/Environment/addConsumptionRoleToEnvironment' +import addConsumptionRoleToEnvironment from '../../api/Environment/addConsumptionRoleToEnvironment'; const EnvironmentRoleAddForm = (props) => { const { environment, onClose, open, reloadRoles, ...other } = props; const { enqueueSnackbar } = useSnackbar(); const dispatch = useDispatch(); const client = useClient(); - const [items, setItems] = useState([]); const [loadingGroups, setLoadingGroups] = useState(true); const [groupOptions, setGroupOptions] = useState([]); - const [roleError, setRoleError] = useState(null); const fetchGroups = async (environmentUri) => { try { - setLoadingGroups(true) + setLoadingGroups(true); const response = await client.query( listEnvironmentGroups({ filter: Defaults.SelectListFilter, @@ -67,9 +56,7 @@ const EnvironmentRoleAddForm = (props) => { useEffect(() => { if (client && environment) { - fetchGroups( - environment.environmentUri - ).catch((e) => + fetchGroups(environment.environmentUri).catch((e) => dispatch({ type: SET_ERROR, error: e.message }) ); } @@ -77,8 +64,8 @@ const EnvironmentRoleAddForm = (props) => { async function submit(values, setStatus, setSubmitting, setErrors) { try { - const response = await client.mutate(addConsumptionRoleToEnvironment - ({ + const response = await client.mutate( + addConsumptionRoleToEnvironment({ groupUri: values.groupUri, consumptionRoleName: values.consumptionRoleName, IAMRoleArn: values.IAMRoleArn, @@ -96,8 +83,8 @@ const EnvironmentRoleAddForm = (props) => { variant: 'success' }); if (reloadRoles) { - reloadRoles(); - } + reloadRoles(); + } if (onClose) { onClose(); } @@ -133,115 +120,108 @@ const EnvironmentRoleAddForm = (props) => { Add a consumption IAM role to environment {environment.label} - An IAM consumption role is owned by the selected Team. The owners team request access on behalf of this IAM role, which can be used by downstream applications. + An IAM consumption role is owned by the selected Team. The owners team + request access on behalf of this IAM role, which can be used by + downstream applications. - - { - await submit(values, setStatus, setSubmitting, setErrors); - }} - > - {({ - errors, - handleChange, - handleSubmit, - isSubmitting, - setFieldValue, - touched, - values - }) => ( -
- - - - - - + + { + await submit(values, setStatus, setSubmitting, setErrors); + }} + > + {({ + errors, + handleChange, + handleSubmit, + isSubmitting, + setFieldValue, + touched, + values + }) => ( + + + + + + + + + + {groupOptions.map((group) => ( + + {group.label} + + ))} + + + - } + color="primary" + disabled={isSubmitting} + type="submit" + variant="contained" > - {groupOptions.map((group) => ( - - {group.label} - - ))} - + Add Consumption Role + - - - } - color="primary" - disabled={isSubmitting} - type="submit" - variant="contained" - > - Add Consumption Role - - - - - )} - -
+ + + )} + + ); diff --git a/frontend/src/views/Environments/EnvironmentTeamInviteForm.js b/frontend/src/views/Environments/EnvironmentTeamInviteForm.js index 843351082..905d2dadb 100644 --- a/frontend/src/views/Environments/EnvironmentTeamInviteForm.js +++ b/frontend/src/views/Environments/EnvironmentTeamInviteForm.js @@ -42,9 +42,9 @@ const EnvironmentTeamInviteForm = (props) => { const [permissionsError, setPermissionsError] = useState(null); const filter = { - type: "environment", + type: 'environment', uri: environment.environmentUri - } + }; const fetchGroups = useCallback(async () => { try { diff --git a/frontend/src/views/Environments/EnvironmentTeams.js b/frontend/src/views/Environments/EnvironmentTeams.js index acc9a2ff1..a1d88e17a 100644 --- a/frontend/src/views/Environments/EnvironmentTeams.js +++ b/frontend/src/views/Environments/EnvironmentTeams.js @@ -271,7 +271,7 @@ const EnvironmentTeams = ({ environment }) => { } }, [client, dispatch, environment, filter]); - const fetchRoles= useCallback(async () => { + const fetchRoles = useCallback(async () => { try { const response = await client.query( listAllEnvironmentConsumptionRoles({ @@ -292,7 +292,6 @@ const EnvironmentTeams = ({ environment }) => { }, [client, dispatch, environment, filterRoles]); const removeConsumptionRole = async (consumptionGroupUri) => { - console.log(consumptionGroupUri) try { const response = await client.mutate( removeConsumptionRoleFromEnvironment({ @@ -317,7 +316,6 @@ const EnvironmentTeams = ({ environment }) => { } }; - useEffect(() => { if (client) { fetchItems().catch((e) => @@ -371,227 +369,231 @@ const EnvironmentTeams = ({ environment }) => { - } - title={ - - {' '} - Environment Teams - - } - /> - - - - - - - - ) + } + title={ + + {' '} + Environment Teams + + } + /> + + + + - - - - - {isTeamInviteModalOpen && ( - - )} - - - - - - - - Name - IAM Role - Athena WorkGroup - Permissions - Actions - - - {loading ? ( - - ) : ( - - {items.nodes.length > 0 ? ( - items.nodes.map((team) => ( - - )) - ) : ( - - No Team invited - - )} - + > + + + + ) + }} + onChange={handleInputChange} + onKeyUp={handleInputKeyup} + placeholder="Search" + value={inputValue} + variant="outlined" + /> + + + + + {isTeamInviteModalOpen && ( + )} -
- {!loading && items.nodes.length > 0 && ( - - )} + - - + + + + + + Name + IAM Role + Athena WorkGroup + Permissions + Actions + + + {loading ? ( + + ) : ( + + {items.nodes.length > 0 ? ( + items.nodes.map((team) => ( + + )) + ) : ( + + No Team invited + + )} + + )} +
+ {!loading && items.nodes.length > 0 && ( + + )} + + + - } - title={ - - {' '} - Environment Consumption IAM roles - - } - /> - - - - - - - - ) + } + title={ + + {' '} + Environment Consumption IAM roles + + } + /> + + + + - - - - - {isAddRoleModalOpen && ( - - )} - - - - - - - - Name - IAM Role - Role Owner - Action - - - {loading ? ( - - ) : ( - - {roles.nodes.length > 0 ? ( - roles.nodes.map((role) => ( - - {role.consumptionRoleName} - {role.IAMRoleArn} - {role.groupUri} - - removeConsumptionRole(role.consumptionRoleUri)}> - - - - - )) - ) : ( - - No Consumption IAM Role added - - )} - + > + + + + ) + }} + onChange={handleInputChangeRoles} + onKeyUp={handleInputKeyupRoles} + placeholder="Search" + value={inputValueRoles} + variant="outlined" + /> + + + + + {isAddRoleModalOpen && ( + )} -
- {!loading && roles.nodes.length > 0 && ( - - )} + - - + + + + + + Name + IAM Role + Role Owner + Action + + + {loading ? ( + + ) : ( + + {roles.nodes.length > 0 ? ( + roles.nodes.map((role) => ( + + {role.consumptionRoleName} + {role.IAMRoleArn} + {role.groupUri} + + + removeConsumptionRole(role.consumptionRoleUri) + } + > + + + + + )) + ) : ( + + No Consumption IAM Role added + + )} + + )} +
+ {!loading && roles.nodes.length > 0 && ( + + )} + + + ); diff --git a/frontend/src/views/Environments/EnvironmentView.js b/frontend/src/views/Environments/EnvironmentView.js index 71c271af3..517ca49f7 100644 --- a/frontend/src/views/Environments/EnvironmentView.js +++ b/frontend/src/views/Environments/EnvironmentView.js @@ -27,7 +27,6 @@ import { import { useSnackbar } from 'notistack'; import { useNavigate } from 'react-router'; import { FaAws, FaNetworkWired, FaTrash } from 'react-icons/fa'; -import { GoDatabase } from 'react-icons/go'; import useSettings from '../../hooks/useSettings'; import getEnvironment from '../../api/Environment/getEnvironment'; import useClient from '../../hooks/useClient'; diff --git a/frontend/src/views/Folders/FolderView.js b/frontend/src/views/Folders/FolderView.js index f7fc281de..21c417cc4 100644 --- a/frontend/src/views/Folders/FolderView.js +++ b/frontend/src/views/Folders/FolderView.js @@ -152,7 +152,7 @@ function FolderPageHeader(props) { > Delete - )} + )} {openFeed && ( diff --git a/frontend/src/views/Glossaries/GlossaryAssociations.js b/frontend/src/views/Glossaries/GlossaryAssociations.js index a3c2d5bd8..c745aad39 100644 --- a/frontend/src/views/Glossaries/GlossaryAssociations.js +++ b/frontend/src/views/Glossaries/GlossaryAssociations.js @@ -27,12 +27,10 @@ import listGlossaryAssociations from '../../api/Glossary/listGlossaryAssociation import approveTermAssociation from '../../api/Glossary/approveTermAssociation'; import dismissTermAssociation from '../../api/Glossary/dismissTermAssociation'; import Pager from '../../components/Pager'; -import useAuth from '../../hooks/useAuth'; const GlossaryAssociations = ({ glossary }) => { const client = useClient(); const dispatch = useDispatch(); - const { user } = useAuth(); const { enqueueSnackbar } = useSnackbar(); const [items, setItems] = useState(Defaults.PagedResponseDefault); const [filter, setFilter] = useState(Defaults.DefaultFilter); @@ -50,9 +48,7 @@ const GlossaryAssociations = ({ glossary }) => { ); if (!response.errors) { setIsAdmin( - ['Admin'].indexOf( - response.data.getGlossary.userRoleForGlossary - ) !== -1 + ['Admin'].indexOf(response.data.getGlossary.userRoleForGlossary) !== -1 ); setItems(response.data.getGlossary.associations); } else { diff --git a/frontend/src/views/Glossaries/GlossaryManagement.js b/frontend/src/views/Glossaries/GlossaryManagement.js index 3308ebe9c..31cec0934 100644 --- a/frontend/src/views/Glossaries/GlossaryManagement.js +++ b/frontend/src/views/Glossaries/GlossaryManagement.js @@ -151,7 +151,7 @@ const GlossaryManagement = (props) => { setFetchingItems(true); setData(glossary); const response = await client.query( - listGlossaryTree({ nodeUri: glossary.nodeUri, filter: {pageSize: 500} }) + listGlossaryTree({ nodeUri: glossary.nodeUri, filter: { pageSize: 500 } }) ); if (!response.errors && response.data.getGlossary !== null) { setItems({ ...response.data.getGlossary.tree }); diff --git a/frontend/src/views/Glossaries/GlossaryView.js b/frontend/src/views/Glossaries/GlossaryView.js index f033fcc2a..e81ed43e9 100644 --- a/frontend/src/views/Glossaries/GlossaryView.js +++ b/frontend/src/views/Glossaries/GlossaryView.js @@ -123,9 +123,7 @@ const GlossaryView = () => { const response = await client.query(getGlossary(params.uri)); if (!response.errors && response.data.getGlossary !== null) { setIsAdmin( - ['Admin'].indexOf( - response.data.getGlossary.userRoleForGlossary - ) !== -1 + ['Admin'].indexOf(response.data.getGlossary.userRoleForGlossary) !== -1 ); setGlossary(response.data.getGlossary); } else { diff --git a/frontend/src/views/KeyValueTags/KeyValueTagList.js b/frontend/src/views/KeyValueTags/KeyValueTagList.js index ee3ab99d3..d08780fd9 100644 --- a/frontend/src/views/KeyValueTags/KeyValueTagList.js +++ b/frontend/src/views/KeyValueTags/KeyValueTagList.js @@ -18,7 +18,6 @@ import useClient from '../../hooks/useClient'; import Scrollbar from '../../components/Scrollbar'; import { SET_ERROR } from '../../store/errorReducer'; import { useDispatch } from '../../store'; -import { useSnackbar } from 'notistack'; import KeyValueTagUpdateForm from './KeyValueTagUpdateForm'; import listKeyValueTags from '../../api/KeyValueTags/listKeyValueTags'; import PencilAlt from '../../icons/PencilAlt'; @@ -52,7 +51,6 @@ const KeyValueTagList = ({ targetUri, targetType }) => { setOpenUpdateForm(false); }; - useEffect(() => { if (client) { fetchItems().catch((e) => @@ -73,7 +71,11 @@ const KeyValueTagList = ({ targetUri, targetType }) => { 0 ? items : [{ key: '', value: '', cascade: false }]} + tags={ + items.length > 0 + ? items + : [{ key: '', value: '', cascade: false }] + } closeUpdate={closeUpdate} /> ) : ( @@ -100,7 +102,9 @@ const KeyValueTagList = ({ targetUri, targetType }) => { Key Value - {targetType == 'environment' && (Cascade enabled)} + {targetType === 'environment' && ( + Cascade enabled + )} @@ -108,15 +112,17 @@ const KeyValueTagList = ({ targetUri, targetType }) => { {tag.key || '-'} {tag.value || '-'} - {targetType == 'environment' && ( - - )} + {targetType === 'environment' && ( + + + + )} ))} diff --git a/frontend/src/views/KeyValueTags/KeyValueTagUpdateForm.js b/frontend/src/views/KeyValueTags/KeyValueTagUpdateForm.js index 688393d0d..67572c1b9 100644 --- a/frontend/src/views/KeyValueTags/KeyValueTagUpdateForm.js +++ b/frontend/src/views/KeyValueTags/KeyValueTagUpdateForm.js @@ -32,7 +32,7 @@ const KeyValueTagUpdateForm = (props) => { const client = useClient(); const [isSubmitting, setIsSubmitting] = useState(false); const [kvTags, setKeyValueTags] = useState( - tags && tags.length > 0 ? tags : [{ key: '', value: '', cascade: false}] + tags && tags.length > 0 ? tags : [{ key: '', value: '', cascade: false }] ); const handleAddKeyValueRow = () => { @@ -83,7 +83,11 @@ const KeyValueTagUpdateForm = (props) => { targetType, tags: kvTags.length > 0 - ? kvTags.map((k) => ({ key: k.key, value: k.value, cascade: k.cascade })) + ? kvTags.map((k) => ({ + key: k.key, + value: k.value, + cascade: k.cascade + })) : [] }) ); @@ -125,7 +129,9 @@ const KeyValueTagUpdateForm = (props) => { Key Value - {targetType == 'environment' && (Cascade enabled)} + {targetType === 'environment' && ( + Cascade enabled + )} )} @@ -151,16 +157,21 @@ const KeyValueTagUpdateForm = (props) => { variant="outlined" /> - {targetType == 'environment' && ( + {targetType === 'environment' && ( + - )} + color="primary" + edge="start" + name="cascade" + checked={kvTags[idx].cascade} + value={kvTags[idx].cascade} + onChange={handleKeyValueChange( + idx, + 'cascade' + )} + /> + + )} { diff --git a/frontend/src/views/MLStudio/NotebookCreateForm.js b/frontend/src/views/MLStudio/NotebookCreateForm.js index c22ede279..91f1b09ff 100644 --- a/frontend/src/views/MLStudio/NotebookCreateForm.js +++ b/frontend/src/views/MLStudio/NotebookCreateForm.js @@ -145,10 +145,7 @@ const NotebookCreateForm = (props) => { - + Create a new ML Studio profile { const handleInputKeyup = (event) => { if (event.code === 'Enter') { - setFilter({page: 1, term: event.target.value}); + setFilter({ page: 1, term: event.target.value }); fetchItems().catch((e) => dispatch({ type: SET_ERROR, error: e.message }) ); diff --git a/frontend/src/views/Notebooks/NotebookCreateForm.js b/frontend/src/views/Notebooks/NotebookCreateForm.js index 9ace9c33c..2b78d9885 100644 --- a/frontend/src/views/Notebooks/NotebookCreateForm.js +++ b/frontend/src/views/Notebooks/NotebookCreateForm.js @@ -243,7 +243,9 @@ const NotebookCreateForm = (props) => { environment: Yup.object().required('*Environment is required'), tags: Yup.array().nullable(), VpcId: Yup.string().min(1).required('*VPC ID is required'), - SubnetId: Yup.string().min(1).required('*Subnet ID is required'), + SubnetId: Yup.string() + .min(1) + .required('*Subnet ID is required'), InstanceType: Yup.string() .min(1) .required('*Instance type is required'), @@ -373,13 +375,14 @@ const NotebookCreateForm = (props) => { setFieldValue('VolumeSizeInGB', value); }} /> - {touched.VolumeSizeInGB && errors.VolumeSizeInGB && ( - - - {errors.VolumeSizeInGB} - - - )} + {touched.VolumeSizeInGB && + errors.VolumeSizeInGB && ( + + + {errors.VolumeSizeInGB} + + + )} diff --git a/frontend/src/views/Notebooks/NotebookList.js b/frontend/src/views/Notebooks/NotebookList.js index deba2258d..c687c50e6 100644 --- a/frontend/src/views/Notebooks/NotebookList.js +++ b/frontend/src/views/Notebooks/NotebookList.js @@ -99,7 +99,7 @@ const NotebookList = () => { const handleInputKeyup = (event) => { if (event.code === 'Enter') { - setFilter({page: 1, term: event.target.value}); + setFilter({ page: 1, term: event.target.value }); fetchItems().catch((e) => dispatch({ type: SET_ERROR, error: e.message }) ); diff --git a/frontend/src/views/Organizations/OrganizationList.js b/frontend/src/views/Organizations/OrganizationList.js index 200a04329..f1c7f0447 100644 --- a/frontend/src/views/Organizations/OrganizationList.js +++ b/frontend/src/views/Organizations/OrganizationList.js @@ -35,7 +35,7 @@ const OrganizationList = () => { const client = useClient(); const fetchItems = useCallback(async () => { setLoading(true); - const response = await client.query(listOrganizations({filter})); + const response = await client.query(listOrganizations({ filter })); if (!response.errors) { setItems(response.data.listOrganizations); } else { diff --git a/frontend/src/views/Organizations/OrganizationTeamInviteForm.js b/frontend/src/views/Organizations/OrganizationTeamInviteForm.js index d0ea4b11b..ea31c3992 100644 --- a/frontend/src/views/Organizations/OrganizationTeamInviteForm.js +++ b/frontend/src/views/Organizations/OrganizationTeamInviteForm.js @@ -38,9 +38,9 @@ const OrganizationTeamInviteForm = (props) => { const [groupOptions, setGroupOptions] = useState([]); const filter = { - type: "organization", + type: 'organization', uri: organization.organizationUri - } + }; const fetchGroups = useCallback(async () => { try { diff --git a/frontend/src/views/Pipelines/PipelineCICD.js b/frontend/src/views/Pipelines/PipelineCICD.js index 1bc5ff168..db133207f 100644 --- a/frontend/src/views/Pipelines/PipelineCICD.js +++ b/frontend/src/views/Pipelines/PipelineCICD.js @@ -9,7 +9,6 @@ import { IconButton, List, ListItem, - Chip, Typography } from '@mui/material'; import { LoadingButton } from '@mui/lab'; @@ -21,8 +20,6 @@ import useClient from '../../hooks/useClient'; import { SET_ERROR } from '../../store/errorReducer'; import { useDispatch } from '../../store'; import getDataPipelineCredsLinux from '../../api/DataPipeline/getDataPipelineCredsLinux'; -import ChipInput from "../../components/TagsInput"; -import Label from "../../components/Label"; const PipelineCICD = (props) => { const { pipeline } = props; @@ -159,7 +156,9 @@ const PipelineCICD = (props) => { copyNotification()} - text={`git clone codecommit::${pipeline.environment.region}:${'//'}${pipeline.repo}`} + text={`git clone codecommit::${ + pipeline.environment.region + }:${'//'}${pipeline.repo}`} > { /> - {`git clone codecommit::${pipeline.environment.region}:${'//'}${pipeline.repo}`} - + {`git clone codecommit::${pipeline.environment.region}:${'//'}${ + pipeline.repo + }`} + diff --git a/frontend/src/views/Pipelines/PipelineCreateForm.js b/frontend/src/views/Pipelines/PipelineCreateForm.js index 1f3ffe456..522c72575 100644 --- a/frontend/src/views/Pipelines/PipelineCreateForm.js +++ b/frontend/src/views/Pipelines/PipelineCreateForm.js @@ -32,8 +32,7 @@ import ChipInput from '../../components/TagsInput'; import createDataPipeline from '../../api/DataPipeline/createDataPipeline'; import listEnvironmentGroups from '../../api/Environment/listEnvironmentGroups'; import * as Defaults from '../../components/defaults'; -import PipelineEnvironmentCreateForm from "./PipelineEnvironmentCreateForm"; - +import PipelineEnvironmentCreateForm from './PipelineEnvironmentCreateForm'; const PipelineCrateForm = (props) => { const navigate = useNavigate(); @@ -44,15 +43,20 @@ const PipelineCrateForm = (props) => { const [loading, setLoading] = useState(true); const [groupOptions, setGroupOptions] = useState([]); const [environmentOptions, setEnvironmentOptions] = useState([]); - const devOptions =[{value:"cdk-trunk", label:"CDK Pipelines - Trunk-based"},{value:"trunk", label:"CodePipeline - Trunk-based"},{value:"gitflow", label:"CodePipeline - Gitflow"},{value:"template", label:"GitHub Template"}];/*DBT Pipelines*/ + const devOptions = [ + { value: 'cdk-trunk', label: 'CDK Pipelines - Trunk-based' }, + { value: 'trunk', label: 'CodePipeline - Trunk-based' }, + { value: 'gitflow', label: 'CodePipeline - Gitflow' }, + { value: 'template', label: 'GitHub Template' } + ]; /*DBT Pipelines*/ const [triggerEnvSubmit, setTriggerEnvSubmit] = useState(false); const [countEnvironmentsValid, setCountEnvironmentsValid] = useState(false); const [pipelineUri, setPipelineUri] = useState(''); - const handleCountEnvironmentValid = state => { + const handleCountEnvironmentValid = (state) => { setCountEnvironmentsValid(state); - }; - + }; + const fetchEnvironments = useCallback(async () => { setLoading(true); const response = await client.query( @@ -102,56 +106,58 @@ const PipelineCrateForm = (props) => { ); } }, [client, dispatch, fetchEnvironments]); - + async function submit(values, setStatus, setSubmitting, setErrors) { - if (!countEnvironmentsValid){ - dispatch({ type: SET_ERROR, error: "At least one deployment environment is required" }) - }else{ - try { - const response = await client.mutate( - createDataPipeline({ - input: { - label: values.label, - environmentUri: values.environment.environmentUri, - description: values.description, - SamlGroupName: values.SamlGroupName, - tags: values.tags, - devStrategy: values.devStrategy, - template: values.template - } - }) + if (!countEnvironmentsValid) { + dispatch({ + type: SET_ERROR, + error: 'At least one deployment environment is required' + }); + } else { + try { + const response = await client.mutate( + createDataPipeline({ + input: { + label: values.label, + environmentUri: values.environment.environmentUri, + description: values.description, + SamlGroupName: values.SamlGroupName, + tags: values.tags, + devStrategy: values.devStrategy, + template: values.template + } + }) + ); + if (!response.errors) { + setStatus({ success: true }); + setTriggerEnvSubmit(true); + setPipelineUri(response.data.createDataPipeline.DataPipelineUri); + setSubmitting(false); + enqueueSnackbar('Pipeline creation started', { + anchorOrigin: { + horizontal: 'right', + vertical: 'top' + }, + variant: 'success' + }); + navigate( + `/console/pipelines/${response.data.createDataPipeline.DataPipelineUri}` ); - if (!response.errors) { - setStatus({ success: true }); - setTriggerEnvSubmit(true); - setPipelineUri(response.data.createDataPipeline.DataPipelineUri); - setSubmitting(false); - enqueueSnackbar('Pipeline creation started', { - anchorOrigin: { - horizontal: 'right', - vertical: 'top' - }, - variant: 'success' - }); - navigate( - `/console/pipelines/${response.data.createDataPipeline.DataPipelineUri}` - ); - } else { - setTriggerEnvSubmit(false); - dispatch({ type: SET_ERROR, error: response.errors[0].message }); - } - } catch (err) { - console.error(err); - setStatus({ success: false }); + } else { setTriggerEnvSubmit(false); - setErrors({ submit: err.message }); - setSubmitting(false); - dispatch({ type: SET_ERROR, error: err.message }); + dispatch({ type: SET_ERROR, error: response.errors[0].message }); } + } catch (err) { + console.error(err); + setStatus({ success: false }); + setTriggerEnvSubmit(false); + setErrors({ submit: err.message }); + setSubmitting(false); + dispatch({ type: SET_ERROR, error: err.message }); } + } } - if (loading) { return ; } @@ -226,19 +232,20 @@ const PipelineCrateForm = (props) => { environment: '', tags: [], devStrategy: 'cdk-trunk', - template: '', + template: '' }} validationSchema={Yup.object().shape({ label: Yup.string() .max(255) .required('*Pipeline name is required'), description: Yup.string().max(5000), - SamlGroupName: Yup.string() - .max(255), + SamlGroupName: Yup.string().max(255), environment: Yup.object(), - devStrategy: Yup.string().required('*A CICD strategy is required'), + devStrategy: Yup.string().required( + '*A CICD strategy is required' + ), tags: Yup.array().nullable(), - template: Yup.string().nullable(), + template: Yup.string().nullable() })} onSubmit={async ( values, @@ -370,7 +377,10 @@ const PipelineCrateForm = (props) => { label="Team" name="SamlGroupName" onChange={(event) => { - setFieldValue('SamlGroupName', event.target.value); + setFieldValue( + 'SamlGroupName', + event.target.value + ); }} select value={values.SamlGroupName} @@ -435,9 +445,11 @@ const PipelineCrateForm = (props) => { - {values.devStrategy === "template" && ( + {values.devStrategy === 'template' && ( { environmentOptions={environmentOptions} triggerEnvSubmit={triggerEnvSubmit} pipelineUri={pipelineUri} - handleCountEnvironmentValid={handleCountEnvironmentValid} + handleCountEnvironmentValid={ + handleCountEnvironmentValid + } /> {errors.submit && ( @@ -481,7 +495,7 @@ const PipelineCrateForm = (props) => { Create Pipeline - + )} @@ -493,4 +507,4 @@ const PipelineCrateForm = (props) => { ); }; -export default PipelineCrateForm; \ No newline at end of file +export default PipelineCrateForm; diff --git a/frontend/src/views/Pipelines/PipelineDatasets.js b/frontend/src/views/Pipelines/PipelineDatasets.js index afd5f573e..b26b6f2b3 100644 --- a/frontend/src/views/Pipelines/PipelineDatasets.js +++ b/frontend/src/views/Pipelines/PipelineDatasets.js @@ -1,5 +1,5 @@ import PropTypes from 'prop-types'; -import {useCallback, useState, useEffect } from 'react'; +import { useCallback, useState, useEffect } from 'react'; import { Card, CardContent, @@ -11,52 +11,51 @@ import { } from '@mui/material'; import useClient from '../../hooks/useClient'; import { useDispatch } from '../../store'; -import getDataset from "../../api/Dataset/getDataset"; -import {SET_ERROR} from "../../store/errorReducer"; - +import getDataset from '../../api/Dataset/getDataset'; +import { SET_ERROR } from '../../store/errorReducer'; const PipelineDatasets = (props) => { const { pipeline } = props; const client = useClient(); const dispatch = useDispatch(); - const [loading, setLoading] = useState(false); - const [inputDataset, setInputDataset] = useState(""); - const [outputDataset, setOutputDataset] = useState(""); + const [inputDataset, setInputDataset] = useState(''); + const [outputDataset, setOutputDataset] = useState(''); const fetchDatasets = useCallback(async () => { - setLoading(true); if (pipeline.inputDatasetUri) { const response = await client.query(getDataset(pipeline.inputDatasetUri)); if (!response.errors && response.data.getDataset !== null) { setInputDataset(response.data.getDataset.label); } else { const error = response.errors - ? response.errors[0].message - : 'Dataset not found'; - dispatch({type: SET_ERROR, error}); + ? response.errors[0].message + : 'Dataset not found'; + dispatch({ type: SET_ERROR, error }); } } if (pipeline.outputDatasetUri) { - const response = await client.query(getDataset(pipeline.outputDatasetUri)); + const response = await client.query( + getDataset(pipeline.outputDatasetUri) + ); if (!response.errors && response.data.getDataset !== null) { setOutputDataset(response.data.getDataset.label); } else { const error = response.errors - ? response.errors[0].message - : 'Dataset not found'; - dispatch({type: SET_ERROR, error}); + ? response.errors[0].message + : 'Dataset not found'; + dispatch({ type: SET_ERROR, error }); } } - setLoading(false); }, [client, dispatch]); useEffect(() => { if (client) { - fetchDatasets().catch((e) => dispatch({ type: SET_ERROR, error: e.message })); + fetchDatasets().catch((e) => + dispatch({ type: SET_ERROR, error: e.message }) + ); } }, [client, dispatch, fetchDatasets]); - return ( diff --git a/frontend/src/views/Pipelines/PipelineEditForm.js b/frontend/src/views/Pipelines/PipelineEditForm.js index a6d1c23a1..6a984bc10 100644 --- a/frontend/src/views/Pipelines/PipelineEditForm.js +++ b/frontend/src/views/Pipelines/PipelineEditForm.js @@ -30,10 +30,9 @@ import ChipInput from '../../components/TagsInput'; import getDataPipeline from '../../api/DataPipeline/getDataPipeline'; import updateDataPipeline from '../../api/DataPipeline/updateDataPipeline'; import listEnvironments from '../../api/Environment/listEnvironments'; -import PipelineEnvironmentEditForm from "./PipelineEnvironmentEditForm"; +import PipelineEnvironmentEditForm from './PipelineEnvironmentEditForm'; import * as Defaults from '../../components/defaults'; - const PipelineEditForm = (props) => { const dispatch = useDispatch(); const navigate = useNavigate(); @@ -48,9 +47,9 @@ const PipelineEditForm = (props) => { const [triggerEnvSubmit, setTriggerEnvSubmit] = useState(false); const [countEnvironmentsValid, setCountEnvironmentsValid] = useState(false); - const handleCountEnvironmentValid = state => { + const handleCountEnvironmentValid = (state) => { setCountEnvironmentsValid(state); - }; + }; const fetchItem = useCallback(async () => { setLoadingPipeline(true); @@ -100,49 +99,52 @@ const PipelineEditForm = (props) => { }, [client, dispatch, fetchEnvironments]); async function submit(values, setStatus, setSubmitting, setErrors) { - if (!countEnvironmentsValid){ - dispatch({ type: SET_ERROR, error: "At least one deployment environment is required" }) - } else{ - try { - const response = await client.mutate( - updateDataPipeline({ - DataPipelineUri: pipeline.DataPipelineUri, - input: { - description: values.description, - label: values.label, - tags: values.tags - } - }) + if (!countEnvironmentsValid) { + dispatch({ + type: SET_ERROR, + error: 'At least one deployment environment is required' + }); + } else { + try { + const response = await client.mutate( + updateDataPipeline({ + DataPipelineUri: pipeline.DataPipelineUri, + input: { + description: values.description, + label: values.label, + tags: values.tags + } + }) + ); + if (!response.errors) { + setStatus({ success: true }); + setTriggerEnvSubmit(true); + setSubmitting(false); + enqueueSnackbar('Pipeline updated', { + anchorOrigin: { + horizontal: 'right', + vertical: 'top' + }, + variant: 'success' + }); + navigate( + `/console/pipelines/${response.data.updateDataPipeline.DataPipelineUri}` ); - if (!response.errors) { - setStatus({ success: true }); - setTriggerEnvSubmit(true); - setSubmitting(false); - enqueueSnackbar('Pipeline updated', { - anchorOrigin: { - horizontal: 'right', - vertical: 'top' - }, - variant: 'success' - }); - navigate( - `/console/pipelines/${response.data.updateDataPipeline.DataPipelineUri}` - ); - } else { - setTriggerEnvSubmit(false); - dispatch({ type: SET_ERROR, error: response.errors[0].message }); - } - } catch (err) { - setStatus({ success: false }); + } else { setTriggerEnvSubmit(false); - setErrors({ submit: err.message }); - setSubmitting(false); - dispatch({ type: SET_ERROR, error: err.message }); + dispatch({ type: SET_ERROR, error: response.errors[0].message }); } + } catch (err) { + setStatus({ success: false }); + setTriggerEnvSubmit(false); + setErrors({ submit: err.message }); + setSubmitting(false); + dispatch({ type: SET_ERROR, error: err.message }); } } + } - if ((loadingPipeline || loadingEnvs) || (!pipeline && pipeline.environment)) { + if (loadingPipeline || loadingEnvs || (!pipeline && pipeline.environment)) { return ; } @@ -373,7 +375,9 @@ const PipelineEditForm = (props) => { triggerEnvSubmit={triggerEnvSubmit} pipelineUri={pipeline.DataPipelineUri} pipeline={pipeline} - handleCountEnvironmentValid={handleCountEnvironmentValid} + handleCountEnvironmentValid={ + handleCountEnvironmentValid + } /> {errors.submit && ( @@ -397,7 +401,7 @@ const PipelineEditForm = (props) => { Update Pipeline - + )} diff --git a/frontend/src/views/Pipelines/PipelineEnvironmentCreateForm.js b/frontend/src/views/Pipelines/PipelineEnvironmentCreateForm.js index 5f566be0c..446c1dddb 100644 --- a/frontend/src/views/Pipelines/PipelineEnvironmentCreateForm.js +++ b/frontend/src/views/Pipelines/PipelineEnvironmentCreateForm.js @@ -1,5 +1,4 @@ import React, { useEffect, useState } from 'react'; -import { useSnackbar } from 'notistack'; import { Box, Button, @@ -27,35 +26,57 @@ import listEnvironmentGroups from '../../api/Environment/listEnvironmentGroups'; import * as Defaults from '../../components/defaults'; const PipelineEnvironmentCreateForm = (props) => { - const { environmentOptions, triggerEnvSubmit, pipelineUri, handleCountEnvironmentValid } = props; + const { + environmentOptions, + triggerEnvSubmit, + pipelineUri, + handleCountEnvironmentValid + } = props; const dispatch = useDispatch(); - const { enqueueSnackbar } = useSnackbar(); const client = useClient(); const [kvEnvs, setKeyValueEnvs] = useState([]); - const [mapGroups, setMapGroups] = useState(new Map()) - const stageOps =[{value:"dev", label:"dev"},{value:"test", label:"test"},{value:"val", label:"val"},{value:"prod", label:"prod"},{value:"other", label:"other"}]; - const [environmentOps, setEnvironmentOps] = useState( - environmentOptions && environmentOptions.length > 0 ? environmentOptions : [{ environmentUri: 'someUri', label: 'some' },{ environmentUri: 'someUri', label: 'some2' }] - ); + const [mapGroups, setMapGroups] = useState(new Map()); + const stageOps = [ + { value: 'dev', label: 'dev' }, + { value: 'test', label: 'test' }, + { value: 'val', label: 'val' }, + { value: 'prod', label: 'prod' }, + { value: 'other', label: 'other' } + ]; + + const environmentOps = + environmentOptions && environmentOptions.length > 0 + ? environmentOptions + : [ + { environmentUri: 'someUri', label: 'some' }, + { environmentUri: 'someUri', label: 'some2' } + ]; const fetchGroups = async (environment) => { - try { - const response = await client.query( - listEnvironmentGroups({ - filter: Defaults.SelectListFilter, - environmentUri: environment.environmentUri - }) - ); + try { + const response = await client.query( + listEnvironmentGroups({ + filter: Defaults.SelectListFilter, + environmentUri: environment.environmentUri + }) + ); - if (!response.errors) { - setMapGroups(new Map(mapGroups.set(environment.environmentUri, response.data.listEnvironmentGroups.nodes)) )//Array of groups (Objects) - } else { - dispatch({ type: SET_ERROR, error: response.errors[0].message }); + if (!response.errors) { + setMapGroups( + new Map( + mapGroups.set( + environment.environmentUri, + response.data.listEnvironmentGroups.nodes + ) + ) + ); //Array of groups (Objects) + } else { + dispatch({ type: SET_ERROR, error: response.errors[0].message }); + } + } catch (e) { + dispatch({ type: SET_ERROR, error: e.message }); } - } catch (e) { - dispatch({ type: SET_ERROR, error: e.message }); - } -}; + }; const handleAddEnvRow = () => { if (kvEnvs.length <= 40) { @@ -80,10 +101,10 @@ const PipelineEnvironmentCreateForm = (props) => { const rows = [...prevstate]; if (field === 'stage') { rows[idx].stage = value; - } else if (field === 'env'){ + } else if (field === 'env') { rows[idx].environmentLabel = value.label; rows[idx].environmentUri = value.environmentUri; - } else{ + } else { rows[idx].samlGroupName = value; } return rows; @@ -104,12 +125,11 @@ const PipelineEnvironmentCreateForm = (props) => { createDataPipelineEnvironment({ input: { stage: element.stage, - order: index+1, + order: index + 1, pipelineUri: pipelineUri, environmentLabel: element.environmentLabel, environmentUri: element.environmentUri, samlGroupName: element.samlGroupName - } }) ); @@ -124,19 +144,19 @@ const PipelineEnvironmentCreateForm = (props) => { } useEffect(() => { - if (client && triggerEnvSubmit && pipelineUri && kvEnvs.length > 0) { - kvEnvs.forEach((element, index) => submit(element, index)) - } - if (client && environmentOptions.length > 0) { - environmentOptions.forEach((element) => fetchGroups(element)) - } - }, [client, dispatch, triggerEnvSubmit, pipelineUri, environmentOptions]); + if (client && triggerEnvSubmit && pipelineUri && kvEnvs.length > 0) { + kvEnvs.forEach((element, index) => submit(element, index)); + } + if (client && environmentOptions.length > 0) { + environmentOptions.forEach((element) => fetchGroups(element)); + } + }, [client, dispatch, triggerEnvSubmit, pipelineUri, environmentOptions]); useEffect(() => { - if (kvEnvs.length > 0){ - handleCountEnvironmentValid(true) - }else{ - handleCountEnvironmentValid(false) + if (kvEnvs.length > 0) { + handleCountEnvironmentValid(true); + } else { + handleCountEnvironmentValid(false); } }, [kvEnvs.length]); @@ -152,10 +172,10 @@ const PipelineEnvironmentCreateForm = (props) => { - - - - + + + + {kvEnvs && kvEnvs.length > 0 && ( @@ -175,7 +195,7 @@ const PipelineEnvironmentCreateForm = (props) => { @@ -226,14 +246,17 @@ const PipelineEnvironmentCreateForm = (props) => { select variant="outlined" > - {mapGroups.get(kvEnvs[idx].environmentUri) && (mapGroups.get(kvEnvs[idx].environmentUri).map((g) => ( - - {g.groupUri} - - )))} + {mapGroups.get(kvEnvs[idx].environmentUri) && + mapGroups + .get(kvEnvs[idx].environmentUri) + .map((g) => ( + + {g.groupUri} + + ))}
diff --git a/frontend/src/views/Pipelines/PipelineEnvironmentEditForm.js b/frontend/src/views/Pipelines/PipelineEnvironmentEditForm.js index cbe334fdb..58d2251c8 100644 --- a/frontend/src/views/Pipelines/PipelineEnvironmentEditForm.js +++ b/frontend/src/views/Pipelines/PipelineEnvironmentEditForm.js @@ -1,5 +1,4 @@ import React, { useEffect, useState } from 'react'; -import { useSnackbar } from 'notistack'; import { Box, Button, @@ -29,28 +28,44 @@ import listEnvironmentGroups from '../../api/Environment/listEnvironmentGroups'; import * as Defaults from '../../components/defaults'; const PipelineEnvironmentEditForm = (props) => { - const { environmentOptions, triggerEnvSubmit, pipelineUri, pipeline, handleCountEnvironmentValid } = props; + const { + environmentOptions, + triggerEnvSubmit, + pipelineUri, + pipeline, + handleCountEnvironmentValid + } = props; const dispatch = useDispatch(); - const { enqueueSnackbar } = useSnackbar(); const client = useClient(); const [kvEnvs, setKeyValueEnvs] = useState([]); const [envsToRemove, setEnvsToRemove] = useState([]); const [environments, setEnvironments] = useState([]); - const [mapGroups, setMapGroups] = useState(new Map()) - const stageOps =[{value:"dev", label:"dev"},{value:"test", label:"test"},{value:"val", label:"val"},{value:"prod", label:"prod"},{value:"other", label:"other"}]; - const [environmentOps, setEnvironmentOps] = useState( - environmentOptions && environmentOptions.length > 0 ? environmentOptions : [{ environmentUri: 'someUri', label: 'some' },{ environmentUri: 'someUri', label: 'some2' }] - ); + const [mapGroups, setMapGroups] = useState(new Map()); + const stageOps = [ + { value: 'dev', label: 'dev' }, + { value: 'test', label: 'test' }, + { value: 'val', label: 'val' }, + { value: 'prod', label: 'prod' }, + { value: 'other', label: 'other' } + ]; + + const environmentOps = + environmentOptions && environmentOptions.length > 0 + ? environmentOptions + : [ + { environmentUri: 'someUri', label: 'some' }, + { environmentUri: 'someUri', label: 'some2' } + ]; useEffect(() => { if (client && pipeline) { - console.log("useeffect") - console.log(pipeline) - const environmentsSorted = pipeline.developmentEnvironments.nodes.sort((a, b) => { - return a.order - b.order; - }); + const environmentsSorted = pipeline.developmentEnvironments.nodes.sort( + (a, b) => { + return a.order - b.order; + } + ); if (environmentsSorted) { - environmentsSorted.map((e) => (handleExistingEnvRow(e))) + environmentsSorted.map((e) => handleExistingEnvRow(e)); } } }, [client, pipeline]); @@ -65,7 +80,14 @@ const PipelineEnvironmentEditForm = (props) => { ); if (!response.errors) { - setMapGroups(new Map(mapGroups.set(environment.environmentUri, response.data.listEnvironmentGroups.nodes)) )//Array of groups (Objects) + setMapGroups( + new Map( + mapGroups.set( + environment.environmentUri, + response.data.listEnvironmentGroups.nodes + ) + ) + ); //Array of groups (Objects) } else { dispatch({ type: SET_ERROR, error: response.errors[0].message }); } @@ -118,10 +140,10 @@ const PipelineEnvironmentEditForm = (props) => { const rows = [...prevstate]; if (field === 'stage') { rows[idx].stage = value; - } else if (field === 'env'){ + } else if (field === 'env') { rows[idx].environmentLabel = value.label; rows[idx].environmentUri = value.environmentUri; - } else{ + } else { rows[idx].samlGroupName = value; } return rows; @@ -156,7 +178,6 @@ const PipelineEnvironmentEditForm = (props) => { environmentLabel: element.environmentLabel, environmentUri: element.environmentUri, samlGroupName: element.samlGroupName - } }) ); @@ -212,25 +233,25 @@ const PipelineEnvironmentEditForm = (props) => { } useEffect(() => { - if (client && triggerEnvSubmit && pipelineUri && envsToRemove.length > 0) { - envsToRemove.forEach((element, index) => deleteEnv(element, index)) - } - if (client && triggerEnvSubmit && pipelineUri && environments.length > 0) { - environments.forEach((element, index) => update(element, index)) - } - if (client && triggerEnvSubmit && pipelineUri && kvEnvs.length > 0) { - kvEnvs.forEach((element, index) => submit(element, index)) - } - if (client && environmentOptions.length > 0) { - environmentOptions.forEach((element) => fetchGroups(element)) - } - }, [client, dispatch, triggerEnvSubmit, pipelineUri, environmentOptions]); + if (client && triggerEnvSubmit && pipelineUri && envsToRemove.length > 0) { + envsToRemove.forEach((element, index) => deleteEnv(element, index)); + } + if (client && triggerEnvSubmit && pipelineUri && environments.length > 0) { + environments.forEach((element, index) => update(element, index)); + } + if (client && triggerEnvSubmit && pipelineUri && kvEnvs.length > 0) { + kvEnvs.forEach((element, index) => submit(element, index)); + } + if (client && environmentOptions.length > 0) { + environmentOptions.forEach((element) => fetchGroups(element)); + } + }, [client, dispatch, triggerEnvSubmit, pipelineUri, environmentOptions]); useEffect(() => { - if ((kvEnvs.length + environments.length) > 0){ - handleCountEnvironmentValid(true) - }else{ - handleCountEnvironmentValid(false) + if (kvEnvs.length + environments.length > 0) { + handleCountEnvironmentValid(true); + } else { + handleCountEnvironmentValid(false); } }, [kvEnvs.length, environments.length]); @@ -239,18 +260,18 @@ const PipelineEnvironmentEditForm = (props) => { - + - - - - - + + + + + {environments && environments.length > 0 && ( @@ -261,64 +282,64 @@ const PipelineEnvironmentEditForm = (props) => { Team AWS Account - + )} {environments.map((item, idx) => ( - <> - - - - - - - - - - - - - - - - - - - - ))} + <> + + + + + + + + + + + + + + + + + + + + ))}
- { - handleRemoveExistingEnvRow(idx); - }} - > - - - + { + handleRemoveExistingEnvRow(idx); + }} + > + + +
@@ -333,10 +354,10 @@ const PipelineEnvironmentEditForm = (props) => { - - - - + + + + {kvEnvs && kvEnvs.length > 0 && ( @@ -356,7 +377,11 @@ const PipelineEnvironmentEditForm = (props) => { @@ -407,14 +432,17 @@ const PipelineEnvironmentEditForm = (props) => { select variant="outlined" > - {mapGroups.get(kvEnvs[idx].environmentUri) && (mapGroups.get(kvEnvs[idx].environmentUri).map((g) => ( - - {g.groupUri} - - )))} + {mapGroups.get(kvEnvs[idx].environmentUri) && + mapGroups + .get(kvEnvs[idx].environmentUri) + .map((g) => ( + + {g.groupUri} + + ))}
diff --git a/frontend/src/views/Pipelines/PipelineEnvironments.js b/frontend/src/views/Pipelines/PipelineEnvironments.js index b3aefd47d..2606e6c56 100644 --- a/frontend/src/views/Pipelines/PipelineEnvironments.js +++ b/frontend/src/views/Pipelines/PipelineEnvironments.js @@ -1,49 +1,35 @@ -import React, {useCallback, useEffect, useState} from 'react'; -import { useSnackbar } from 'notistack'; +import React, { useEffect, useState } from 'react'; import { Box, - Button, Card, CardContent, CardHeader, Divider, Grid, - IconButton, - MenuItem, Table, TableBody, TableCell, TableHead, - TableRow, - TextField + TableRow } from '@mui/material'; -import { DeleteOutlined } from '@mui/icons-material'; import PropTypes from 'prop-types'; -import { LoadingButton } from '@mui/lab'; import useClient from '../../hooks/useClient'; -import { SET_ERROR } from '../../store/errorReducer'; -import { useDispatch } from '../../store'; -import * as Defaults from '../../components/defaults'; const PipelineEnvironments = (props) => { const { pipeline } = props; - const dispatch = useDispatch(); - const { enqueueSnackbar } = useSnackbar(); const client = useClient(); const [environments, setEnvironments] = useState([]); - const [loading, setLoading] = useState(true); useEffect(() => { - if (client && pipeline) { - console.log("useeffect") - console.log(pipeline) - const environmentsSorted = pipeline.developmentEnvironments.nodes.sort((a, b) => { + if (client && pipeline) { + const environmentsSorted = pipeline.developmentEnvironments.nodes.sort( + (a, b) => { return a.order - b.order; - }); - setEnvironments(environmentsSorted) - console.log(environments) - } - }, [client, pipeline]); + } + ); + setEnvironments(environmentsSorted); + } + }, [client, pipeline]); return ( <> @@ -57,11 +43,11 @@ const PipelineEnvironments = (props) => { - - - - - + + + + + {environments > 0 && ( @@ -75,17 +61,18 @@ const PipelineEnvironments = (props) => { )} - {environments && (environments.map((e) => ( - <> - - {e.order} - {e.stage} - {e.environmentLabel} - {e.samlGroupName} - {e.AwsAccountId} - - - )))} + {environments && + environments.map((e) => ( + <> + + {e.order} + {e.stage} + {e.environmentLabel} + {e.samlGroupName} + {e.AwsAccountId} + + + ))}
diff --git a/frontend/src/views/Pipelines/PipelineList.js b/frontend/src/views/Pipelines/PipelineList.js index e3ff00c95..cf2c945d1 100644 --- a/frontend/src/views/Pipelines/PipelineList.js +++ b/frontend/src/views/Pipelines/PipelineList.js @@ -28,7 +28,6 @@ import listDataPipelines from '../../api/DataPipeline/listDataPipelines'; import ChipInput from '../../components/TagsInput'; import { AwsRegions } from '../../constants'; - function PipelinesPageHeader() { return ( { const [inputValue, setInputValue] = useState(''); const [loading, setLoading] = useState(true); const client = useClient(); - const devOptions =[{value:"cdk-trunk", label:"CDK Pipelines - Trunk-based"},{value:"trunk", label:"CodePipeline - Trunk-based"},{value:"gitflow", label:"CodePipeline - Gitflow"},{value:"template", label:"GitHub Template"}];/*DBT Pipelines*/ - const [filterItems] = useState([{title:'DevStrategy', options: devOptions},{title:'Tags'},{title: 'Region', options: AwsRegions}]); + const devOptions = [ + { value: 'cdk-trunk', label: 'CDK Pipelines - Trunk-based' }, + { value: 'trunk', label: 'CodePipeline - Trunk-based' }, + { value: 'gitflow', label: 'CodePipeline - Gitflow' }, + { value: 'template', label: 'GitHub Template' } + ]; /*DBT Pipelines*/ + const [filterItems] = useState([ + { title: 'DevStrategy', options: devOptions }, + { title: 'Tags' }, + { title: 'Region', options: AwsRegions } + ]); const fetchItems = useCallback(async () => { setLoading(true); @@ -107,7 +115,7 @@ const PipelineList = () => { const handleInputKeyup = (event) => { if (event.code === 'Enter') { - setFilter({...filter, page: 1, term: event.target.value}); + setFilter({ ...filter, page: 1, term: event.target.value }); } }; @@ -118,14 +126,14 @@ const PipelineList = () => { }; const handleFilterChange = (filterLabel, values) => { - if (filterLabel === "Region"){ - const selectedRegions = values.map((region) => region.value) - setFilter({ ...filter, region: selectedRegions}); - } else if (filterLabel === "Tags"){ + if (filterLabel === 'Region') { + const selectedRegions = values.map((region) => region.value); + setFilter({ ...filter, region: selectedRegions }); + } else if (filterLabel === 'Tags') { setFilter({ ...filter, tags: values }); - } else if (filterLabel === "DevStrategy"){ - const selectedTypes = values.map((type) => type.value) - setFilter({ ...filter, type: selectedTypes }) + } else if (filterLabel === 'DevStrategy') { + const selectedTypes = values.map((type) => type.value); + setFilter({ ...filter, type: selectedTypes }); } }; @@ -166,14 +174,16 @@ const PipelineList = () => { {filterItems.map((item) => ( - {item.title != 'Tags' - ? option.label} - onChange={(event, value) => handleFilterChange(item.title, value)} + onChange={(event, value) => + handleFilterChange(item.title, value) + } renderInput={(regionParams) => ( { /> )} /> - : handleFilterChange(item.title, e)} /> - } + )} ))} diff --git a/frontend/src/views/Pipelines/PipelineOverview.js b/frontend/src/views/Pipelines/PipelineOverview.js index 3f0938d69..88ccc3ba2 100644 --- a/frontend/src/views/Pipelines/PipelineOverview.js +++ b/frontend/src/views/Pipelines/PipelineOverview.js @@ -11,43 +11,43 @@ const PipelineOverview = (props) => { return ( - - - - - - - - - - + + + + + + + + + + - - - - - - - - 0 ? pipeline.tags : ['-'] - } - /> - - + + + + + + + + 0 + ? pipeline.tags + : ['-'] + } + /> + + ); diff --git a/frontend/src/views/Pipelines/PipelineView.js b/frontend/src/views/Pipelines/PipelineView.js index 77cf3bc0b..3316022f0 100644 --- a/frontend/src/views/Pipelines/PipelineView.js +++ b/frontend/src/views/Pipelines/PipelineView.js @@ -18,12 +18,7 @@ import { FaAws, FaTrash } from 'react-icons/fa'; import { useNavigate } from 'react-router'; import * as PropTypes from 'prop-types'; import { useSnackbar } from 'notistack'; -import { - ForumOutlined, - Info, - LocalOffer, - PlaylistPlay -} from '@mui/icons-material'; +import { ForumOutlined, Info, LocalOffer } from '@mui/icons-material'; import useSettings from '../../hooks/useSettings'; import useClient from '../../hooks/useClient'; import ChevronRightIcon from '../../icons/ChevronRight'; @@ -39,7 +34,6 @@ import StackStatus from '../Stack/StackStatus'; import KeyValueTagList from '../KeyValueTags/KeyValueTagList'; import FeedComments from '../Feed/FeedComments'; - function PipelineViewPageHeader({ pipeline, deletePipeline }) { const [openFeed, setOpenFeed] = useState(false); return ( @@ -138,13 +132,14 @@ const PipelineView = () => { const [loading, setLoading] = useState(true); const [pipeline, setPipeline] = useState(null); const [stack, setStack] = useState(null); - const [cdkTrunk, setCdkTrunk] = useState(null); const [isDeleteObjectModalOpen, setIsDeleteObjectModalOpen] = useState(false); - const [tabs, setTabs] = useState([ + const tabs = [ { label: 'Overview', value: 'overview', icon: }, { label: 'Tags', value: 'tags', icon: }, - { label: 'Stack', value: 'stack', icon: }]); - const handleDeleteObjectModalOpen = () => { + { label: 'Stack', value: 'stack', icon: } + ]; + + const handleDeleteObjectModalOpen = () => { setIsDeleteObjectModalOpen(true); }; @@ -165,7 +160,7 @@ const PipelineView = () => { } setLoading(false); }, [client, dispatch, params.uri, stack]); - + useEffect(() => { if (client) { fetchItem().catch((e) => dispatch({ type: SET_ERROR, error: e.message })); @@ -263,7 +258,11 @@ const PipelineView = () => { environmentUri={pipeline.environment.environmentUri} stackUri={pipeline.stack.stackUri} targetUri={pipeline.DataPipelineUri} - targetType={pipeline.devStrategy == 'cdk-trunk' ? "cdkpipeline" : "pipeline"} + targetType={ + pipeline.devStrategy === 'cdk-trunk' + ? 'cdkpipeline' + : 'pipeline' + } /> )} diff --git a/frontend/src/views/Shares/RevokeShareItemsModal.js b/frontend/src/views/Shares/RevokeShareItemsModal.js index ccff68e5d..9e9954ab4 100644 --- a/frontend/src/views/Shares/RevokeShareItemsModal.js +++ b/frontend/src/views/Shares/RevokeShareItemsModal.js @@ -1,13 +1,7 @@ import PropTypes from 'prop-types'; import { useSnackbar } from 'notistack'; -import { - Box, Card, - Dialog, - Divider, - IconButton, - Typography -} from '@mui/material'; -import {Add, SyncAlt} from '@mui/icons-material'; +import { Box, Card, Dialog, Divider, Typography } from '@mui/material'; +import { SyncAlt } from '@mui/icons-material'; import React, { useCallback, useEffect, useState } from 'react'; import { useParams } from 'react-router-dom'; import { SET_ERROR } from '../../store/errorReducer'; @@ -16,14 +10,13 @@ import useClient from '../../hooks/useClient'; import * as Defaults from '../../components/defaults'; import getShareObject from '../../api/ShareObject/getShareObject'; import revokeItemsShareObject from '../../api/ShareObject/revokeItemsShareObject'; -import {LoadingButton} from "@mui/lab"; -import {DataGrid} from "@mui/x-data-grid"; +import { LoadingButton } from '@mui/lab'; +import { DataGrid } from '@mui/x-data-grid'; const RevokeShareItemsModal = (props) => { const client = useClient(); const { share, onApply, onClose, open, reloadSharedItems, ...other } = props; const { enqueueSnackbar } = useSnackbar(); - const [filter, setFilter] = useState(Defaults.DefaultFilter); const [rows, setRows] = useState([]); const dispatch = useDispatch(); const params = useParams(); @@ -37,7 +30,7 @@ const RevokeShareItemsModal = (props) => { getShareObject({ shareUri: params.uri, filter: { - ...filter, + ...Defaults.DefaultFilter, pageSize: 1000, isShared: true, isRevokable: true @@ -46,19 +39,18 @@ const RevokeShareItemsModal = (props) => { ); if (!response.errors) { setRows( - response.data.getShareObject.items.nodes.map((item) => ({ - id: item.shareItemUri, - name: item.itemName, - type: item.itemType == "StorageLocation"? "Folder": "Table", - status: item.status - })) + response.data.getShareObject.items.nodes.map((item) => ({ + id: item.shareItemUri, + name: item.itemName, + type: item.itemType === 'StorageLocation' ? 'Folder' : 'Table', + status: item.status + })) ); } else { dispatch({ type: SET_ERROR, error: response.errors[0].message }); } setLoading(false); - }, [client, dispatch, params.uri, filter]); - + }, [client, dispatch, params.uri, Defaults.DefaultFilter]); const revoke = async () => { setLoading(true); @@ -85,7 +77,7 @@ const RevokeShareItemsModal = (props) => { } setLoading(false); }; - + useEffect(() => { if (client) { fetchShareItems().catch((e) => @@ -93,7 +85,7 @@ const RevokeShareItemsModal = (props) => { ); } }, [client, dispatch, fetchShareItems]); - + if (!share) { return null; } @@ -103,7 +95,7 @@ const RevokeShareItemsModal = (props) => { const header = [ { field: 'name', headerName: 'Name', width: 200, editable: false }, { field: 'type', headerName: 'Type', width: 300, editable: false }, - { field: 'status', headerName: 'Status', width: 300, editable: false }, + { field: 'status', headerName: 'Status', width: 300, editable: false } ]; return ( @@ -119,18 +111,18 @@ const RevokeShareItemsModal = (props) => { { - "After selecting the items that you want to revoke, click on Revoke Selected Items" + 'After selecting the items that you want to revoke, click on Revoke Selected Items' } - - + + {!loading && rows.length > 0 ? ( setPageSize(newPageSize)} checkboxSelection onSelectionModelChange={(newSelection) => { @@ -145,23 +137,23 @@ const RevokeShareItemsModal = (props) => { )} + } + sx={{ m: 1 }} + variant="outlined" > - } - sx={{ m: 1 }} - variant="outlined" - > - Revoke Selected Items - + Revoke Selected Items + diff --git a/frontend/src/views/Shares/ShareInboxListItem.js b/frontend/src/views/Shares/ShareInboxListItem.js index 1a5562ada..ebc4b86c3 100644 --- a/frontend/src/views/Shares/ShareInboxListItem.js +++ b/frontend/src/views/Shares/ShareInboxListItem.js @@ -14,8 +14,7 @@ import ShareStatus from '../../components/ShareStatus'; import TextAvatar from '../../components/TextAvatar'; import useCardStyle from '../../hooks/useCardStyle'; -const ShareInboxListItem = (props) => { - const { share, reload } = props; +const ShareInboxListItem = ({ share }) => { const classes = useCardStyle(); return ( @@ -84,51 +83,51 @@ const ShareInboxListItem = (props) => { - - - {`Currently shared items: ${share.statistics.sharedItems}`} - - - - - {`Revoked items: ${share.statistics.revokedItems}`} - - - - - {`Failed items: ${share.statistics.failedItems}`} - - - - - {`Pending items: ${share.statistics.pendingItems}`} - - + + + {`Currently shared items: ${share.statistics.sharedItems}`} + + + + + {`Revoked items: ${share.statistics.revokedItems}`} + + + + + {`Failed items: ${share.statistics.failedItems}`} + + + + + {`Pending items: ${share.statistics.pendingItems}`} + + diff --git a/frontend/src/views/Shares/ShareOutboxListItem.js b/frontend/src/views/Shares/ShareOutboxListItem.js index bb00bf1b4..d4a11a578 100644 --- a/frontend/src/views/Shares/ShareOutboxListItem.js +++ b/frontend/src/views/Shares/ShareOutboxListItem.js @@ -13,8 +13,7 @@ import PropTypes from 'prop-types'; import ShareStatus from '../../components/ShareStatus'; import TextAvatar from '../../components/TextAvatar'; -const ShareOutboxListItem = (props) => { - const { share, reload } = props; +const ShareOutboxListItem = ({ share }) => { return ( { - - - {`Currently shared items: ${share.statistics.sharedItems}`} - - - - - {`Revoked items: ${share.statistics.revokedItems}`} - - - - - {`Failed items: ${share.statistics.failedItems}`} - - - - - {`Pending items: ${share.statistics.pendingItems}`} - - + + + {`Currently shared items: ${share.statistics.sharedItems}`} + + + + + {`Revoked items: ${share.statistics.revokedItems}`} + + + + + {`Failed items: ${share.statistics.failedItems}`} + + + + + {`Pending items: ${share.statistics.pendingItems}`} + + diff --git a/frontend/src/views/Shares/ShareView.js b/frontend/src/views/Shares/ShareView.js index e26e05d4e..a8b04db1a 100644 --- a/frontend/src/views/Shares/ShareView.js +++ b/frontend/src/views/Shares/ShareView.js @@ -30,7 +30,6 @@ import { CopyAllOutlined, DeleteOutlined, RemoveCircleOutlineOutlined, - LockRounded, RefreshRounded } from '@mui/icons-material'; import { LoadingButton } from '@mui/lab'; @@ -60,7 +59,6 @@ import deleteShareObject from '../../api/ShareObject/deleteShareObject.js'; import submitApproval from '../../api/ShareObject/submitApproval'; import removeSharedItem from '../../api/ShareObject/removeSharedItem'; - function ShareViewHeader(props) { const { share, @@ -75,7 +73,7 @@ function ShareViewHeader(props) { const [accepting, setAccepting] = useState(false); const [rejecting, setRejecting] = useState(false); const [submitting, setSubmitting] = useState(false); - const [removing, setRemoving] = useState(false); + const submit = async () => { setSubmitting(true); const response = await client.mutate( @@ -83,6 +81,7 @@ function ShareViewHeader(props) { shareUri: share.shareUri }) ); + if (!response.errors) { enqueueSnackbar('Share request submitted', { anchorOrigin: { @@ -97,13 +96,14 @@ function ShareViewHeader(props) { } setSubmitting(false); }; + const remove = async () => { - setRemoving(true); const response = await client.mutate( deleteShareObject({ shareUri: share.shareUri }) ); + if (!response.errors) { enqueueSnackbar('Share request deleted', { anchorOrigin: { @@ -116,8 +116,8 @@ function ShareViewHeader(props) { } else { dispatch({ type: SET_ERROR, error: response.errors[0].message }); } - setRemoving(false); }; + const accept = async () => { setAccepting(true); const response = await client.mutate( @@ -125,6 +125,7 @@ function ShareViewHeader(props) { shareUri: share.shareUri }) ); + if (!response.errors) { enqueueSnackbar('Share request approved', { anchorOrigin: { @@ -140,6 +141,7 @@ function ShareViewHeader(props) { } setAccepting(false); }; + const reject = async () => { setRejecting(true); const response = await client.mutate( @@ -147,6 +149,7 @@ function ShareViewHeader(props) { shareUri: share.shareUri }) ); + if (!response.errors) { enqueueSnackbar('Share request rejected', { anchorOrigin: { @@ -162,6 +165,7 @@ function ShareViewHeader(props) { } setRejecting(false); }; + return ( @@ -329,38 +333,34 @@ function SharedItem(props) { - {(isRemovingItem) ? ( + {isRemovingItem ? ( ) : ( - <> - { - (item.status === 'Share_Succeeded' || item.status === 'Revoke_Failed') ? ( - - Revoke access to this item before deleting - - ) : (item.status === 'Share_Approved' || item.status === 'Revoke_Approved' || item.status === 'Revoke_In_Progress' || item.status === 'Share_In_Progress') ? ( - - Wait until this item is processed - - ) : ( - - ) - } - + <> + {item.status === 'Share_Succeeded' || + item.status === 'Revoke_Failed' ? ( + + Revoke access to this item before deleting + + ) : item.status === 'Share_Approved' || + item.status === 'Revoke_Approved' || + item.status === 'Revoke_In_Progress' || + item.status === 'Share_In_Progress' ? ( + + Wait until this item is processed + + ) : ( + + )} + )} @@ -391,10 +391,18 @@ const ShareView = () => { const [loadingShareItems, setLoadingShareItems] = useState(false); const [isAddItemModalOpen, setIsAddItemModalOpen] = useState(false); const [isRevokeItemsModalOpen, setIsRevokeItemsModalOpen] = useState(false); - const handleAddItemModalOpen = () => {setIsAddItemModalOpen(true);}; - const handleAddItemModalClose = () => {setIsAddItemModalOpen(false);}; - const handleRevokeItemModalOpen = () => {setIsRevokeItemsModalOpen(true);}; - const handleRevokeItemModalClose = () => {setIsRevokeItemsModalOpen(false);}; + const handleAddItemModalOpen = () => { + setIsAddItemModalOpen(true); + }; + const handleAddItemModalClose = () => { + setIsAddItemModalOpen(false); + }; + const handleRevokeItemModalOpen = () => { + setIsRevokeItemsModalOpen(true); + }; + const handleRevokeItemModalClose = () => { + setIsRevokeItemsModalOpen(false); + }; const handlePageChange = async (event, value) => { if (value <= sharedItems.pages && value !== sharedItems.page) { await setFilter({ ...filter, isShared: true, page: value }); @@ -409,7 +417,7 @@ const ShareView = () => { variant: 'success' }); }; - + const fetchItem = useCallback(async () => { setLoading(true); const response = await client.query( @@ -446,7 +454,7 @@ const ShareView = () => { }, [client, dispatch, filter, fetchItem, params.uri] ); - + useEffect(() => { if (client) { fetchItem().catch((e) => dispatch({ type: SET_ERROR, error: e.message })); @@ -695,10 +703,18 @@ const ShareView = () => { - + S3 Access Point name (Folder sharing): - + {` ${share.consumptionData.s3AccessPointName || '-'}`} @@ -721,11 +737,21 @@ const ShareView = () => { - + Glue database name (Table sharing): - - {` ${share.consumptionData.sharedGlueDatabase || '-'}`} + + {` ${ + share.consumptionData.sharedGlueDatabase || '-' + }`} { onClick={handleRevokeItemModalOpen} type="button" variant="outlined" - > + > Revoke Items diff --git a/frontend/src/views/Tables/TableColumns.js b/frontend/src/views/Tables/TableColumns.js index 346da5914..4bf3c2cb0 100644 --- a/frontend/src/views/Tables/TableColumns.js +++ b/frontend/src/views/Tables/TableColumns.js @@ -43,7 +43,7 @@ const TableColumns = (props) => { } }; - const handleEditCellChangeCommitted = (e:GridCellEditCommitParams) => { + const handleEditCellChangeCommitted = (e: GridCellEditCommitParams) => { const data = e.value; if (e.field === 'description') { columns.map((c) => { diff --git a/frontend/src/views/Worksheets/WorksheetList.js b/frontend/src/views/Worksheets/WorksheetList.js index 9d6a7b55a..28f68ecb0 100644 --- a/frontend/src/views/Worksheets/WorksheetList.js +++ b/frontend/src/views/Worksheets/WorksheetList.js @@ -108,7 +108,7 @@ const WorksheetList = () => { const handleInputKeyup = (event) => { if (event.code === 'Enter') { - setFilter({page: 1, term: event.target.value}); + setFilter({ page: 1, term: event.target.value }); fetchItems().catch((e) => dispatch({ type: SET_ERROR, error: e.message }) ); diff --git a/frontend/src/views/Worksheets/WorksheetView.js b/frontend/src/views/Worksheets/WorksheetView.js index 52f1c6121..62f875692 100644 --- a/frontend/src/views/Worksheets/WorksheetView.js +++ b/frontend/src/views/Worksheets/WorksheetView.js @@ -43,8 +43,6 @@ import WorksheetEditFormModal from './WorksheetEditFormModal'; import DeleteObjectWithFrictionModal from '../../components/DeleteObjectWithFrictionModal'; import * as Defaults from '../../components/defaults'; - - const WorksheetView = () => { const navigate = useNavigate(); const params = useParams(); @@ -135,24 +133,26 @@ const WorksheetView = () => { let sharedWithDatabases = []; let response = await client.query( listDatasetsOwnedByEnvGroup({ - filter: { - term: '', - page: 1, + filter: { + term: '', + page: 1, pageSize: 10000 }, environmentUri: environment.environmentUri, groupUri: team - })); + }) + ); if (response.errors) { dispatch({ type: SET_ERROR, error: response.errors[0].message }); } if (response.data.listDatasetsOwnedByEnvGroup.nodes) { - ownedDatabases = - response.data.listDatasetsOwnedByEnvGroup.nodes?.map((d) => ({ + ownedDatabases = response.data.listDatasetsOwnedByEnvGroup.nodes?.map( + (d) => ({ ...d, value: d.datasetUri, label: d.GlueDatabaseName - })); + }) + ); } response = await client.query( searchEnvironmentDataItems({ @@ -175,7 +175,8 @@ const WorksheetView = () => { datasetUri: d.datasetUri, value: d.datasetUri, label: `${d.GlueDatabaseName}_shared_${d.shareUri}`, - GlueDatabaseName: `${d.GlueDatabaseName}_shared_${d.shareUri}`.substring(0,254), + GlueDatabaseName: + `${d.GlueDatabaseName}_shared_${d.shareUri}`.substring(0, 254), environmentUri: d.environmentUri })); } @@ -187,15 +188,15 @@ const WorksheetView = () => { const fetchTables = useCallback( async (environment, dataset) => { setLoadingTables(true); - let response = "" - if (dataset.GlueDatabaseName.includes(dataset.datasetUri+"_shared_")){ + let response = ''; + if (dataset.GlueDatabaseName.includes(dataset.datasetUri + '_shared_')) { response = await client.query( getSharedDatasetTables({ datasetUri: dataset.datasetUri, envUri: environment.environmentUri }) ); - } else{ + } else { response = await client.query( listDatasetTables({ datasetUri: dataset.datasetUri, @@ -204,25 +205,24 @@ const WorksheetView = () => { ); } - if (!response.errors && dataset.GlueDatabaseName.includes(dataset.datasetUri+"_shared_")) { + if ( + !response.errors && + dataset.GlueDatabaseName.includes(dataset.datasetUri + '_shared_') + ) { setTableOptions( - response.data.getSharedDatasetTables.map((t) => ( - { - ...t, - value: t.tableUri, - label: t.GlueTableName - } - )) + response.data.getSharedDatasetTables.map((t) => ({ + ...t, + value: t.tableUri, + label: t.GlueTableName + })) ); - } else if(!response.errors){ + } else if (!response.errors) { setTableOptions( - response.data.getDataset.tables.nodes.map((t) => ( - { - ...t, - value: t.tableUri, - label: t.GlueTableName - } - )) + response.data.getDataset.tables.nodes.map((t) => ({ + ...t, + value: t.tableUri, + label: t.GlueTableName + })) ); } else { dispatch({ type: SET_ERROR, error: response.errors[0].message }); @@ -285,9 +285,9 @@ const WorksheetView = () => { setRunningQuery(true); const response = await client.query( runAthenaSqlQuery({ - sqlQuery: sqlBody, - environmentUri:currentEnv.environmentUri, - worksheetUri: worksheet.worksheetUri + sqlQuery: sqlBody, + environmentUri: currentEnv.environmentUri, + worksheetUri: worksheet.worksheetUri }) ); if (!response.errors) { @@ -357,11 +357,9 @@ const WorksheetView = () => { setTableOptions([]); setCurrentTeam(''); setCurrentEnv(event.target.value); - fetchGroups( - event.target.value.environmentUri - ).catch((e) => - dispatch({ type: SET_ERROR, error: e.message }) - ); + fetchGroups(event.target.value.environmentUri).catch((e) => + dispatch({ type: SET_ERROR, error: e.message }) + ); } function handleTeamChange(event) { @@ -372,7 +370,7 @@ const WorksheetView = () => { setTableOptions([]); setCurrentTeam(event.target.value); fetchDatabases(currentEnv, event.target.value).catch((e) => - dispatch({ type: SET_ERROR, error: e.message }) + dispatch({ type: SET_ERROR, error: e.message }) ); } @@ -482,9 +480,7 @@ const WorksheetView = () => { }} > {groupOptions.map((group) => ( - + {group.label} ))} diff --git a/frontend/yarn.lock b/frontend/yarn.lock index 8dc48c22b..43c070a54 100644 --- a/frontend/yarn.lock +++ b/frontend/yarn.lock @@ -6775,6 +6775,11 @@ escodegen@^2.0.0: optionalDependencies: source-map "~0.6.1" +eslint-config-prettier@^8.8.0: + version "8.8.0" + resolved "https://registry.yarnpkg.com/eslint-config-prettier/-/eslint-config-prettier-8.8.0.tgz#bfda738d412adc917fd7b038857110efe98c9348" + integrity sha512-wLbQiFre3tdGgpDv67NQKnJuTlcUVYHas3k+DZCc2U2BadthoEY4B7hLPvAxaqdyOGCzuLfii2fqGph10va7oA== + eslint-config-react-app@^7.0.1: version "7.0.1" resolved "https://registry.npmjs.org/eslint-config-react-app/-/eslint-config-react-app-7.0.1.tgz" @@ -6863,6 +6868,13 @@ eslint-plugin-jsx-a11y@^6.5.1: minimatch "^3.1.2" semver "^6.3.0" +eslint-plugin-prettier@^4.2.1: + version "4.2.1" + resolved "https://registry.yarnpkg.com/eslint-plugin-prettier/-/eslint-plugin-prettier-4.2.1.tgz#651cbb88b1dab98bfd42f017a12fa6b2d993f94b" + integrity sha512-f/0rXLXUt0oFYs8ra4w49wYZBG5GKZpAYsJSm6rnYL5uVDjd+zowwMwVZHnAjf4edNrKpCDYfXDgmRE/Ak7QyQ== + dependencies: + prettier-linter-helpers "^1.0.0" + eslint-plugin-react-hooks@^4.3.0: version "4.6.0" resolved "https://registry.npmjs.org/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-4.6.0.tgz" @@ -7125,6 +7137,11 @@ fast-deep-equal@^3.1.1, fast-deep-equal@^3.1.3: resolved "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz" integrity sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q== +fast-diff@^1.1.2: + version "1.2.0" + resolved "https://registry.yarnpkg.com/fast-diff/-/fast-diff-1.2.0.tgz#73ee11982d86caaf7959828d519cfe927fac5f03" + integrity sha512-xJuoT5+L99XlZ8twedaRf6Ax2TgQVxvgZOYoPKqZufmJib0tL2tegPBOZb1pVNgIhlqDlA0eO0c3wBvQcmzx4w== + fast-glob@^3.2.12, fast-glob@^3.2.9: version "3.2.12" resolved "https://registry.npmjs.org/fast-glob/-/fast-glob-3.2.12.tgz" @@ -10232,10 +10249,17 @@ prelude-ls@~1.1.2: resolved "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.1.2.tgz" integrity sha512-ESF23V4SKG6lVSGZgYNpbsiaAkdab6ZgOxe52p7+Kid3W3u3bxR4Vfd/o21dmN7jSt0IwgZ4v5MUd26FEtXE9w== -prettier@^2.6.1: - version "2.6.1" - resolved "https://registry.npmjs.org/prettier/-/prettier-2.6.1.tgz" - integrity sha512-8UVbTBYGwN37Bs9LERmxCPjdvPxlEowx2urIL6urHzdb3SDq4B/Z6xLFCblrSnE4iKWcS6ziJ3aOYrc1kz/E2A== +prettier-linter-helpers@^1.0.0: + version "1.0.0" + resolved "https://registry.yarnpkg.com/prettier-linter-helpers/-/prettier-linter-helpers-1.0.0.tgz#d23d41fe1375646de2d0104d3454a3008802cf7b" + integrity sha512-GbK2cP9nraSSUF9N2XwUwqfzlAFlMNYYl+ShE/V+H8a9uNl/oUqB1w2EL54Jh0OlyRSd8RfWYJ3coVS4TROP2w== + dependencies: + fast-diff "^1.1.2" + +prettier@2.8.7: + version "2.8.7" + resolved "https://registry.yarnpkg.com/prettier/-/prettier-2.8.7.tgz#bb79fc8729308549d28fe3a98fce73d2c0656450" + integrity sha512-yPngTo3aXUUmyuTjeTUT75txrf+aMh9FiD7q9ZE/i6r0bPb22g4FsE6Y338PQX1bmfy08i9QQCB7/rcUAVntfw== pretty-bytes@^5.3.0, pretty-bytes@^5.4.1: version "5.6.0"