Skip to content

Commit

Permalink
chore: work in progresss
Browse files Browse the repository at this point in the history
  • Loading branch information
cheton committed Feb 27, 2020
1 parent 836803a commit 9197211
Show file tree
Hide file tree
Showing 3 changed files with 88 additions and 40 deletions.
64 changes: 32 additions & 32 deletions src/app/widgets/Macro/Macro.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,8 @@ import React from 'react';
import { connect } from 'react-redux';
import Box from 'app/components/Box';
import { Button } from 'app/components/Buttons';
import Flex from 'app/components/Flex';
import FontAwesomeIcon from 'app/components/FontAwesomeIcon';
import { Container, Row, Col } from 'app/components/GridSystem';
import useModal from 'app/components/Modal/useModal';
import RenderChildren from 'app/components/RenderChildren';
import Space from 'app/components/Space';
Expand All @@ -28,16 +28,12 @@ import {
WORKFLOW_STATE_RUNNING,
} from 'app/constants/workflow';
import fetchMacrosMachine from './machines/fetchMacrosMachine';
import ConfirmLoadMacro from './modals/ConfirmLoadMacro';
import EditMacro from './modals/EditMacro';
import NewMacro from './modals/NewMacro';
import RunMacro from './modals/RunMacro';

/*
handleRunMacro = (macro) => (event) => {
const { actions } = this.props;
actions.openRunMacroModal(macro.id);
};
handleLoadMacro = (macro) => (event) => {
const { id, name } = macro;
portal(({ onClose }) => (
Expand Down Expand Up @@ -73,11 +69,6 @@ import RunMacro from './modals/RunMacro';
</Modal>
));
};
handleEditMacro = (macro) => (event) => {
const { actions } = this.props;
actions.openEditMacroModal(macro.id);
};
*/

