feat: TT-164 rename and more (#222)

* feat(permision): add user permissions to the application

* fix(scopes): New task disabled if no access

* fix(scopes): remove package manager line

* fix(quick): rename job into task

* fix(rm): fix rebase miskate

* fix(chore): change cancel confirmation text

Author: safeamiiir

aqueductcore/frontend/src/App.tsx

@@ -8,7 +8,7 @@ import { Toaster } from "react-hot-toast";
 import ExperimentRecordsPage from "pages/ExperimentRecordsPage";
 import ExperimentDetailsPage from "pages/ExperimentDetailsPage";
 import AuthenticationPage from "pages/AuthenticationPage";
-import JobHistoryPage from "pages/JobHistoryPage";
+import TaskHistoryPage from "pages/TaskHistoryPage";
 import SettingsPage from "pages/SettingsPage";
 import DrawerLayout from "components/templates/drawerLayout";
 import { AuthProvider } from "context/AuthProvider";
@@ -48,8 +48,8 @@ function App() {
                   element={<ExperimentDetailsPage />}
                 />
                 <Route
-                  path="/aqd/job-history"
-                  element={<JobHistoryPage />}
+                  path="/aqd/task-history"
+                  element={<TaskHistoryPage />}
                 />
                 <Route
                   path="/settings"

aqueductcore/frontend/src/__mocks__/queries/tasks/getAllTasks.tsx

@@ -1,6 +1,6 @@
 import { selected_experiment } from "__mocks__/queries/experiment/getExperimentByIdMock";
 import { GET_ALL_TASKS } from "API/graphql/queries/tasks/getAllTasks";
-import { jobListRowsPerPageOptions } from "constants/constants";
+import { taskListRowsPerPageOptions } from "constants/constants";
 import { TasksDataMock } from "__mocks__/TasksDataMock";
 
 const request = {
@@ -14,15 +14,15 @@ export const getAllTasks_mock = {
                 ...request,
                 variables: {
                     offset: 0,
-                    limit: jobListRowsPerPageOptions[0],
+                    limit: taskListRowsPerPageOptions[0],
                     filters: {}
                 }
             },
             result: {
                 data: {
                     tasks: {
-                        tasksData: TasksDataMock.slice(0, jobListRowsPerPageOptions[0]),
-                        totalTasksCount: TasksDataMock.slice(0, jobListRowsPerPageOptions[0]).length
+                        tasksData: TasksDataMock.slice(0, taskListRowsPerPageOptions[0]),
+                        totalTasksCount: TasksDataMock.slice(0, taskListRowsPerPageOptions[0]).length
                     }
                 },
             },
@@ -33,7 +33,7 @@ export const getAllTasks_mock = {
                 ...request,
                 variables: {
                     offset: 0,
-                    limit: jobListRowsPerPageOptions[0],
+                    limit: taskListRowsPerPageOptions[0],
                     filters: {
                         experiment: {
                             type: 'UUID',
@@ -45,8 +45,8 @@ export const getAllTasks_mock = {
             result: {
                 data: {
                     tasks: {
-                        tasksData: TasksDataMock.slice(0, jobListRowsPerPageOptions[0]),
-                        totalTasksCount: TasksDataMock.slice(0, jobListRowsPerPageOptions[0]).length
+                        tasksData: TasksDataMock.slice(0, taskListRowsPerPageOptions[0]),
+                        totalTasksCount: TasksDataMock.slice(0, taskListRowsPerPageOptions[0]).length
                     }
                 },
             },

aqueductcore/frontend/src/__tests__/JobDetailsModal.test.tsx renamed to aqueductcore/frontend/src/__tests__/TaskDetailsModal.test.tsx

@@ -1,6 +1,6 @@
 import { render, waitFor } from "@testing-library/react";
 
-import JobDetailsModal from "components/organisms/JobDetailsModal";
+import TaskDetailsModal from "components/organisms/TaskDetailsModal";
 import AppContextAQDMock from "__mocks__/AppContextAQDMock";
 import { PendingTaskId, SampleTaskId } from "__mocks__/TasksDataMock";
 import userEvent from "@testing-library/user-event";
@@ -10,7 +10,7 @@ const mockHandleClose = jest.fn();
 test("cancel button should not get rendered for failed task", async () => {
     const { queryByText } = render(
         <AppContextAQDMock>
-            <JobDetailsModal isOpen={true} handleClose={mockHandleClose} taskId={SampleTaskId} />
+            <TaskDetailsModal isOpen={true} handleClose={mockHandleClose} taskId={SampleTaskId} />
         </AppContextAQDMock>
     );
 
@@ -21,7 +21,7 @@ test("cancel button should not get rendered for failed task", async () => {
 test("cancel button should get rendered for failed task", async () => {
     const { findByText } = render(
         <AppContextAQDMock>
-            <JobDetailsModal isOpen={true} handleClose={mockHandleClose} taskId={PendingTaskId} />
+            <TaskDetailsModal isOpen={true} handleClose={mockHandleClose} taskId={PendingTaskId} />
         </AppContextAQDMock>
     );
 
@@ -32,13 +32,13 @@ test("cancel button should get rendered for failed task", async () => {
 test("clicking on cancel task button cancels task", async () => {
     const { queryByText, findByTitle } = render(
         <AppContextAQDMock>
-            <JobDetailsModal isOpen={true} handleClose={mockHandleClose} taskId={PendingTaskId} />
+            <TaskDetailsModal isOpen={true} handleClose={mockHandleClose} taskId={PendingTaskId} />
         </AppContextAQDMock>
     );
 
     const cancelTaskButton = await findByTitle("cancelTask");
     expect(cancelTaskButton).toBeInTheDocument();
-    
+
     await userEvent.click(cancelTaskButton);
     await userEvent.click(cancelTaskButton);
 
@@ -61,13 +61,13 @@ test("clicking on cancel task button cancels task", async () => {
 test("clicking on cancel from confirmation modal closes modal", async () => {
     const { queryByText, findByTitle } = render(
         <AppContextAQDMock>
-            <JobDetailsModal isOpen={true} handleClose={mockHandleClose} taskId={PendingTaskId} />
+            <TaskDetailsModal isOpen={true} handleClose={mockHandleClose} taskId={PendingTaskId} />
         </AppContextAQDMock>
     );
 
     const cancelTaskButton = await findByTitle("cancelTask");
     expect(cancelTaskButton).toBeInTheDocument();
-    
+
     await userEvent.click(cancelTaskButton);
 
     const cancelTaskConfirmationModalTitle = queryByText(/Are you sure you want to cancel this task?/)

aqueductcore/frontend/src/__tests__/JobHistoryPage.test.tsx renamed to aqueductcore/frontend/src/__tests__/TaskHistoryPage.test.tsx

@@ -1,12 +1,12 @@
 import { render } from "@testing-library/react";
 
 import AppContextAQDMock from "__mocks__/AppContextAQDMock";
-import JobHistoryPage from "pages/JobHistoryPage";
+import TaskHistoryPage from "pages/TaskHistoryPage";
 
-test("render job history page with no error", async () => {
+test("render task history page with no error", async () => {
     render(
         <AppContextAQDMock>
-            <JobHistoryPage />
+            <TaskHistoryPage />
         </AppContextAQDMock>
     )
 });

aqueductcore/frontend/src/components/molecules/JobListTableCells/JobExperimentName/index.tsx renamed to aqueductcore/frontend/src/components/molecules/TaskListTableCells/TaskExperimentName/index.tsx

@@ -21,7 +21,7 @@ const ExperimentEid = styled(Typography)`
     padding: 0 ${(props) => props.theme.spacing(2)};
 `;
 
-function JobExperimentName({ name, eid }: { name: ExperimentData['title'], eid: ExperimentData['eid'] }) {
+function TaskExperimentName({ name, eid }: { name: ExperimentData['title'], eid: ExperimentData['eid'] }) {
     return (
         <ExperimentNameChip container>
             <Grid item>
@@ -36,4 +36,4 @@ function JobExperimentName({ name, eid }: { name: ExperimentData['title'], eid:
     );
 }
 
-export default JobExperimentName;
+export default TaskExperimentName;

aqueductcore/frontend/src/components/molecules/JobListTableCells/JobExtensionActionName/index.tsx renamed to aqueductcore/frontend/src/components/molecules/TaskListTableCells/TaskExtensionActionName/index.tsx

@@ -13,12 +13,12 @@ const ActionName = styled(Typography)`
     font-size: 0.75rem;
 `;
 
-interface JobExtensionActionNameProp {
+interface TaskExtensionActionNameProp {
     name: ExtensionInfo['name'],
     action: ExtensionActionInfo['name']
 }
 
-function JobExtensionActionName({ name, action }: JobExtensionActionNameProp) {
+function TaskExtensionActionName({ name, action }: TaskExtensionActionNameProp) {
     return (
         <ExtensionActionContainer>
             <ExtensionName noWrap>{name}</ExtensionName>
@@ -27,4 +27,4 @@ function JobExtensionActionName({ name, action }: JobExtensionActionNameProp) {
     );
 }
 
-export default JobExtensionActionName;
+export default TaskExtensionActionName;

aqueductcore/frontend/src/components/molecules/JobListTableCells/JobExtensionStatus/index.tsx renamed to aqueductcore/frontend/src/components/molecules/TaskListTableCells/TaskExtensionStatus/index.tsx

@@ -2,7 +2,7 @@ import { Typography, styled } from "@mui/material";
 import Box from "@mui/material/Box";
 
 import { TaskStatus } from "types/graphql/__GENERATED__/graphql";
-import { JobDataType } from "types/globalTypes";
+import { TaskDataType } from "types/globalTypes";
 
 const ExtensionActionContainer = styled(Box)`
     display: inline-block;
@@ -55,9 +55,9 @@ const StatusCancel = styled(StatusBase)`
     border: 1px solid ${({ theme }) => theme.palette.chip.cancelledBorder};
 `;
 
-function JobExtensionStatus({ status }: { status: JobDataType['taskStatus'] }) {
+function TaskExtensionStatus({ status }: { status: TaskDataType['taskStatus'] }) {
 
-    function handleStatus(status: JobDataType['taskStatus']) {
+    function handleStatus(status: TaskDataType['taskStatus']) {
         switch (status) {
             case TaskStatus.Failure:
                 return <StatusFailed>Failed</StatusFailed>
@@ -83,4 +83,4 @@ function JobExtensionStatus({ status }: { status: JobDataType['taskStatus'] }) {
     );
 }
 
-export default JobExtensionStatus;
+export default TaskExtensionStatus;

aqueductcore/frontend/src/components/organisms/ConfirmActionModal/index.tsx

@@ -5,6 +5,7 @@ interface confirmationModalProps {
     title: string;
     message: string;
     warning?: string;
+    confirmButtonText?: string
     open: boolean;
     onClose: () => void;
     handleConfirmAction: () => void;
@@ -28,7 +29,7 @@ const ConfirmationModal = styled(Box)`
   padding: ${(props) => props.theme.spacing(4)};
 `;
 
-function ConfirmActionModal({ title, message, warning, open, onClose, handleConfirmAction }: confirmationModalProps) {
+function ConfirmActionModal({ title, message, warning, confirmButtonText, open, onClose, handleConfirmAction }: confirmationModalProps) {
     return (
         <Modal
             open={open}
@@ -44,10 +45,10 @@ function ConfirmActionModal({ title, message, warning, open, onClose, handleConf
                 </ConfirmActionAlert>}
                 <Grid container spacing={2} sx={{ mt: 0.5 }}>
                     <Grid item>
-                        <Button variant="contained" color="error" title="confirmAction" onClick={handleConfirmAction}>Confirm Deletion</Button>
+                        <Button variant="contained" color="error" title="confirmAction" onClick={handleConfirmAction}>{confirmButtonText ?? "Confirm Deletion"}</Button>
                     </Grid>
                     <Grid item>
-                        <Button variant="contained" color="neutral" title="closeModal" onClick={onClose}>Cancel</Button>
+                        <Button variant="contained" color="neutral" title="closeModal" onClick={onClose}>Close</Button>
                     </Grid>
                     <Grid item></Grid>
                 </Grid>

aqueductcore/frontend/src/components/organisms/ExperimentDetails/index.tsx

@@ -14,7 +14,7 @@ import { isUserAbleToDeleteExperiment, isUserAbleToEditExperiment } from "helper
 import ExperimentDetailsActionButtons from "components/organisms/ExperimentDetailsActionButtons";
 import { ExperimentDescriptionUpdate } from "components/molecules/ExperimentDescription";
 import { useUpdateExperiment } from "API/graphql/mutations/experiment/updateExperiment";
-import JobListInExperimentDetails from "components/organisms/JobListInExperimentDetails";
+import TaskListInExperimentDetails from "components/organisms/TaskListInExperimentDetails";
 import { useGetCurrentUserInfo } from "API/graphql/queries/user/getUserInformation";
 import ExperimentDetailsData from "components/organisms/ExperimentDetailsData";
 import { ExperimentTitleUpdate } from "components/molecules/ExperimentTitle";
@@ -152,7 +152,7 @@ function ExperimentDetails({ experimentDetails }: ExperimentDetailsProps) {
           />
         </Grid>
         <Grid item xs={12} xl={6}>
-          <JobListInExperimentDetails experimentUuid={experimentDetails.uuid} />
+          <TaskListInExperimentDetails experimentUuid={experimentDetails.uuid} />
         </Grid>
       </Grid>
     </>

aqueductcore/frontend/src/components/organisms/JobDetailsModal/index.tsx renamed to aqueductcore/frontend/src/components/organisms/TaskDetailsModal/index.tsx

@@ -4,7 +4,7 @@ import CloseIcon from '@mui/icons-material/Close';
 import { ReactNode, useState } from "react";
 import toast from "react-hot-toast";
 
-import JobExtensionStatus from "components/molecules/JobListTableCells/JobExtensionStatus";
+import TaskExtensionStatus from "components/molecules/TaskListTableCells/TaskExtensionStatus";
 import { useGetCurrentUserInfo } from "API/graphql/queries/user/getUserInformation";
 import { useCancelTask } from "API/graphql/mutations/extension/cancelTask";
 import ConfirmActionModal from "components/organisms/ConfirmActionModal";
@@ -18,7 +18,7 @@ import { dateFormatter } from "helper/formatters";
 import { client } from "API/apolloClientConfig";
 import { TaskType } from "types/globalTypes";
 
-interface JobDetailsModalProps {
+interface TaskDetailsModalProps {
     isOpen: boolean
     handleClose: () => void
     taskId: TaskType['taskId']
@@ -103,7 +103,7 @@ const ModalMain = styled(Box)`
     background-color: ${({ theme }) => theme.palette.mode === "dark" ? theme.palette.grey[900] : theme.palette.grey[200]};
 `;
 
-const JobDetailsBox = styled(Box)`
+const TaskDetailsBox = styled(Box)`
     width: calc(100% - ${(props) => props.theme.spacing(8)});
     margin-left: ${(props) => props.theme.spacing(4)};
     margin-top: ${(props) => props.theme.spacing(2)};
@@ -141,7 +141,7 @@ function TabPanel(props: TabPanelProps) {
     );
 }
 
-function JobDetailsModal({ isOpen, handleClose, taskId }: JobDetailsModalProps) {
+function TaskDetailsModal({ isOpen, handleClose, taskId }: TaskDetailsModalProps) {
     const [value, setValue] = useState(0);
     const { mutate: mutateCancelTask, loading: loadingCancelTask } = useCancelTask();
     const [isConfirmationModalOpen, setIsConfirmationModalOpen] = useState<boolean>(false);
@@ -196,7 +196,7 @@ function JobDetailsModal({ isOpen, handleClose, taskId }: JobDetailsModalProps)
     if (loading) return <Loading isGlobal />
     if (!task) return <></>
 
-    const jobRunLog = [
+    const taskRunLog = [
         {
             label: "experiment",
             value: task.experiment.title
@@ -250,7 +250,7 @@ function JobDetailsModal({ isOpen, handleClose, taskId }: JobDetailsModalProps)
             id: "log",
             title: "Log",
             component: <LogViewer
-                log={jobRunLog}
+                log={taskRunLog}
             />
         }
     ]
@@ -265,7 +265,7 @@ function JobDetailsModal({ isOpen, handleClose, taskId }: JobDetailsModalProps)
                     }}
                 >
                     <Grid item sx={{ display: "flex", alignItems: "center" }}>
-                        <JobExtensionStatus status={task.taskStatus} />
+                        <TaskExtensionStatus status={task.taskStatus} />
                         <ExtensionName>{task.extensionName}</ExtensionName>
                         <HeaderRightIcon />
                         <ActionName>{task.actionName}</ActionName>
@@ -315,7 +315,7 @@ function JobDetailsModal({ isOpen, handleClose, taskId }: JobDetailsModalProps)
                             ))}
                         </Tabs>
                     </TabsBox>
-                    <JobDetailsBox>
+                    <TaskDetailsBox>
                         <Container>
                             {taskDetailsItems.map((item, index) => (
                                 <TabPanel value={value} index={index} key={item.id}>
@@ -332,11 +332,12 @@ function JobDetailsModal({ isOpen, handleClose, taskId }: JobDetailsModalProps)
                                 </TabPanel>
                             ))}
                         </Container>
-                    </JobDetailsBox>
+                    </TaskDetailsBox>
                 </ModalMain>
                 <ConfirmActionModal
                     title="Cancel Task"
                     message="Are you sure you want to cancel this task?"
+                    confirmButtonText="Cancel Task"
                     open={isConfirmationModalOpen}
                     onClose={closeConfirmationModal}
                     handleConfirmAction={handleCancelTask}
@@ -346,4 +347,4 @@ function JobDetailsModal({ isOpen, handleClose, taskId }: JobDetailsModalProps)
     );
 }
 
-export default JobDetailsModal;
+export default TaskDetailsModal;