Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[MI-3230]: Developed a modal which opens on click of view button in config table #6

Merged
merged 28 commits into from
Sep 1, 2023
Merged
Show file tree
Hide file tree
Changes from 27 commits
Commits
Show all changes
28 commits
Select commit Hold shift + click to select a range
e5fd9fe
[MI-3230]: Developed a modal which opens on click of view button in c…
Kshitij-Katiyar Jul 3, 2023
8189a22
Added form in modal to accept the action details
Kshitij-Katiyar Jul 4, 2023
27382ec
[MI-3230]: Added view Action modal
Kshitij-Katiyar Jul 4, 2023
a3a5f3d
[MI-3230]: Removed rhs files from plugin
Kshitij-Katiyar Jul 10, 2023
bb66c10
[MI-3230]: FIxed indentation in existingConfigTable
Kshitij-Katiyar Jul 10, 2023
50ea728
Merge branch 'MI-3199' of github.com:Brightscout/mattermost-plugin-we…
Kshitij-Katiyar Jul 10, 2023
9fca2af
[MI-3230: Fixed indentation in existingConfigTable
Kshitij-Katiyar Jul 10, 2023
63351b3
[MI-3230]: fixed indentation in existingConfigTable
Kshitij-Katiyar Jul 10, 2023
065d0c7
[MI-3230]: Fixed indentation in existingConfigTable
Kshitij-Katiyar Jul 10, 2023
f3ea422
Merge branch 'MI-3199' of github.com:Brightscout/mattermost-plugin-we…
Kshitij-Katiyar Jul 11, 2023
e8f2f9c
[MI-3230]: Removed unwanted files from webapp
Kshitij-Katiyar Jul 19, 2023
fd096a0
[MI-3230]: removed extra files
Kshitij-Katiyar Jul 19, 2023
eb3c661
[MI-3230]: Removed some extra lines and added eod
Kshitij-Katiyar Aug 1, 2023
99458ac
[MI-3230]: Fixed indentation
Kshitij-Katiyar Aug 1, 2023
fc5046e
Merge branch 'MI-3199' into MI-3230
Kshitij-Katiyar Aug 2, 2023
a8d6308
[MI-3230]: Removed extra padding from existingConfigTable
Kshitij-Katiyar Aug 2, 2023
9c94b0a
Merge branch 'MI-3230' of github.com:Brightscout/mattermost-plugin-we…
Kshitij-Katiyar Aug 2, 2023
ea5f613
[MI-3230]: Improved the name of variables
Kshitij-Katiyar Aug 10, 2023
c17b02e
[MI-3230]: Added eod, use type instead of interface
Kshitij-Katiyar Aug 11, 2023
96d4a30
[MI-3230]: Used fat arrow function instead of normal function
Kshitij-Katiyar Aug 11, 2023
96157eb
[MI-3230]: Improved name of variable in editActionModal
Kshitij-Katiyar Aug 17, 2023
799e74a
Merge branch 'MI-3199' of github.com:Brightscout/mattermost-plugin-we…
Kshitij-Katiyar Aug 22, 2023
160248b
Merge branch 'MI-3199' into MI-3230
Kshitij-Katiyar Aug 24, 2023
4c85f44
[MI-3230]: Fixed some review changes by Abhishek
Kshitij-Katiyar Aug 24, 2023
62b1d22
Merge branch 'MI-3230' of github.com:Brightscout/mattermost-plugin-we…
Kshitij-Katiyar Aug 24, 2023
a16a58b
[MI-3230]: Added div to </> in existingConfigTable
Kshitij-Katiyar Aug 24, 2023
75d4a42
[MI-3230]: Added curly braces to css file
Kshitij-Katiyar Aug 24, 2023
9db34a8
[MI-3241] : Added delete config modal to the webapp (#7)
Kshitij-Katiyar Sep 1, 2023
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
250 changes: 117 additions & 133 deletions webapp/package-lock.json

Large diffs are not rendered by default.

4 changes: 4 additions & 0 deletions webapp/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -64,6 +64,10 @@
"core-js": "3.6.5",
"mattermost-redux": "5.27.0",
"react": "18.2.0",
"react-dom": "18,2.0",
"react-bootstrap": "2.8.0",
"react-redux": "7.2.0",
"redux": "4.0.5",
"react-dom": "18.2.0",
"react-bootstrap": "2.8.0",
"typescript": "5.1.6"
Expand Down
44 changes: 21 additions & 23 deletions webapp/src/containers/components/modals/attachmentMsgModal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,31 +9,29 @@ const AttachmentMessageModal = () => {
const handleClose = () => setShow(false);

return (
<>
<div
className='modal show'
>
<Modal show={show}>
<Modal.Header>
<Modal.Title>{'Attachment Message'}</Modal.Title>
</Modal.Header>
<div
className='modal show'
>
<Modal show={show}>
<Modal.Header>
<Modal.Title>{'Attachment Message'}</Modal.Title>
</Modal.Header>

<Modal.Body>
<p>{'Attachment message body text goes here.'}</p>
</Modal.Body>
<Modal.Body>
<p>{'Attachment message body text goes here.'}</p>
</Modal.Body>

<Modal.Footer>
<Button
variant='secondary'
onClick={handleClose}
>
{'Close'}
</Button>
<Button variant='primary'>{'Save changes'}</Button>
</Modal.Footer>
</Modal>
</div>
</>
<Modal.Footer>
<Button
variant='secondary'
onClick={handleClose}
>
{'Close'}
</Button>
<Button variant='primary'>{'Save changes'}</Button>
</Modal.Footer>
</Modal>
</div>
);
};

Expand Down
104 changes: 104 additions & 0 deletions webapp/src/containers/components/modals/editActionsModal.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,104 @@
import React, {useEffect, useState} from 'react';

import Button from 'react-bootstrap/Button';
import Modal from 'react-bootstrap/Modal';
import Form from 'react-bootstrap/Form';

import './styles.css';

type Props = {
visible: boolean;
setVisible: React.Dispatch<React.SetStateAction<boolean>>;
}

const EditActionsModal = ({visible, setVisible}: Props) => {
const [show, setShow] = useState(false);

useEffect(() => {
setShow(visible);
}, [visible]);

const handleClose = () => {
setShow(false);
setVisible(false);
};
Kshitij-Katiyar marked this conversation as resolved.
Show resolved Hide resolved
return (
<Modal
show={show}
onHide={handleClose}
>
<Modal.Header closeButton={false}>
<Modal.Title>{'Actions'}</Modal.Title>
</Modal.Header>

<Modal.Body>
<Form>
<Form.Group>
<Form.Label>
{'Attachment Message'}
</Form.Label>
<Form.Control
type='text'
placeholder='Enter the attachment message'
/>
</Form.Group>
<Form.Group>
<Form.Label>
{'Action Type'}
</Form.Label>
<div className='dropdown'>
<Form.Select aria-label='Choose the action type'>
<option>
{'Choose the type of action'}
</option>
<option value='1'>
{'Button'}
</option>
<option value='2'>
{'Automatic'}
</option>
</Form.Select>
</div>
</Form.Group>
<Form.Group>
<Form.Label>
{'Action Display Name'}
</Form.Label>
<Form.Control
type='text'
placeholder='Enter the display name of action'
/>
</Form.Group>
<Form.Group>
<Form.Label>
{'Channels Added to'}
</Form.Label>
<Form.Control
type='text'
placeholder='Enter the name of channels in which you want to add the new user'
/>
</Form.Group>
<Form.Group>
<Form.Label>
{'Action Successfull message'}
</Form.Label>
<Form.Control
type='text'
placeholder='Enter the success message on completion of action'
/>
</Form.Group>
</Form>
</Modal.Body>

<Modal.Footer>
<Button
variant='secondary'
onClick={handleClose}
>{'Close'}</Button>
<Button variant='primary'>{'Save changes'}</Button>
</Modal.Footer>
</Modal>
);
};

export default EditActionsModal;
5 changes: 3 additions & 2 deletions webapp/src/containers/components/modals/styles.css
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
.show {
position: initial;
.modal {
opacity: 1;
padding-top: 10%;
Kshitij-Katiyar marked this conversation as resolved.
Show resolved Hide resolved
}
93 changes: 93 additions & 0 deletions webapp/src/containers/components/modals/viewActionsModal.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,93 @@
import React, {useEffect, useState} from 'react';
import Button from 'react-bootstrap/Button';
import Modal from 'react-bootstrap/Modal';
import Table from 'react-bootstrap/Table';
import Form from 'react-bootstrap/Form';
import './styles.css';

type Props = {
visible: boolean;
setVisible: React.Dispatch<React.SetStateAction<boolean>>;
}

const ViewActionsModal = (props: Props) => {
const [show, setShow] = useState(false);

useEffect(() => {
setShow(props.visible);
}, [props.visible]);

const handleClose = () => {
setShow(false);
props.setVisible(false);
};

return (
Kshitij-Katiyar marked this conversation as resolved.
Show resolved Hide resolved
<Modal
show={show}
onHide={handleClose}
>
<Modal.Header closeButton={false}>
<Modal.Title>{'Actions'}</Modal.Title>
</Modal.Header>

<Modal.Body>
<Form>
<Form.Group>
<Form.Label>{'Attachment Message'}</Form.Label>
<Form.Control
type='long-text'
readOnly={true}
/>
</Form.Group>
<Form.Group>
<Form.Label>{'Actions'}</Form.Label>
</Form.Group>
</Form>
<Table striped={true}>
<thead>
<tr>
<th>{'Type'}</th>
<th>{'Display Name'}</th>
<th>{'Channels Added to'}</th>
<th>{'Success Message'}</th>
</tr>
</thead>
<tbody>
<tr>
<td>{'Button'}</td>
<td>{'Import'}</td>
<td>{'channel1, channel2, channel3'}</td>
<td>{'Welcome to your new team mate!'}</td>
</tr>
<tr>
<td>{'Automatic'}</td>
<td>{'Export'}</td>
<td>{'channel1, channel2'}</td>
<td>{'Welcome to your new team mate!'}</td>
</tr>
<tr>
<td>{'Button'}</td>
<td>{'Deport'}</td>
<td>{'channel1, channel3'}</td>
<td>{'Welcome to your new team mate!'}</td>
</tr>
</tbody>
</Table>
</Modal.Body>

<Modal.Footer>
<Button
variant='secondary'
onClick={handleClose}
>{'Close'}</Button>
<Button
variant='primary'
disabled={true}
>{'Save changes'}</Button>
</Modal.Footer>
</Modal>
);
};

export default ViewActionsModal;
Loading