Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 | import React, { useState, FC } from 'react' import { useTranslation, Trans } from 'react-i18next' import { Input, Button, FormText } from 'reactstrap' interface Props { settings: any[] addPattern: ({ pathPattern, channel }: { pathPattern: string; channel: string }) => void removePattern: (pattern: string) => void } const NotificationPatterns: FC<Props> = ({ settings, addPattern, removePattern }) => { const [t] = useTranslation() const [pathPattern, setPathPattern] = useState('') const [channel, setChannel] = useState('') const clearInputs = () => { setPathPattern('') setChannel('') } const handleAddPattern = () => { addPattern({ pathPattern, channel }) clearInputs() } return ( <> <h3 className="mt-4">{t('admin.notification.patterns.legend')}</h3> <div className="row"> <table className="offset-1 col-10 table table-bordered"> <thead> <tr> <th>{t('admin.notification.patterns.pattern')}</th> <th>{t('admin.notification.patterns.channel')}</th> <th>{t('admin.notification.patterns.operation')}</th> </tr> </thead> <tbody> <tr> <td> <Input value={pathPattern} placeholder="e.g. /projects/xxx/MTG/*" onChange={e => setPathPattern(e.target.value)} /> <FormText color="muted"> <Trans i18nKey="admin.notification.patterns.path_pattern_description"> Path name of wiki. Pattern expression with <code>*</code> can be used. </Trans> </FormText> </td> <td> <Input value={channel} placeholder="e.g. project-xxx" onChange={e => setChannel(e.target.value)} /> <FormText color="muted"> <Trans i18nKey="admin.notification.patterns.channel_description"> Slack channel name. Without <code>#</code>. </Trans> </FormText> </td> <td> <Button color="primary" onClick={handleAddPattern}> {t('Add')} </Button> </td> </tr> {settings.map(({ _id, pathPattern, channel }) => ( <tr key={_id}> <td>{pathPattern}</td> <td>{channel}</td> <td> <form className="admin-remove-updatepost"> <Button onClick={() => removePattern(_id)}>{t('Delete')}</Button> </form> </td> </tr> ))} </tbody> </table> </div> </> ) } export default NotificationPatterns |