mirror of
https://github.com/OneUptime/oneuptime.git
synced 2026-04-06 00:32:12 +02:00
add variable and builder pages
This commit is contained in:
@@ -17,6 +17,7 @@ enum IconProp {
|
||||
Public = 'Public',
|
||||
Home = 'Home',
|
||||
Graph = 'Graph',
|
||||
Variable = 'Variable',
|
||||
Image = 'Image',
|
||||
Grid = 'Grid',
|
||||
More = 'More',
|
||||
|
||||
@@ -154,6 +154,12 @@ const Icon: FunctionComponent<ComponentProps> = ({
|
||||
d="M12 20.25c4.97 0 9-3.694 9-8.25s-4.03-8.25-9-8.25S3 7.444 3 12c0 2.104.859 4.023 2.273 5.48.432.447.74 1.04.586 1.641a4.483 4.483 0 01-.923 1.785A5.969 5.969 0 006 21c1.282 0 2.47-.402 3.445-1.087.81.22 1.668.337 2.555.337z"
|
||||
/>
|
||||
);
|
||||
} else if (icon === IconProp.Variable) {
|
||||
return getSvgWrapper(
|
||||
|
||||
<path stroke-linecap="round" stroke-linejoin="round" d="M21 7.5l-2.25-1.313M21 7.5v2.25m0-2.25l-2.25 1.313M3 7.5l2.25-1.313M3 7.5l2.25 1.313M3 7.5v2.25m9 3l2.25-1.313M12 12.75l-2.25-1.313M12 12.75V15m0 6.75l2.25-1.313M12 21.75V19.5m0 2.25l-2.25-1.313m0-16.875L12 2.25l2.25 1.313M21 14.25v2.25l-2.25 1.313m-13.5 0L3 16.5v-2.25" />
|
||||
|
||||
);
|
||||
} else if (icon === IconProp.Workflow) {
|
||||
return getSvgWrapper(
|
||||
<path
|
||||
|
||||
83
Dashboard/src/Pages/Workflow/Logs.tsx
Normal file
83
Dashboard/src/Pages/Workflow/Logs.tsx
Normal file
@@ -0,0 +1,83 @@
|
||||
import Route from 'Common/Types/API/Route';
|
||||
import Page from 'CommonUI/src/Components/Page/Page';
|
||||
import React, { FunctionComponent, ReactElement } from 'react';
|
||||
import PageMap from '../../Utils/PageMap';
|
||||
import RouteMap, { RouteUtil } from '../../Utils/RouteMap';
|
||||
import PageComponentProps from '../PageComponentProps';
|
||||
import ModelTable from 'CommonUI/src/Components/ModelTable/ModelTable';
|
||||
import WorkflowLogs from 'Model/Models/WorkflowLog';
|
||||
import FieldType from 'CommonUI/src/Components/Types/FieldType';
|
||||
import { IconProp } from 'CommonUI/src/Components/Icon/Icon';
|
||||
import Navigation from 'CommonUI/src/Utils/Navigation';
|
||||
|
||||
const Workflows: FunctionComponent<PageComponentProps> = (
|
||||
_props: PageComponentProps
|
||||
): ReactElement => {
|
||||
return (
|
||||
<Page
|
||||
title={'Workflow Logs'}
|
||||
breadcrumbLinks={[
|
||||
{
|
||||
title: 'Project',
|
||||
to: RouteUtil.populateRouteParams(
|
||||
RouteMap[PageMap.HOME] as Route
|
||||
),
|
||||
},
|
||||
{
|
||||
title: 'Workflows',
|
||||
to: RouteUtil.populateRouteParams(
|
||||
RouteMap[PageMap.WORKFLOWS] as Route
|
||||
),
|
||||
},
|
||||
{
|
||||
title: 'Logs',
|
||||
to: RouteUtil.populateRouteParams(
|
||||
RouteMap[PageMap.WORKFLOWS_LOGS] as Route
|
||||
),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<ModelTable<WorkflowLogs>
|
||||
modelType={WorkflowLogs}
|
||||
id="workflow-logs-table"
|
||||
isDeleteable={false}
|
||||
isEditable={false}
|
||||
isCreateable={false}
|
||||
name="Workflow Logs"
|
||||
isViewable={false}
|
||||
cardProps={{
|
||||
icon: IconProp.Logs,
|
||||
title: 'Workflow Logs',
|
||||
description:
|
||||
'List of logs in the last 30 days for all your workflows',
|
||||
}}
|
||||
noItemsMessage={'Looks like no workflow ran so far in the last 30 days.'}
|
||||
showRefreshButton={true}
|
||||
showFilterButton={true}
|
||||
viewPageRoute={Navigation.getCurrentRoute()}
|
||||
columns={[
|
||||
{
|
||||
field: {
|
||||
workflow: {
|
||||
name: true
|
||||
},
|
||||
},
|
||||
title: 'Workflow Name',
|
||||
type: FieldType.Text,
|
||||
isFilterable: true,
|
||||
},
|
||||
{
|
||||
field: {
|
||||
createdAt: true,
|
||||
},
|
||||
title: 'Logs Created At',
|
||||
type: FieldType.DateTime,
|
||||
isFilterable: true,
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</Page>
|
||||
);
|
||||
};
|
||||
|
||||
export default Workflows;
|
||||
135
Dashboard/src/Pages/Workflow/Variable.tsx
Normal file
135
Dashboard/src/Pages/Workflow/Variable.tsx
Normal file
@@ -0,0 +1,135 @@
|
||||
import Route from 'Common/Types/API/Route';
|
||||
import Page from 'CommonUI/src/Components/Page/Page';
|
||||
import React, { FunctionComponent, ReactElement } from 'react';
|
||||
import PageMap from '../../Utils/PageMap';
|
||||
import RouteMap, { RouteUtil } from '../../Utils/RouteMap';
|
||||
import PageComponentProps from '../PageComponentProps';
|
||||
import ModelTable from 'CommonUI/src/Components/ModelTable/ModelTable';
|
||||
import WorkflowVariable from 'Model/Models/WorkflowVariable';
|
||||
import FieldType from 'CommonUI/src/Components/Types/FieldType';
|
||||
import FormFieldSchemaType from 'CommonUI/src/Components/Forms/Types/FormFieldSchemaType';
|
||||
import { IconProp } from 'CommonUI/src/Components/Icon/Icon';
|
||||
import Navigation from 'CommonUI/src/Utils/Navigation';
|
||||
import DashboardNavigation from '../../Utils/Navigation';
|
||||
|
||||
const Workflows: FunctionComponent<PageComponentProps> = (
|
||||
_props: PageComponentProps
|
||||
): ReactElement => {
|
||||
return (
|
||||
<Page
|
||||
title={'Workflows'}
|
||||
breadcrumbLinks={[
|
||||
{
|
||||
title: 'Project',
|
||||
to: RouteUtil.populateRouteParams(
|
||||
RouteMap[PageMap.HOME] as Route
|
||||
),
|
||||
},
|
||||
{
|
||||
title: 'Workflows',
|
||||
to: RouteUtil.populateRouteParams(
|
||||
RouteMap[PageMap.WORKFLOWS] as Route
|
||||
),
|
||||
},
|
||||
{
|
||||
title: 'Variables',
|
||||
to: RouteUtil.populateRouteParams(
|
||||
RouteMap[PageMap.WORKFLOWS_VARIABLES] as Route
|
||||
),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<ModelTable<WorkflowVariable>
|
||||
modelType={WorkflowVariable}
|
||||
id="status-page-table"
|
||||
isDeleteable={false}
|
||||
isEditable={false}
|
||||
isCreateable={true}
|
||||
name="Workflows"
|
||||
isViewable={false}
|
||||
cardProps={{
|
||||
icon: IconProp.Variable,
|
||||
title: 'Global Variables',
|
||||
description:
|
||||
'Here is a list of global secrets and variables for this project.',
|
||||
}}
|
||||
query={{
|
||||
workflowId: null,
|
||||
projectId: DashboardNavigation.getProjectId()?.toString(),
|
||||
}}
|
||||
noItemsMessage={'No workflows found.'}
|
||||
formFields={[
|
||||
{
|
||||
field: {
|
||||
name: true,
|
||||
},
|
||||
title: 'Name',
|
||||
fieldType: FormFieldSchemaType.Text,
|
||||
required: true,
|
||||
placeholder: 'Workflow Name',
|
||||
validation: {
|
||||
minLength: 2,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: {
|
||||
description: true,
|
||||
},
|
||||
title: 'Description',
|
||||
fieldType: FormFieldSchemaType.LongText,
|
||||
required: true,
|
||||
placeholder: 'Description',
|
||||
},
|
||||
{
|
||||
field: {
|
||||
isSecret: true,
|
||||
},
|
||||
title: 'Secret',
|
||||
description: "Is this variable secret or secure? Should this be encrypted in the Database?",
|
||||
fieldType: FormFieldSchemaType.Checkbox,
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
field: {
|
||||
content: true,
|
||||
},
|
||||
title: 'Content',
|
||||
description: "Is this variable secret or secure? Should this be encrypted in the Database?",
|
||||
fieldType: FormFieldSchemaType.Checkbox,
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
showRefreshButton={true}
|
||||
showFilterButton={true}
|
||||
columns={[
|
||||
{
|
||||
field: {
|
||||
name: true,
|
||||
},
|
||||
title: 'Name',
|
||||
type: FieldType.Text,
|
||||
isFilterable: true,
|
||||
},
|
||||
{
|
||||
field: {
|
||||
description: true,
|
||||
},
|
||||
title: 'Description',
|
||||
type: FieldType.Text,
|
||||
isFilterable: true,
|
||||
},
|
||||
{
|
||||
field: {
|
||||
createdAt: true,
|
||||
},
|
||||
title: 'Created At',
|
||||
type: FieldType.DateTime,
|
||||
isFilterable: true,
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</Page>
|
||||
);
|
||||
};
|
||||
|
||||
export default Workflows;
|
||||
@@ -7,6 +7,11 @@ import PageComponentProps from '../../PageComponentProps';
|
||||
import SideMenu from './SideMenu';
|
||||
import Navigation from 'CommonUI/src/Utils/Navigation';
|
||||
import ObjectID from 'Common/Types/ObjectID';
|
||||
import FieldType from 'CommonUI/src/Components/Types/FieldType';
|
||||
import { IconProp } from 'CommonUI/src/Components/Icon/Icon';
|
||||
import WorkflowLogs from 'Model/Models/WorkflowLog';
|
||||
import ModelTable from 'CommonUI/src/Components/ModelTable/ModelTable';
|
||||
import DashboardNavigation from '../../../Utils/Navigation';
|
||||
|
||||
const Delete: FunctionComponent<PageComponentProps> = (
|
||||
_props: PageComponentProps
|
||||
@@ -48,7 +53,49 @@ const Delete: FunctionComponent<PageComponentProps> = (
|
||||
]}
|
||||
sideMenu={<SideMenu modelId={modelId} />}
|
||||
>
|
||||
<div></div>
|
||||
<ModelTable<WorkflowLogs>
|
||||
modelType={WorkflowLogs}
|
||||
id="workflow-logs-table"
|
||||
isDeleteable={false}
|
||||
isEditable={false}
|
||||
isCreateable={false}
|
||||
name="Workflow Logs"
|
||||
query={{
|
||||
workflowId: modelId,
|
||||
projectId: DashboardNavigation.getProjectId()?.toString(),
|
||||
}}
|
||||
isViewable={false}
|
||||
cardProps={{
|
||||
icon: IconProp.Logs,
|
||||
title: 'Workflow Logs',
|
||||
description:
|
||||
'List of logs in the last 30 days for this workflow',
|
||||
}}
|
||||
noItemsMessage={'Looks like this workflow did not run so far in the last 30 days.'}
|
||||
showRefreshButton={true}
|
||||
showFilterButton={true}
|
||||
viewPageRoute={Navigation.getCurrentRoute()}
|
||||
columns={[
|
||||
{
|
||||
field: {
|
||||
workflow: {
|
||||
name: true
|
||||
},
|
||||
},
|
||||
title: 'Workflow Name',
|
||||
type: FieldType.Text,
|
||||
isFilterable: true,
|
||||
},
|
||||
{
|
||||
field: {
|
||||
createdAt: true,
|
||||
},
|
||||
title: 'Logs Created At',
|
||||
type: FieldType.DateTime,
|
||||
isFilterable: true,
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</Page>
|
||||
);
|
||||
};
|
||||
|
||||
154
Dashboard/src/Pages/Workflow/View/Variable.tsx
Normal file
154
Dashboard/src/Pages/Workflow/View/Variable.tsx
Normal file
@@ -0,0 +1,154 @@
|
||||
import Route from 'Common/Types/API/Route';
|
||||
import Page from 'CommonUI/src/Components/Page/Page';
|
||||
import React, { FunctionComponent, ReactElement } from 'react';
|
||||
import PageMap from '../../../Utils/PageMap';
|
||||
import RouteMap, { RouteUtil } from '../../../Utils/RouteMap';
|
||||
import PageComponentProps from '../../PageComponentProps';
|
||||
import ModelTable from 'CommonUI/src/Components/ModelTable/ModelTable';
|
||||
import WorkflowVariable from 'Model/Models/WorkflowVariable';
|
||||
import FieldType from 'CommonUI/src/Components/Types/FieldType';
|
||||
import FormFieldSchemaType from 'CommonUI/src/Components/Forms/Types/FormFieldSchemaType';
|
||||
import { IconProp } from 'CommonUI/src/Components/Icon/Icon';
|
||||
import Navigation from 'CommonUI/src/Utils/Navigation';
|
||||
import DashboardNavigation from '../../../Utils/Navigation';
|
||||
import ObjectID from 'Common/Types/ObjectID';
|
||||
|
||||
const Workflows: FunctionComponent<PageComponentProps> = (
|
||||
_props: PageComponentProps
|
||||
): ReactElement => {
|
||||
|
||||
const modelId: ObjectID = Navigation.getLastParamAsObjectID(1);
|
||||
|
||||
return (
|
||||
<Page
|
||||
title={'Workflows'}
|
||||
breadcrumbLinks={[
|
||||
{
|
||||
title: 'Project',
|
||||
to: RouteUtil.populateRouteParams(
|
||||
RouteMap[PageMap.HOME] as Route
|
||||
),
|
||||
},
|
||||
{
|
||||
title: 'Workflows',
|
||||
to: RouteUtil.populateRouteParams(
|
||||
RouteMap[PageMap.WORKFLOWS] as Route
|
||||
),
|
||||
},
|
||||
{
|
||||
title: 'View Workflow',
|
||||
to: RouteUtil.populateRouteParams(
|
||||
RouteMap[PageMap.WORKFLOW_VIEW] as Route,
|
||||
modelId
|
||||
),
|
||||
},
|
||||
{
|
||||
title: 'Builder',
|
||||
to: RouteUtil.populateRouteParams(
|
||||
RouteMap[PageMap.WORKFLOW_BUILDER] as Route,
|
||||
modelId
|
||||
),
|
||||
},
|
||||
]}
|
||||
>
|
||||
<ModelTable<WorkflowVariable>
|
||||
modelType={WorkflowVariable}
|
||||
id="status-page-table"
|
||||
isDeleteable={false}
|
||||
isEditable={false}
|
||||
isCreateable={true}
|
||||
name="Workflows"
|
||||
isViewable={false}
|
||||
cardProps={{
|
||||
icon: IconProp.Variable,
|
||||
title: 'Global Variables',
|
||||
description:
|
||||
'Here is a list of global secrets and variables for this project.',
|
||||
}}
|
||||
query={{
|
||||
workflowId: modelId,
|
||||
projectId: DashboardNavigation.getProjectId()?.toString(),
|
||||
}}
|
||||
onBeforeCreate={(
|
||||
item: WorkflowVariable
|
||||
): Promise<WorkflowVariable> => {
|
||||
item.workflowId = modelId;
|
||||
item.projectId = DashboardNavigation.getProjectId()!;
|
||||
return Promise.resolve(item);
|
||||
}}
|
||||
noItemsMessage={'No workflows found.'}
|
||||
formFields={[
|
||||
{
|
||||
field: {
|
||||
name: true,
|
||||
},
|
||||
title: 'Name',
|
||||
fieldType: FormFieldSchemaType.Text,
|
||||
required: true,
|
||||
placeholder: 'Workflow Name',
|
||||
validation: {
|
||||
minLength: 2,
|
||||
},
|
||||
},
|
||||
{
|
||||
field: {
|
||||
description: true,
|
||||
},
|
||||
title: 'Description',
|
||||
fieldType: FormFieldSchemaType.LongText,
|
||||
required: true,
|
||||
placeholder: 'Description',
|
||||
},
|
||||
{
|
||||
field: {
|
||||
isSecret: true,
|
||||
},
|
||||
title: 'Secret',
|
||||
description: "Is this variable secret or secure? Should this be encrypted in the Database?",
|
||||
fieldType: FormFieldSchemaType.Checkbox,
|
||||
required: true,
|
||||
},
|
||||
{
|
||||
field: {
|
||||
content: true,
|
||||
},
|
||||
title: 'Content',
|
||||
description: "Is this variable secret or secure? Should this be encrypted in the Database?",
|
||||
fieldType: FormFieldSchemaType.Checkbox,
|
||||
required: true,
|
||||
},
|
||||
]}
|
||||
showRefreshButton={true}
|
||||
showFilterButton={true}
|
||||
columns={[
|
||||
{
|
||||
field: {
|
||||
name: true,
|
||||
},
|
||||
title: 'Name',
|
||||
type: FieldType.Text,
|
||||
isFilterable: true,
|
||||
},
|
||||
{
|
||||
field: {
|
||||
description: true,
|
||||
},
|
||||
title: 'Description',
|
||||
type: FieldType.Text,
|
||||
isFilterable: true,
|
||||
},
|
||||
{
|
||||
field: {
|
||||
createdAt: true,
|
||||
},
|
||||
title: 'Created At',
|
||||
type: FieldType.DateTime,
|
||||
isFilterable: true,
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</Page>
|
||||
);
|
||||
};
|
||||
|
||||
export default Workflows;
|
||||
@@ -27,7 +27,7 @@ const Workflows: FunctionComponent<PageComponentProps> = (
|
||||
{
|
||||
title: 'Workflows',
|
||||
to: RouteUtil.populateRouteParams(
|
||||
RouteMap[PageMap.STATUS_PAGES] as Route
|
||||
RouteMap[PageMap.WORKFLOWS] as Route
|
||||
),
|
||||
},
|
||||
]}
|
||||
|
||||
@@ -101,6 +101,8 @@ enum PageMap {
|
||||
|
||||
// WORKFLOW
|
||||
WORKFLOWS = 'WORKFLOWS',
|
||||
WORKFLOWS_LOGS = 'WORKFLOWS_LOGS',
|
||||
WORKFLOWS_VARIABLES = 'WORKFLOWS_VARIABLES',
|
||||
WORKFLOW_VIEW = 'WORKFLOW_VIEW',
|
||||
WORKFLOW_DELETE = 'WORKFLOW_DELETE',
|
||||
WORKFLOW_BUILDER = 'WORKFLOW_BUILDER',
|
||||
|
||||
@@ -265,6 +265,14 @@ const RouteMap: Dictionary<Route> = {
|
||||
`/dashboard/${RouteParams.ProjectID}/workflows`
|
||||
),
|
||||
|
||||
[PageMap.WORKFLOWS_LOGS]: new Route(
|
||||
`/dashboard/${RouteParams.ProjectID}/workflows/logs`
|
||||
),
|
||||
|
||||
[PageMap.WORKFLOWS_VARIABLES]: new Route(
|
||||
`/dashboard/${RouteParams.ProjectID}/workflows/variables`
|
||||
),
|
||||
|
||||
[PageMap.WORKFLOW_BUILDER]: new Route(
|
||||
`/dashboard/${RouteParams.ProjectID}/workflows/${RouteParams.ModelID}/builder`
|
||||
),
|
||||
@@ -290,7 +298,7 @@ export class RouteUtil {
|
||||
if (
|
||||
route.toString() === RouteMap[PageMap.USER_PROFILE]?.toString() ||
|
||||
route.toString() ===
|
||||
RouteMap[PageMap.PROJECT_INVITATIONS]?.toString() ||
|
||||
RouteMap[PageMap.PROJECT_INVITATIONS]?.toString() ||
|
||||
route.toString() === RouteMap[PageMap.ACTIVE_INCIDENTS]?.toString()
|
||||
) {
|
||||
return true;
|
||||
|
||||
Reference in New Issue
Block a user