const Macro = ({
Expand All @@ -100,22 +91,26 @@ const Macro = ({
const handleExportMacros = () => {
// FIXME
};
const handleLoadMacro = (macro) => () => {
const { id, name } = macro;
openModal(ConfirmLoadMacro, { id, name });
};
const handleRunMacro = (macro) => () => {
const { id, name, content } = macro;
openModal(RunMacro, { id, name, content });
};
const handleLoadMacro = (macro) => () => {
// FIXME
};
const handleEditMacro = (macro) => () => {
const { id, name, content } = macro;
openModal(EditMacro, { id, name, content });
};

return (
<Container fluid>
<Row>
<Col>
<Box>
<Flex
align="center"
justify="space-between"
>
<Box>
<Button
sm
onClick={handleNewMacro}
Expand All @@ -124,8 +119,8 @@ const Macro = ({
<Space width={8} />
{i18n._('New')}
</Button>
</Col>
<Col width="auto">
</Box>
<Box>
<Button
sm
onClick={handleExportMacros}
Expand All @@ -141,8 +136,8 @@ const Macro = ({
>
<FontAwesomeIcon icon="sync-alt" fixedWidth />
</Button>
</Col>
</Row>
</Box>
</Flex>
<RenderChildren>
{() => {
const macros = ensureArray(_get(current.context, 'data.records'));
Expand All @@ -168,42 +163,47 @@ const Macro = ({
return (
<Box>
{macros.map((macro, index) => (
<Row key={macro.id}>
<Col>
<Flex
key={macro.id}
align="center"
borderBottom={1}
borderColor="gray.20"
>
<Box flex="auto">
<Button
sm
disabled={!canRunMacro}
onClick={handleRunMacro(macro)}
title={i18n._('Run Macro')}
>
<i className="fa fa-play" />
<FontAwesomeIcon icon="play" fixedWidth />
</Button>
<Space width={8} />
{macro.name}
</Col>
<Col width="auto">
</Box>
<Box>
<Button
sm
disabled={!canLoadMacro}
onClick={handleLoadMacro(macro)}
title={i18n._('Load Macro')}
>
<i className="fa fa-chevron-up" />
<FontAwesomeIcon icon="chevron-up" fixedWidth />
</Button>
<Button
sm
onClick={handleEditMacro(macro)}
>
<i className="fa fa-edit" />
<FontAwesomeIcon icon="edit" fixedWidth />
</Button>
</Col>
</Row>
</Box>
</Flex>
))}
</Box>
);
}}
</RenderChildren>
</Container>
</Box>
);
};

Expand Down Expand Up @@ -237,7 +237,7 @@ export default connect(store => {
const canRunMacro = isActionable && _includes([
WORKFLOW_STATE_IDLE,
WORKFLOW_STATE_PAUSED,
], workflowState) || true;
], workflowState);

return {
canLoadMacro,
Expand Down
32 changes: 28 additions & 4 deletions src/app/widgets/Macro/modals/EditMacro.jsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import _uniqueId from 'lodash/uniqueId';
import React, { useRef } from 'react';
import { Form, Field } from 'react-final-form';
import api from 'app/api';
import Box from 'app/components/Box';
import { Button } from 'app/components/Buttons';
import Dropdown, { MenuItem } from 'app/components/Dropdown';
Expand All @@ -9,12 +10,22 @@ import FontAwesomeIcon from 'app/components/FontAwesomeIcon';
import Input from 'app/components/FormControl/Input';
import Textarea from 'app/components/FormControl/Textarea';
import FormGroup from 'app/components/FormGroup';
import InlineError from 'app/components/InlineError';
import Label from 'app/components/Label';
import Modal from 'app/components/Modal';
import Space from 'app/components/Space';
import i18n from 'app/lib/i18n';
import { composeValidators, required } from 'app/widgets/shared/validations';
import variables from '../shared/variables';

const updateMacro = async (id, { name, content }) => {
try {
await api.macros.update(id, { name, content });
} catch (err) {
// Ignore error
}
};

const EditMacro = ({
onClose,
id,
Expand All @@ -31,8 +42,9 @@ const EditMacro = ({
<Modal size="md" onClose={onClose}>
<Form
initialValues={initialValues}
onSubmit={(values) => {
// FIXME
onSubmit={async (values) => {
const { name, content } = values;
await updateMacro(id, { name, content });
onClose();
}}
subscription={{}}
Expand All @@ -45,19 +57,28 @@ const EditMacro = ({
</Modal.Title>
</Modal.Header>
<Modal.Body>
<Field name="name">
<Field
name="name"
validate={composeValidators(required)}
>
{({ input, meta }) => {
return (
<FormGroup>
<Label>{i18n._('Macro Name')}</Label>
<Box>
<Input {...input} />
</Box>
{(meta.error && meta.touched) && (
<InlineError>{meta.error}</InlineError>
)}
</FormGroup>
);
}}
</Field>
<Field name="content">
<Field
name="content"
validate={composeValidators(required)}
>
{({ input, meta }) => {
return (
<FormGroup>
Expand Down Expand Up @@ -133,6 +154,9 @@ const EditMacro = ({
ref={contentRef}
rows={10}
/>
{(meta.error && meta.touched) && (
<InlineError>{meta.error}</InlineError>
)}
</FormGroup>
);
}}
Expand Down
32 changes: 28 additions & 4 deletions src/app/widgets/Macro/modals/NewMacro.jsx
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import _uniqueId from 'lodash/uniqueId';
import React, { useRef } from 'react';
import { Form, Field } from 'react-final-form';
import api from 'app/api';
import Box from 'app/components/Box';
import { Button } from 'app/components/Buttons';
import Dropdown, { MenuItem } from 'app/components/Dropdown';
Expand All @@ -9,12 +10,22 @@ import FontAwesomeIcon from 'app/components/FontAwesomeIcon';
import Input from 'app/components/FormControl/Input';
import Textarea from 'app/components/FormControl/Textarea';
import FormGroup from 'app/components/FormGroup';
import InlineError from 'app/components/InlineError';
import Label from 'app/components/Label';
import Modal from 'app/components/Modal';
import Space from 'app/components/Space';
import i18n from 'app/lib/i18n';
import { composeValidators, required } from 'app/widgets/shared/validations';
import variables from '../shared/variables';

const addMacro = async ({ name, content }) => {
try {
await api.macros.create({ name, content });
} catch (err) {
// Ignore error
}
};

const NewMacro = ({
onClose,
}) => {
Expand All @@ -28,8 +39,9 @@ const NewMacro = ({
<Modal size="md" onClose={onClose}>
<Form
initialValues={initialValues}
onSubmit={(values) => {
// FIXME
onSubmit={async (values) => {
const { name, content } = values;
await addMacro({ name, content });
onClose();
}}
subscription={{}}
Expand All @@ -42,19 +54,28 @@ const NewMacro = ({
</Modal.Title>
</Modal.Header>
<Modal.Body>
<Field name="name">
<Field
name="name"
validate={composeValidators(required)}
>
{({ input, meta }) => {
return (
<FormGroup>
<Label>{i18n._('Macro Name')}</Label>
<Box>
<Input {...input} />
</Box>
{(meta.error && meta.touched) && (
<InlineError>{meta.error}</InlineError>
)}
</FormGroup>
);
}}
</Field>
<Field name="content">
<Field
name="content"
validate={composeValidators(required)}
>
{({ input, meta }) => {
return (
<FormGroup>
Expand Down Expand Up @@ -130,6 +151,9 @@ const NewMacro = ({
ref={contentRef}
rows={10}
/>
{(meta.error && meta.touched) && (
<InlineError>{meta.error}</InlineError>
)}
</FormGroup>
);
}}
Expand Down

0 comments on commit 9197211

Please sign in to comment.