Compare commits
22 Commits
feat/2fa
...
fix/dashbo
| Author | SHA1 | Date | |
|---|---|---|---|
|
e9a2301d2b | ||
|
|
48bbfa31af | ||
|
|
d7f5f563cc | ||
|
|
6c29149fbe | ||
|
|
bbd4d43317 | ||
|
|
c4d2f62657 | ||
|
|
5d78bf178f | ||
|
|
58749497bd | ||
|
|
5c6e643efb | ||
|
|
7792cdbc5e | ||
|
|
65803c3763 | ||
|
|
81fce1a471 | ||
|
|
0714b4360b | ||
|
|
8f69d5746e | ||
|
|
85630a59c1 | ||
|
|
b4ef196bfb | ||
|
|
099b2a39b4 | ||
|
|
2d07baedf4 | ||
|
|
8b34e001ef | ||
|
|
617dcdde53 | ||
|
|
f2fb800323 | ||
|
|
db4d711cba |
142
dashboard/package-lock.json
generated
142
dashboard/package-lock.json
generated
@@ -24,11 +24,16 @@
|
||||
"lodash": "^4.17.21",
|
||||
"react": "^17.0.2",
|
||||
"react-dom": "^17.0.2",
|
||||
"react-draft-wysiwyg": "^1.15.0",
|
||||
"react-dropzone": "^12.0.4",
|
||||
"react-email-editor": "^1.6.1",
|
||||
"react-icons": "^4.3.1",
|
||||
"react-router-dom": "^6.2.1",
|
||||
"typescript": "^4.5.4",
|
||||
"urql": "^2.0.6"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/react-email-editor": "^1.1.7"
|
||||
}
|
||||
},
|
||||
"node_modules/@babel/code-frame": {
|
||||
@@ -1191,6 +1196,15 @@
|
||||
"@types/react": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/react-email-editor": {
|
||||
"version": "1.1.7",
|
||||
"resolved": "https://registry.npmjs.org/@types/react-email-editor/-/react-email-editor-1.1.7.tgz",
|
||||
"integrity": "sha512-OURTAgaE9pjA6KiU97k13fPdoglI1ZyowUuZ0nu5tTSyrw5PiZoYzYEf9y25YTjmw/ohxT5yqoP0tt+AjSh1qQ==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"@types/react": "*"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/react-router": {
|
||||
"version": "5.1.17",
|
||||
"resolved": "https://registry.npmjs.org/@types/react-router/-/react-router-5.1.17.tgz",
|
||||
@@ -1306,6 +1320,11 @@
|
||||
"node": ">=0.8.0"
|
||||
}
|
||||
},
|
||||
"node_modules/classnames": {
|
||||
"version": "2.3.1",
|
||||
"resolved": "https://registry.npmjs.org/classnames/-/classnames-2.3.1.tgz",
|
||||
"integrity": "sha512-OlQdbZ7gLfGarSqxesMesDa5uz7KFbID8Kpq/SxIoNGDqY8lSYs0D+hhtBXhcdB3rcbXArFr7vlHheLk1voeNA=="
|
||||
},
|
||||
"node_modules/color-convert": {
|
||||
"version": "1.9.3",
|
||||
"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
|
||||
@@ -1383,6 +1402,15 @@
|
||||
"resolved": "https://registry.npmjs.org/detect-node-es/-/detect-node-es-1.1.0.tgz",
|
||||
"integrity": "sha512-ypdmJU/TbBby2Dxibuv7ZLW3Bs1QEmM7nHjEANfohJLvE0XVujisn1qPJcZxg+qDucsr+bP6fLD1rPS3AhJ7EQ=="
|
||||
},
|
||||
"node_modules/draftjs-utils": {
|
||||
"version": "0.10.2",
|
||||
"resolved": "https://registry.npmjs.org/draftjs-utils/-/draftjs-utils-0.10.2.tgz",
|
||||
"integrity": "sha512-EstHqr3R3JVcilJrBaO/A+01GvwwKmC7e4TCjC7S94ZeMh4IVmf60OuQXtHHpwItK8C2JCi3iljgN5KHkJboUg==",
|
||||
"peerDependencies": {
|
||||
"draft-js": "^0.11.x",
|
||||
"immutable": "3.x.x || 4.x.x"
|
||||
}
|
||||
},
|
||||
"node_modules/error-ex": {
|
||||
"version": "1.3.2",
|
||||
"resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.2.tgz",
|
||||
@@ -1802,6 +1830,15 @@
|
||||
"react-is": "^16.7.0"
|
||||
}
|
||||
},
|
||||
"node_modules/html-to-draftjs": {
|
||||
"version": "1.5.0",
|
||||
"resolved": "https://registry.npmjs.org/html-to-draftjs/-/html-to-draftjs-1.5.0.tgz",
|
||||
"integrity": "sha512-kggLXBNciKDwKf+KYsuE+V5gw4dZ7nHyGMX9m0wy7urzWjKGWyNFetmArRLvRV0VrxKN70WylFsJvMTJx02OBQ==",
|
||||
"peerDependencies": {
|
||||
"draft-js": "^0.10.x || ^0.11.x",
|
||||
"immutable": "3.x.x || 4.x.x"
|
||||
}
|
||||
},
|
||||
"node_modules/import-fresh": {
|
||||
"version": "3.3.0",
|
||||
"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
|
||||
@@ -1856,6 +1893,14 @@
|
||||
"resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz",
|
||||
"integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg=="
|
||||
},
|
||||
"node_modules/linkify-it": {
|
||||
"version": "2.2.0",
|
||||
"resolved": "https://registry.npmjs.org/linkify-it/-/linkify-it-2.2.0.tgz",
|
||||
"integrity": "sha512-GnAl/knGn+i1U/wjBz3akz2stz+HrHLsxMwHQGofCDfPvlf+gDKN58UtfmUquTY4/MXeE2x7k19KQmeoZi94Iw==",
|
||||
"dependencies": {
|
||||
"uc.micro": "^1.0.1"
|
||||
}
|
||||
},
|
||||
"node_modules/lodash": {
|
||||
"version": "4.17.21",
|
||||
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
|
||||
@@ -1991,6 +2036,24 @@
|
||||
"react": "17.0.2"
|
||||
}
|
||||
},
|
||||
"node_modules/react-draft-wysiwyg": {
|
||||
"version": "1.15.0",
|
||||
"resolved": "https://registry.npmjs.org/react-draft-wysiwyg/-/react-draft-wysiwyg-1.15.0.tgz",
|
||||
"integrity": "sha512-p1cYZcWc6/ALFBVksbFoCM3b29fGQDlZLIMrXng0TU/UElxIOF2/AWWo4L5auIYVhmqKTZ0NkNjnXOzGGuxyeA==",
|
||||
"dependencies": {
|
||||
"classnames": "^2.2.6",
|
||||
"draftjs-utils": "^0.10.2",
|
||||
"html-to-draftjs": "^1.5.0",
|
||||
"linkify-it": "^2.2.0",
|
||||
"prop-types": "^15.7.2"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"draft-js": "^0.10.x || ^0.11.x",
|
||||
"immutable": "3.x.x || 4.x.x",
|
||||
"react": "0.13.x || 0.14.x || ^15.0.0-0 || 15.x.x || ^16.0.0-0 || ^16.x.x || ^17.x.x || ^18.x.x",
|
||||
"react-dom": "0.13.x || 0.14.x || ^15.0.0-0 || 15.x.x || ^16.0.0-0 || ^16.x.x || ^17.x.x || ^18.x.x"
|
||||
}
|
||||
},
|
||||
"node_modules/react-dropzone": {
|
||||
"version": "12.0.4",
|
||||
"resolved": "https://registry.npmjs.org/react-dropzone/-/react-dropzone-12.0.4.tgz",
|
||||
@@ -2007,6 +2070,14 @@
|
||||
"react": ">= 16.8"
|
||||
}
|
||||
},
|
||||
"node_modules/react-email-editor": {
|
||||
"version": "1.6.1",
|
||||
"resolved": "https://registry.npmjs.org/react-email-editor/-/react-email-editor-1.6.1.tgz",
|
||||
"integrity": "sha512-pEWpRmTY0ok03cwTGqEOoEldnzThhuRGTrcMnv8W3/jc5MTfcr9USU/IQ9HrVvFStLKoxYBIQnSKY+iCYWOtSQ==",
|
||||
"peerDependencies": {
|
||||
"react": "15.x || 16.x || 17.x"
|
||||
}
|
||||
},
|
||||
"node_modules/react-fast-compare": {
|
||||
"version": "3.2.0",
|
||||
"resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-3.2.0.tgz",
|
||||
@@ -2275,6 +2346,11 @@
|
||||
"node": ">=4.2.0"
|
||||
}
|
||||
},
|
||||
"node_modules/uc.micro": {
|
||||
"version": "1.0.6",
|
||||
"resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-1.0.6.tgz",
|
||||
"integrity": "sha512-8Y75pvTYkLJW2hWQHXxoqRgV7qb9B+9vFEtidML+7koHUFapnVJAZ6cKs+Qjz5Aw3aZWHMC6u0wJE3At+nSGwA=="
|
||||
},
|
||||
"node_modules/urql": {
|
||||
"version": "2.0.6",
|
||||
"resolved": "https://registry.npmjs.org/urql/-/urql-2.0.6.tgz",
|
||||
@@ -2529,8 +2605,7 @@
|
||||
"@chakra-ui/css-reset": {
|
||||
"version": "1.1.1",
|
||||
"resolved": "https://registry.npmjs.org/@chakra-ui/css-reset/-/css-reset-1.1.1.tgz",
|
||||
"integrity": "sha512-+KNNHL4OWqeKia5SL858K3Qbd8WxMij9mWIilBzLD4j2KFrl/+aWFw8syMKth3NmgIibrjsljo+PU3fy2o50dg==",
|
||||
"requires": {}
|
||||
"integrity": "sha512-+KNNHL4OWqeKia5SL858K3Qbd8WxMij9mWIilBzLD4j2KFrl/+aWFw8syMKth3NmgIibrjsljo+PU3fy2o50dg=="
|
||||
},
|
||||
"@chakra-ui/descendant": {
|
||||
"version": "2.1.1",
|
||||
@@ -3134,8 +3209,7 @@
|
||||
"@graphql-typed-document-node/core": {
|
||||
"version": "3.1.1",
|
||||
"resolved": "https://registry.npmjs.org/@graphql-typed-document-node/core/-/core-3.1.1.tgz",
|
||||
"integrity": "sha512-NQ17ii0rK1b34VZonlmT2QMJFI70m0TRwbknO/ihlbatXyaktDhN/98vBiUU6kNBPljqGqyIrl2T4nY2RpFANg==",
|
||||
"requires": {}
|
||||
"integrity": "sha512-NQ17ii0rK1b34VZonlmT2QMJFI70m0TRwbknO/ihlbatXyaktDhN/98vBiUU6kNBPljqGqyIrl2T4nY2RpFANg=="
|
||||
},
|
||||
"@popperjs/core": {
|
||||
"version": "2.11.0",
|
||||
@@ -3218,6 +3292,15 @@
|
||||
"@types/react": "*"
|
||||
}
|
||||
},
|
||||
"@types/react-email-editor": {
|
||||
"version": "1.1.7",
|
||||
"resolved": "https://registry.npmjs.org/@types/react-email-editor/-/react-email-editor-1.1.7.tgz",
|
||||
"integrity": "sha512-OURTAgaE9pjA6KiU97k13fPdoglI1ZyowUuZ0nu5tTSyrw5PiZoYzYEf9y25YTjmw/ohxT5yqoP0tt+AjSh1qQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"@types/react": "*"
|
||||
}
|
||||
},
|
||||
"@types/react-router": {
|
||||
"version": "5.1.17",
|
||||
"resolved": "https://registry.npmjs.org/@types/react-router/-/react-router-5.1.17.tgz",
|
||||
@@ -3316,6 +3399,11 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"classnames": {
|
||||
"version": "2.3.1",
|
||||
"resolved": "https://registry.npmjs.org/classnames/-/classnames-2.3.1.tgz",
|
||||
"integrity": "sha512-OlQdbZ7gLfGarSqxesMesDa5uz7KFbID8Kpq/SxIoNGDqY8lSYs0D+hhtBXhcdB3rcbXArFr7vlHheLk1voeNA=="
|
||||
},
|
||||
"color-convert": {
|
||||
"version": "1.9.3",
|
||||
"resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.3.tgz",
|
||||
@@ -3390,6 +3478,11 @@
|
||||
"resolved": "https://registry.npmjs.org/detect-node-es/-/detect-node-es-1.1.0.tgz",
|
||||
"integrity": "sha512-ypdmJU/TbBby2Dxibuv7ZLW3Bs1QEmM7nHjEANfohJLvE0XVujisn1qPJcZxg+qDucsr+bP6fLD1rPS3AhJ7EQ=="
|
||||
},
|
||||
"draftjs-utils": {
|
||||
"version": "0.10.2",
|
||||
"resolved": "https://registry.npmjs.org/draftjs-utils/-/draftjs-utils-0.10.2.tgz",
|
||||
"integrity": "sha512-EstHqr3R3JVcilJrBaO/A+01GvwwKmC7e4TCjC7S94ZeMh4IVmf60OuQXtHHpwItK8C2JCi3iljgN5KHkJboUg=="
|
||||
},
|
||||
"error-ex": {
|
||||
"version": "1.3.2",
|
||||
"resolved": "https://registry.npmjs.org/error-ex/-/error-ex-1.3.2.tgz",
|
||||
@@ -3659,6 +3752,11 @@
|
||||
"react-is": "^16.7.0"
|
||||
}
|
||||
},
|
||||
"html-to-draftjs": {
|
||||
"version": "1.5.0",
|
||||
"resolved": "https://registry.npmjs.org/html-to-draftjs/-/html-to-draftjs-1.5.0.tgz",
|
||||
"integrity": "sha512-kggLXBNciKDwKf+KYsuE+V5gw4dZ7nHyGMX9m0wy7urzWjKGWyNFetmArRLvRV0VrxKN70WylFsJvMTJx02OBQ=="
|
||||
},
|
||||
"import-fresh": {
|
||||
"version": "3.3.0",
|
||||
"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz",
|
||||
@@ -3704,6 +3802,14 @@
|
||||
"resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.2.4.tgz",
|
||||
"integrity": "sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg=="
|
||||
},
|
||||
"linkify-it": {
|
||||
"version": "2.2.0",
|
||||
"resolved": "https://registry.npmjs.org/linkify-it/-/linkify-it-2.2.0.tgz",
|
||||
"integrity": "sha512-GnAl/knGn+i1U/wjBz3akz2stz+HrHLsxMwHQGofCDfPvlf+gDKN58UtfmUquTY4/MXeE2x7k19KQmeoZi94Iw==",
|
||||
"requires": {
|
||||
"uc.micro": "^1.0.1"
|
||||
}
|
||||
},
|
||||
"lodash": {
|
||||
"version": "4.17.21",
|
||||
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
|
||||
@@ -3814,6 +3920,18 @@
|
||||
"scheduler": "^0.20.2"
|
||||
}
|
||||
},
|
||||
"react-draft-wysiwyg": {
|
||||
"version": "1.15.0",
|
||||
"resolved": "https://registry.npmjs.org/react-draft-wysiwyg/-/react-draft-wysiwyg-1.15.0.tgz",
|
||||
"integrity": "sha512-p1cYZcWc6/ALFBVksbFoCM3b29fGQDlZLIMrXng0TU/UElxIOF2/AWWo4L5auIYVhmqKTZ0NkNjnXOzGGuxyeA==",
|
||||
"requires": {
|
||||
"classnames": "^2.2.6",
|
||||
"draftjs-utils": "^0.10.2",
|
||||
"html-to-draftjs": "^1.5.0",
|
||||
"linkify-it": "^2.2.0",
|
||||
"prop-types": "^15.7.2"
|
||||
}
|
||||
},
|
||||
"react-dropzone": {
|
||||
"version": "12.0.4",
|
||||
"resolved": "https://registry.npmjs.org/react-dropzone/-/react-dropzone-12.0.4.tgz",
|
||||
@@ -3824,6 +3942,11 @@
|
||||
"prop-types": "^15.8.1"
|
||||
}
|
||||
},
|
||||
"react-email-editor": {
|
||||
"version": "1.6.1",
|
||||
"resolved": "https://registry.npmjs.org/react-email-editor/-/react-email-editor-1.6.1.tgz",
|
||||
"integrity": "sha512-pEWpRmTY0ok03cwTGqEOoEldnzThhuRGTrcMnv8W3/jc5MTfcr9USU/IQ9HrVvFStLKoxYBIQnSKY+iCYWOtSQ=="
|
||||
},
|
||||
"react-fast-compare": {
|
||||
"version": "3.2.0",
|
||||
"resolved": "https://registry.npmjs.org/react-fast-compare/-/react-fast-compare-3.2.0.tgz",
|
||||
@@ -3845,8 +3968,7 @@
|
||||
"react-icons": {
|
||||
"version": "4.3.1",
|
||||
"resolved": "https://registry.npmjs.org/react-icons/-/react-icons-4.3.1.tgz",
|
||||
"integrity": "sha512-cB10MXLTs3gVuXimblAdI71jrJx8njrJZmNMEMC+sQu5B/BIOmlsAjskdqpn81y8UBVEGuHODd7/ci5DvoSzTQ==",
|
||||
"requires": {}
|
||||
"integrity": "sha512-cB10MXLTs3gVuXimblAdI71jrJx8njrJZmNMEMC+sQu5B/BIOmlsAjskdqpn81y8UBVEGuHODd7/ci5DvoSzTQ=="
|
||||
},
|
||||
"react-is": {
|
||||
"version": "16.13.1",
|
||||
@@ -4020,6 +4142,11 @@
|
||||
"resolved": "https://registry.npmjs.org/typescript/-/typescript-4.5.4.tgz",
|
||||
"integrity": "sha512-VgYs2A2QIRuGphtzFV7aQJduJ2gyfTljngLzjpfW9FoYZF6xuw1W0vW9ghCKLfcWrCFxK81CSGRAvS1pn4fIUg=="
|
||||
},
|
||||
"uc.micro": {
|
||||
"version": "1.0.6",
|
||||
"resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-1.0.6.tgz",
|
||||
"integrity": "sha512-8Y75pvTYkLJW2hWQHXxoqRgV7qb9B+9vFEtidML+7koHUFapnVJAZ6cKs+Qjz5Aw3aZWHMC6u0wJE3At+nSGwA=="
|
||||
},
|
||||
"urql": {
|
||||
"version": "2.0.6",
|
||||
"resolved": "https://registry.npmjs.org/urql/-/urql-2.0.6.tgz",
|
||||
@@ -4032,8 +4159,7 @@
|
||||
"use-callback-ref": {
|
||||
"version": "1.2.5",
|
||||
"resolved": "https://registry.npmjs.org/use-callback-ref/-/use-callback-ref-1.2.5.tgz",
|
||||
"integrity": "sha512-gN3vgMISAgacF7sqsLPByqoePooY3n2emTH59Ur5d/M8eg4WTWu1xp8i8DHjohftIyEx0S08RiYxbffr4j8Peg==",
|
||||
"requires": {}
|
||||
"integrity": "sha512-gN3vgMISAgacF7sqsLPByqoePooY3n2emTH59Ur5d/M8eg4WTWu1xp8i8DHjohftIyEx0S08RiYxbffr4j8Peg=="
|
||||
},
|
||||
"use-sidecar": {
|
||||
"version": "1.0.5",
|
||||
|
||||
@@ -26,10 +26,15 @@
|
||||
"lodash": "^4.17.21",
|
||||
"react": "^17.0.2",
|
||||
"react-dom": "^17.0.2",
|
||||
"react-draft-wysiwyg": "^1.15.0",
|
||||
"react-dropzone": "^12.0.4",
|
||||
"react-email-editor": "^1.6.1",
|
||||
"react-icons": "^4.3.1",
|
||||
"react-router-dom": "^6.2.1",
|
||||
"typescript": "^4.5.4",
|
||||
"urql": "^2.0.6"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/react-email-editor": "^1.1.7"
|
||||
}
|
||||
}
|
||||
|
||||
106
dashboard/src/components/DeleteEmailTemplateModal.tsx
Normal file
106
dashboard/src/components/DeleteEmailTemplateModal.tsx
Normal file
@@ -0,0 +1,106 @@
|
||||
import React from 'react';
|
||||
import {
|
||||
Button,
|
||||
Center,
|
||||
Flex,
|
||||
MenuItem,
|
||||
Modal,
|
||||
ModalBody,
|
||||
ModalCloseButton,
|
||||
ModalContent,
|
||||
ModalFooter,
|
||||
ModalHeader,
|
||||
ModalOverlay,
|
||||
useDisclosure,
|
||||
Text,
|
||||
useToast,
|
||||
} from '@chakra-ui/react';
|
||||
import { useClient } from 'urql';
|
||||
import { FaRegTrashAlt } from 'react-icons/fa';
|
||||
import { DeleteEmailTemplate } from '../graphql/mutation';
|
||||
import { capitalizeFirstLetter } from '../utils';
|
||||
|
||||
interface deleteEmailTemplateModalInputPropTypes {
|
||||
emailTemplateId: string;
|
||||
eventName: string;
|
||||
fetchEmailTemplatesData: Function;
|
||||
}
|
||||
|
||||
const DeleteEmailTemplateModal = ({
|
||||
emailTemplateId,
|
||||
eventName,
|
||||
fetchEmailTemplatesData,
|
||||
}: deleteEmailTemplateModalInputPropTypes) => {
|
||||
const client = useClient();
|
||||
const toast = useToast();
|
||||
const { isOpen, onOpen, onClose } = useDisclosure();
|
||||
|
||||
const deleteHandler = async () => {
|
||||
const res = await client
|
||||
.mutation(DeleteEmailTemplate, { params: { id: emailTemplateId } })
|
||||
.toPromise();
|
||||
if (res.error) {
|
||||
toast({
|
||||
title: capitalizeFirstLetter(res.error.message),
|
||||
isClosable: true,
|
||||
status: 'error',
|
||||
position: 'bottom-right',
|
||||
});
|
||||
|
||||
return;
|
||||
} else if (res.data?._delete_email_template) {
|
||||
toast({
|
||||
title: capitalizeFirstLetter(res.data?._delete_email_template.message),
|
||||
isClosable: true,
|
||||
status: 'success',
|
||||
position: 'bottom-right',
|
||||
});
|
||||
}
|
||||
onClose();
|
||||
fetchEmailTemplatesData();
|
||||
};
|
||||
return (
|
||||
<>
|
||||
<MenuItem onClick={onOpen}>Delete</MenuItem>
|
||||
<Modal isOpen={isOpen} onClose={onClose}>
|
||||
<ModalOverlay />
|
||||
<ModalContent>
|
||||
<ModalHeader>Delete Email Template</ModalHeader>
|
||||
<ModalCloseButton />
|
||||
<ModalBody>
|
||||
<Text fontSize="md">Are you sure?</Text>
|
||||
<Flex
|
||||
padding="5%"
|
||||
marginTop="5%"
|
||||
marginBottom="2%"
|
||||
border="1px solid #ff7875"
|
||||
borderRadius="5px"
|
||||
flexDirection="column"
|
||||
>
|
||||
<Text fontSize="sm">
|
||||
Email template for event <b>{eventName}</b> will be deleted
|
||||
permanently!
|
||||
</Text>
|
||||
</Flex>
|
||||
</ModalBody>
|
||||
|
||||
<ModalFooter>
|
||||
<Button
|
||||
leftIcon={<FaRegTrashAlt />}
|
||||
colorScheme="red"
|
||||
variant="solid"
|
||||
onClick={deleteHandler}
|
||||
isDisabled={false}
|
||||
>
|
||||
<Center h="100%" pt="5%">
|
||||
Delete
|
||||
</Center>
|
||||
</Button>
|
||||
</ModalFooter>
|
||||
</ModalContent>
|
||||
</Modal>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default DeleteEmailTemplateModal;
|
||||
@@ -83,6 +83,35 @@ const Features = ({ variables, setVariables }: any) => {
|
||||
/>
|
||||
</Flex>
|
||||
</Flex>
|
||||
<Flex>
|
||||
<Flex w="100%" justifyContent="start" alignItems="center">
|
||||
<Text fontSize="sm">Disable Multi Factor Authentication:</Text>
|
||||
</Flex>
|
||||
<Flex justifyContent="start" mb={3}>
|
||||
<InputField
|
||||
variables={variables}
|
||||
setVariables={setVariables}
|
||||
inputType={SwitchInputType.DISABLE_MULTI_FACTOR_AUTHENTICATION}
|
||||
/>
|
||||
</Flex>
|
||||
</Flex>
|
||||
</Stack>
|
||||
<Text fontSize="md" paddingTop="2%" fontWeight="bold" mb={5}>
|
||||
Enable Features
|
||||
</Text>
|
||||
<Stack spacing={6} padding="2% 0%">
|
||||
<Flex>
|
||||
<Flex w="100%" justifyContent="start" alignItems="center">
|
||||
<Text fontSize="sm">Enforce Multi Factor Authentication:</Text>
|
||||
</Flex>
|
||||
<Flex justifyContent="start" mb={3}>
|
||||
<InputField
|
||||
variables={variables}
|
||||
setVariables={setVariables}
|
||||
inputType={SwitchInputType.ENFORCE_MULTI_FACTOR_AUTHENTICATION}
|
||||
/>
|
||||
</Flex>
|
||||
</Flex>
|
||||
</Stack>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -12,7 +12,6 @@ import {
|
||||
Select,
|
||||
Textarea,
|
||||
Switch,
|
||||
Code,
|
||||
Text,
|
||||
} from '@chakra-ui/react';
|
||||
import {
|
||||
|
||||
@@ -31,6 +31,7 @@ import {
|
||||
FiUsers,
|
||||
FiChevronDown,
|
||||
FiLink,
|
||||
FiFileText,
|
||||
} from 'react-icons/fi';
|
||||
import { BiCustomize } from 'react-icons/bi';
|
||||
import { AiOutlineKey } from 'react-icons/ai';
|
||||
@@ -113,6 +114,7 @@ const LinkItems: Array<LinkItemProps> = [
|
||||
},
|
||||
{ name: 'Users', icon: FiUsers, route: '/users' },
|
||||
{ name: 'Webhooks', icon: FiLink, route: '/webhooks' },
|
||||
{ name: 'Email Templates', icon: FiFileText, route: '/email-templates' },
|
||||
];
|
||||
|
||||
interface SidebarProps extends BoxProps {
|
||||
|
||||
457
dashboard/src/components/UpdateEmailTemplateModal.tsx
Normal file
457
dashboard/src/components/UpdateEmailTemplateModal.tsx
Normal file
@@ -0,0 +1,457 @@
|
||||
import React, { useEffect, useRef, useState } from 'react';
|
||||
import {
|
||||
Button,
|
||||
Center,
|
||||
Flex,
|
||||
Input,
|
||||
InputGroup,
|
||||
MenuItem,
|
||||
Modal,
|
||||
ModalBody,
|
||||
ModalCloseButton,
|
||||
ModalContent,
|
||||
ModalFooter,
|
||||
ModalHeader,
|
||||
ModalOverlay,
|
||||
Select,
|
||||
Text,
|
||||
useDisclosure,
|
||||
useToast,
|
||||
Alert,
|
||||
AlertIcon,
|
||||
Collapse,
|
||||
Box,
|
||||
TableContainer,
|
||||
Table,
|
||||
Thead,
|
||||
Tr,
|
||||
Th,
|
||||
Tbody,
|
||||
Td,
|
||||
Code,
|
||||
} from '@chakra-ui/react';
|
||||
import { FaPlus, FaAngleDown, FaAngleUp } from 'react-icons/fa';
|
||||
import { useClient } from 'urql';
|
||||
import EmailEditor from 'react-email-editor';
|
||||
import {
|
||||
UpdateModalViews,
|
||||
EmailTemplateInputDataFields,
|
||||
emailTemplateEventNames,
|
||||
emailTemplateVariables,
|
||||
} from '../constants';
|
||||
import { capitalizeFirstLetter } from '../utils';
|
||||
import { AddEmailTemplate, EditEmailTemplate } from '../graphql/mutation';
|
||||
|
||||
interface selectedEmailTemplateDataTypes {
|
||||
[EmailTemplateInputDataFields.ID]: string;
|
||||
[EmailTemplateInputDataFields.EVENT_NAME]: string;
|
||||
[EmailTemplateInputDataFields.SUBJECT]: string;
|
||||
[EmailTemplateInputDataFields.CREATED_AT]: number;
|
||||
[EmailTemplateInputDataFields.TEMPLATE]: string;
|
||||
[EmailTemplateInputDataFields.DESIGN]: string;
|
||||
}
|
||||
|
||||
interface UpdateEmailTemplateInputPropTypes {
|
||||
view: UpdateModalViews;
|
||||
selectedTemplate?: selectedEmailTemplateDataTypes;
|
||||
fetchEmailTemplatesData: Function;
|
||||
}
|
||||
|
||||
interface templateVariableDataTypes {
|
||||
text: string;
|
||||
value: string;
|
||||
description: string;
|
||||
}
|
||||
|
||||
interface emailTemplateDataType {
|
||||
[EmailTemplateInputDataFields.EVENT_NAME]: string;
|
||||
[EmailTemplateInputDataFields.SUBJECT]: string;
|
||||
}
|
||||
|
||||
interface validatorDataType {
|
||||
[EmailTemplateInputDataFields.SUBJECT]: boolean;
|
||||
}
|
||||
|
||||
const initTemplateData: emailTemplateDataType = {
|
||||
[EmailTemplateInputDataFields.EVENT_NAME]: emailTemplateEventNames.Signup,
|
||||
[EmailTemplateInputDataFields.SUBJECT]: '',
|
||||
};
|
||||
|
||||
const initTemplateValidatorData: validatorDataType = {
|
||||
[EmailTemplateInputDataFields.SUBJECT]: true,
|
||||
};
|
||||
|
||||
const UpdateEmailTemplate = ({
|
||||
view,
|
||||
selectedTemplate,
|
||||
fetchEmailTemplatesData,
|
||||
}: UpdateEmailTemplateInputPropTypes) => {
|
||||
const client = useClient();
|
||||
const toast = useToast();
|
||||
const emailEditorRef = useRef(null);
|
||||
const { isOpen, onOpen, onClose } = useDisclosure();
|
||||
const [loading, setLoading] = useState<boolean>(false);
|
||||
const [templateVariables, setTemplateVariables] = useState<
|
||||
templateVariableDataTypes[]
|
||||
>([]);
|
||||
const [templateData, setTemplateData] = useState<emailTemplateDataType>({
|
||||
...initTemplateData,
|
||||
});
|
||||
const [validator, setValidator] = useState<validatorDataType>({
|
||||
...initTemplateValidatorData,
|
||||
});
|
||||
const [isDynamicVariableInfoOpen, setIsDynamicVariableInfoOpen] =
|
||||
useState<boolean>(false);
|
||||
|
||||
const onReady = () => {
|
||||
if (selectedTemplate) {
|
||||
const { design } = selectedTemplate;
|
||||
try {
|
||||
const designData = JSON.parse(design);
|
||||
// @ts-ignore
|
||||
emailEditorRef.current.editor.loadDesign(designData);
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
onClose();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const inputChangehandler = (inputType: string, value: any) => {
|
||||
if (inputType !== EmailTemplateInputDataFields.EVENT_NAME) {
|
||||
setValidator({
|
||||
...validator,
|
||||
[inputType]: value?.trim().length,
|
||||
});
|
||||
}
|
||||
setTemplateData({ ...templateData, [inputType]: value });
|
||||
};
|
||||
|
||||
const validateData = () => {
|
||||
return (
|
||||
!loading &&
|
||||
templateData[EmailTemplateInputDataFields.EVENT_NAME].length > 0 &&
|
||||
templateData[EmailTemplateInputDataFields.SUBJECT].length > 0 &&
|
||||
validator[EmailTemplateInputDataFields.SUBJECT]
|
||||
);
|
||||
};
|
||||
|
||||
const saveData = async () => {
|
||||
if (!validateData()) return;
|
||||
setLoading(true);
|
||||
// @ts-ignore
|
||||
return await emailEditorRef.current.editor.exportHtml(async (data) => {
|
||||
const { design, html } = data;
|
||||
if (!html || !design) {
|
||||
setLoading(false);
|
||||
return;
|
||||
}
|
||||
const params = {
|
||||
[EmailTemplateInputDataFields.EVENT_NAME]:
|
||||
templateData[EmailTemplateInputDataFields.EVENT_NAME],
|
||||
[EmailTemplateInputDataFields.SUBJECT]:
|
||||
templateData[EmailTemplateInputDataFields.SUBJECT],
|
||||
[EmailTemplateInputDataFields.TEMPLATE]: html.trim(),
|
||||
[EmailTemplateInputDataFields.DESIGN]: JSON.stringify(design),
|
||||
};
|
||||
let res: any = {};
|
||||
if (
|
||||
view === UpdateModalViews.Edit &&
|
||||
selectedTemplate?.[EmailTemplateInputDataFields.ID]
|
||||
) {
|
||||
res = await client
|
||||
.mutation(EditEmailTemplate, {
|
||||
params: {
|
||||
...params,
|
||||
id: selectedTemplate[EmailTemplateInputDataFields.ID],
|
||||
},
|
||||
})
|
||||
.toPromise();
|
||||
} else {
|
||||
res = await client.mutation(AddEmailTemplate, { params }).toPromise();
|
||||
}
|
||||
setLoading(false);
|
||||
if (res.error) {
|
||||
toast({
|
||||
title: capitalizeFirstLetter(res.error.message),
|
||||
isClosable: true,
|
||||
status: 'error',
|
||||
position: 'bottom-right',
|
||||
});
|
||||
} else if (
|
||||
res.data?._add_email_template ||
|
||||
res.data?._update_email_template
|
||||
) {
|
||||
toast({
|
||||
title: capitalizeFirstLetter(
|
||||
res.data?._add_email_template?.message ||
|
||||
res.data?._update_email_template?.message
|
||||
),
|
||||
isClosable: true,
|
||||
status: 'success',
|
||||
position: 'bottom-right',
|
||||
});
|
||||
setTemplateData({
|
||||
...initTemplateData,
|
||||
});
|
||||
setValidator({ ...initTemplateValidatorData });
|
||||
fetchEmailTemplatesData();
|
||||
}
|
||||
view === UpdateModalViews.ADD && onClose();
|
||||
});
|
||||
};
|
||||
const resetData = () => {
|
||||
if (selectedTemplate) {
|
||||
setTemplateData(selectedTemplate);
|
||||
} else {
|
||||
setTemplateData({ ...initTemplateData });
|
||||
}
|
||||
};
|
||||
useEffect(() => {
|
||||
if (
|
||||
isOpen &&
|
||||
view === UpdateModalViews.Edit &&
|
||||
selectedTemplate &&
|
||||
Object.keys(selectedTemplate || {}).length
|
||||
) {
|
||||
const { id, created_at, template, design, ...rest } = selectedTemplate;
|
||||
setTemplateData(rest);
|
||||
}
|
||||
}, [isOpen]);
|
||||
useEffect(() => {
|
||||
const updatedTemplateVariables = Object.entries(
|
||||
emailTemplateVariables
|
||||
).reduce((acc, [key, val]): any => {
|
||||
if (
|
||||
(templateData[EmailTemplateInputDataFields.EVENT_NAME] !==
|
||||
emailTemplateEventNames['Verify Otp'] &&
|
||||
val === emailTemplateVariables.otp) ||
|
||||
(templateData[EmailTemplateInputDataFields.EVENT_NAME] ===
|
||||
emailTemplateEventNames['Verify Otp'] &&
|
||||
val === emailTemplateVariables.verification_url)
|
||||
) {
|
||||
return acc;
|
||||
}
|
||||
return [
|
||||
...acc,
|
||||
{
|
||||
text: key,
|
||||
value: val.value,
|
||||
description: val.description,
|
||||
},
|
||||
];
|
||||
}, []);
|
||||
setTemplateVariables(updatedTemplateVariables);
|
||||
}, [templateData[EmailTemplateInputDataFields.EVENT_NAME]]);
|
||||
|
||||
return (
|
||||
<>
|
||||
{view === UpdateModalViews.ADD ? (
|
||||
<Button
|
||||
leftIcon={<FaPlus />}
|
||||
colorScheme="blue"
|
||||
variant="solid"
|
||||
onClick={onOpen}
|
||||
isDisabled={false}
|
||||
size="sm"
|
||||
>
|
||||
<Center h="100%">Add Template</Center>{' '}
|
||||
</Button>
|
||||
) : (
|
||||
<MenuItem onClick={onOpen}>Edit</MenuItem>
|
||||
)}
|
||||
<Modal
|
||||
isOpen={isOpen}
|
||||
onClose={() => {
|
||||
resetData();
|
||||
onClose();
|
||||
}}
|
||||
size="6xl"
|
||||
>
|
||||
<ModalOverlay />
|
||||
<ModalContent>
|
||||
<ModalHeader>
|
||||
{view === UpdateModalViews.ADD
|
||||
? 'Add New Email Template'
|
||||
: 'Edit Email Template'}
|
||||
</ModalHeader>
|
||||
<ModalCloseButton />
|
||||
<ModalBody>
|
||||
<Flex
|
||||
flexDirection="column"
|
||||
border="1px"
|
||||
borderRadius="md"
|
||||
borderColor="gray.200"
|
||||
p="5"
|
||||
>
|
||||
<Alert
|
||||
status="info"
|
||||
onClick={() =>
|
||||
setIsDynamicVariableInfoOpen(!isDynamicVariableInfoOpen)
|
||||
}
|
||||
borderRadius="5"
|
||||
marginBottom={5}
|
||||
cursor="pointer"
|
||||
fontSize="sm"
|
||||
>
|
||||
<AlertIcon />
|
||||
<Flex
|
||||
width="100%"
|
||||
justifyContent="space-between"
|
||||
alignItems="center"
|
||||
>
|
||||
<Box width="85%">
|
||||
<b>Note:</b> You can add set of dynamic variables to subject
|
||||
and email body. Click here to see the set of dynamic
|
||||
variables.
|
||||
</Box>
|
||||
{isDynamicVariableInfoOpen ? <FaAngleUp /> : <FaAngleDown />}
|
||||
</Flex>
|
||||
</Alert>
|
||||
<Collapse
|
||||
style={{
|
||||
width: '100%',
|
||||
}}
|
||||
in={isDynamicVariableInfoOpen}
|
||||
>
|
||||
<TableContainer
|
||||
background="gray.100"
|
||||
borderRadius={5}
|
||||
height={200}
|
||||
width="100%"
|
||||
overflowY="auto"
|
||||
overflowWrap="break-word"
|
||||
>
|
||||
<Table variant="simple">
|
||||
<Thead>
|
||||
<Tr>
|
||||
<Th>Variable</Th>
|
||||
<Th>Description</Th>
|
||||
</Tr>
|
||||
</Thead>
|
||||
<Tbody>
|
||||
{templateVariables.map((i) => (
|
||||
<Tr key={i.text}>
|
||||
<Td>
|
||||
<Code fontSize="sm">{`{{${i.text}}}`}</Code>
|
||||
</Td>
|
||||
<Td>
|
||||
<Text
|
||||
size="sm"
|
||||
fontSize="sm"
|
||||
overflowWrap="break-word"
|
||||
width="100%"
|
||||
>
|
||||
{i.description}
|
||||
</Text>
|
||||
</Td>
|
||||
</Tr>
|
||||
))}
|
||||
</Tbody>
|
||||
</Table>
|
||||
</TableContainer>
|
||||
</Collapse>
|
||||
<Flex
|
||||
width="100%"
|
||||
justifyContent="space-between"
|
||||
alignItems="center"
|
||||
marginBottom="2%"
|
||||
>
|
||||
<Flex flex="1">Event Name</Flex>
|
||||
<Flex flex="3">
|
||||
<Select
|
||||
size="md"
|
||||
value={
|
||||
templateData[EmailTemplateInputDataFields.EVENT_NAME]
|
||||
}
|
||||
onChange={(e) =>
|
||||
inputChangehandler(
|
||||
EmailTemplateInputDataFields.EVENT_NAME,
|
||||
e.currentTarget.value
|
||||
)
|
||||
}
|
||||
>
|
||||
{Object.entries(emailTemplateEventNames).map(
|
||||
([key, value]: any) => (
|
||||
<option value={value} key={key}>
|
||||
{key}
|
||||
</option>
|
||||
)
|
||||
)}
|
||||
</Select>
|
||||
</Flex>
|
||||
</Flex>
|
||||
<Flex
|
||||
width="100%"
|
||||
justifyContent="start"
|
||||
alignItems="center"
|
||||
marginBottom="2%"
|
||||
>
|
||||
<Flex flex="1">Subject</Flex>
|
||||
<Flex flex="3">
|
||||
<InputGroup size="md">
|
||||
<Input
|
||||
pr="4.5rem"
|
||||
type="text"
|
||||
placeholder="Subject Line"
|
||||
value={templateData[EmailTemplateInputDataFields.SUBJECT]}
|
||||
isInvalid={
|
||||
!validator[EmailTemplateInputDataFields.SUBJECT]
|
||||
}
|
||||
onChange={(e) =>
|
||||
inputChangehandler(
|
||||
EmailTemplateInputDataFields.SUBJECT,
|
||||
e.currentTarget.value
|
||||
)
|
||||
}
|
||||
/>
|
||||
</InputGroup>
|
||||
</Flex>
|
||||
</Flex>
|
||||
<Flex
|
||||
width="100%"
|
||||
justifyContent="flex-start"
|
||||
alignItems="center"
|
||||
marginBottom="2%"
|
||||
>
|
||||
Template Body
|
||||
</Flex>
|
||||
<Flex
|
||||
width="100%"
|
||||
justifyContent="flex-start"
|
||||
alignItems="center"
|
||||
border="1px solid"
|
||||
borderColor="gray.200"
|
||||
>
|
||||
<EmailEditor ref={emailEditorRef} onReady={onReady} />
|
||||
</Flex>
|
||||
</Flex>
|
||||
</ModalBody>
|
||||
<ModalFooter>
|
||||
<Button
|
||||
variant="outline"
|
||||
onClick={resetData}
|
||||
isDisabled={loading}
|
||||
marginRight="5"
|
||||
>
|
||||
Reset
|
||||
</Button>
|
||||
<Button
|
||||
colorScheme="blue"
|
||||
variant="solid"
|
||||
isLoading={loading}
|
||||
onClick={saveData}
|
||||
isDisabled={!validateData()}
|
||||
>
|
||||
<Center h="100%" pt="5%">
|
||||
Save
|
||||
</Center>
|
||||
</Button>
|
||||
</ModalFooter>
|
||||
</ModalContent>
|
||||
</Modal>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
export default UpdateEmailTemplate;
|
||||
@@ -2,6 +2,8 @@ import React, { useEffect, useState } from 'react';
|
||||
import {
|
||||
Button,
|
||||
Center,
|
||||
Code,
|
||||
Collapse,
|
||||
Flex,
|
||||
Input,
|
||||
InputGroup,
|
||||
@@ -19,20 +21,33 @@ import {
|
||||
Text,
|
||||
useDisclosure,
|
||||
useToast,
|
||||
Alert,
|
||||
AlertIcon,
|
||||
Divider,
|
||||
} from '@chakra-ui/react';
|
||||
import { FaMinusCircle, FaPlus } from 'react-icons/fa';
|
||||
import {
|
||||
FaAngleDown,
|
||||
FaAngleUp,
|
||||
FaMinusCircle,
|
||||
FaPlus,
|
||||
FaRegClone,
|
||||
} from 'react-icons/fa';
|
||||
import { useClient } from 'urql';
|
||||
import {
|
||||
webhookEventNames,
|
||||
ArrayInputOperations,
|
||||
WebhookInputDataFields,
|
||||
WebhookInputHeaderFields,
|
||||
UpdateWebhookModalViews,
|
||||
UpdateModalViews,
|
||||
webhookVerifiedStatus,
|
||||
webhookPayloadExample,
|
||||
} from '../constants';
|
||||
import { capitalizeFirstLetter, validateURI } from '../utils';
|
||||
import {
|
||||
capitalizeFirstLetter,
|
||||
copyTextToClipboard,
|
||||
validateURI,
|
||||
} from '../utils';
|
||||
import { AddWebhook, EditWebhook, TestEndpoint } from '../graphql/mutation';
|
||||
import { rest } from 'lodash';
|
||||
import { BiCheckCircle, BiError, BiErrorCircle } from 'react-icons/bi';
|
||||
|
||||
interface headersDataType {
|
||||
@@ -54,7 +69,7 @@ interface selecetdWebhookDataTypes {
|
||||
}
|
||||
|
||||
interface UpdateWebhookModalInputPropTypes {
|
||||
view: UpdateWebhookModalViews;
|
||||
view: UpdateModalViews;
|
||||
selectedWebhook?: selecetdWebhookDataTypes;
|
||||
fetchWebookData: Function;
|
||||
}
|
||||
@@ -82,7 +97,7 @@ interface validatorDataType {
|
||||
}
|
||||
|
||||
const initWebhookData: webhookDataType = {
|
||||
[WebhookInputDataFields.EVENT_NAME]: webhookEventNames.USER_LOGIN,
|
||||
[WebhookInputDataFields.EVENT_NAME]: webhookEventNames['User login'],
|
||||
[WebhookInputDataFields.ENDPOINT]: '',
|
||||
[WebhookInputDataFields.ENABLED]: true,
|
||||
[WebhookInputDataFields.HEADERS]: [{ ...initHeadersData }],
|
||||
@@ -103,6 +118,7 @@ const UpdateWebhookModal = ({
|
||||
const { isOpen, onOpen, onClose } = useDisclosure();
|
||||
const [loading, setLoading] = useState<boolean>(false);
|
||||
const [verifyingEndpoint, setVerifyingEndpoint] = useState<boolean>(false);
|
||||
const [isShowingPayload, setIsShowingPayload] = useState<boolean>(false);
|
||||
const [webhook, setWebhook] = useState<webhookDataType>({
|
||||
...initWebhookData,
|
||||
});
|
||||
@@ -254,7 +270,7 @@ const UpdateWebhookModal = ({
|
||||
const params = getParams();
|
||||
let res: any = {};
|
||||
if (
|
||||
view === UpdateWebhookModalViews.Edit &&
|
||||
view === UpdateModalViews.Edit &&
|
||||
selectedWebhook?.[WebhookInputDataFields.ID]
|
||||
) {
|
||||
res = await client
|
||||
@@ -292,12 +308,12 @@ const UpdateWebhookModal = ({
|
||||
setValidator({ ...initWebhookValidatorData });
|
||||
fetchWebookData();
|
||||
}
|
||||
view === UpdateWebhookModalViews.ADD && onClose();
|
||||
view === UpdateModalViews.ADD && onClose();
|
||||
};
|
||||
useEffect(() => {
|
||||
if (
|
||||
isOpen &&
|
||||
view === UpdateWebhookModalViews.Edit &&
|
||||
view === UpdateModalViews.Edit &&
|
||||
selectedWebhook &&
|
||||
Object.keys(selectedWebhook || {}).length
|
||||
) {
|
||||
@@ -347,7 +363,7 @@ const UpdateWebhookModal = ({
|
||||
};
|
||||
return (
|
||||
<>
|
||||
{view === UpdateWebhookModalViews.ADD ? (
|
||||
{view === UpdateModalViews.ADD ? (
|
||||
<Button
|
||||
leftIcon={<FaPlus />}
|
||||
colorScheme="blue"
|
||||
@@ -365,9 +381,7 @@ const UpdateWebhookModal = ({
|
||||
<ModalOverlay />
|
||||
<ModalContent>
|
||||
<ModalHeader>
|
||||
{view === UpdateWebhookModalViews.ADD
|
||||
? 'Add New Webhook'
|
||||
: 'Edit Webhook'}
|
||||
{view === UpdateModalViews.ADD ? 'Add New Webhook' : 'Edit Webhook'}
|
||||
</ModalHeader>
|
||||
<ModalCloseButton />
|
||||
<ModalBody>
|
||||
@@ -457,11 +471,12 @@ const UpdateWebhookModal = ({
|
||||
</Text>
|
||||
</Flex>
|
||||
</Flex>
|
||||
|
||||
<Flex
|
||||
width="100%"
|
||||
justifyContent="space-between"
|
||||
alignItems="center"
|
||||
marginBottom="2%"
|
||||
marginBottom="5%"
|
||||
>
|
||||
<Flex>Headers</Flex>
|
||||
<Flex>
|
||||
@@ -478,7 +493,8 @@ const UpdateWebhookModal = ({
|
||||
</Button>
|
||||
</Flex>
|
||||
</Flex>
|
||||
<Flex flexDirection="column" maxH={220} overflowY="scroll">
|
||||
|
||||
<Flex flexDirection="column" maxH={220} overflowY="auto">
|
||||
{webhook[WebhookInputDataFields.HEADERS]?.map(
|
||||
(headerData, index) => (
|
||||
<Flex
|
||||
@@ -547,6 +563,54 @@ const UpdateWebhookModal = ({
|
||||
)
|
||||
)}
|
||||
</Flex>
|
||||
<Divider marginY={5} />
|
||||
|
||||
<Alert
|
||||
status="info"
|
||||
onClick={() => setIsShowingPayload(!isShowingPayload)}
|
||||
borderRadius="5"
|
||||
cursor="pointer"
|
||||
fontSize="sm"
|
||||
>
|
||||
<AlertIcon />
|
||||
<Flex
|
||||
width="100%"
|
||||
justifyContent="space-between"
|
||||
alignItems="center"
|
||||
>
|
||||
Checkout the example payload
|
||||
{isShowingPayload ? <FaAngleUp /> : <FaAngleDown />}
|
||||
</Flex>
|
||||
</Alert>
|
||||
<Collapse
|
||||
style={{
|
||||
marginTop: 10,
|
||||
width: '100%',
|
||||
}}
|
||||
in={isShowingPayload}
|
||||
>
|
||||
<Code
|
||||
width="inherit"
|
||||
borderRadius={5}
|
||||
padding={2}
|
||||
position="relative"
|
||||
>
|
||||
<pre style={{ overflow: 'auto' }}>
|
||||
{webhookPayloadExample}
|
||||
</pre>
|
||||
{isShowingPayload && (
|
||||
<Flex
|
||||
position="absolute"
|
||||
top={4}
|
||||
right={4}
|
||||
cursor="pointer"
|
||||
onClick={() => copyTextToClipboard(webhookPayloadExample)}
|
||||
>
|
||||
<FaRegClone color="#bfbfbf" />
|
||||
</Flex>
|
||||
)}
|
||||
</Code>
|
||||
</Collapse>
|
||||
</Flex>
|
||||
</ModalBody>
|
||||
<ModalFooter>
|
||||
|
||||
@@ -68,6 +68,8 @@ export const SwitchInputType = {
|
||||
DISABLE_SIGN_UP: 'DISABLE_SIGN_UP',
|
||||
DISABLE_REDIS_FOR_ENV: 'DISABLE_REDIS_FOR_ENV',
|
||||
DISABLE_STRONG_PASSWORD: 'DISABLE_STRONG_PASSWORD',
|
||||
DISABLE_MULTI_FACTOR_AUTHENTICATION: 'DISABLE_MULTI_FACTOR_AUTHENTICATION',
|
||||
ENFORCE_MULTI_FACTOR_AUTHENTICATION: 'ENFORCE_MULTI_FACTOR_AUTHENTICATION',
|
||||
};
|
||||
|
||||
export const DateInputType = {
|
||||
@@ -138,6 +140,8 @@ export interface envVarTypes {
|
||||
DATABASE_TYPE: string;
|
||||
DATABASE_URL: string;
|
||||
ACCESS_TOKEN_EXPIRY_TIME: string;
|
||||
DISABLE_MULTI_FACTOR_AUTHENTICATION: boolean;
|
||||
ENFORCE_MULTI_FACTOR_AUTHENTICATION: boolean;
|
||||
}
|
||||
|
||||
export const envSubViews = {
|
||||
@@ -162,12 +166,21 @@ export enum WebhookInputDataFields {
|
||||
HEADERS = 'headers',
|
||||
}
|
||||
|
||||
export enum EmailTemplateInputDataFields {
|
||||
ID = 'id',
|
||||
EVENT_NAME = 'event_name',
|
||||
SUBJECT = 'subject',
|
||||
CREATED_AT = 'created_at',
|
||||
TEMPLATE = 'template',
|
||||
DESIGN = 'design',
|
||||
}
|
||||
|
||||
export enum WebhookInputHeaderFields {
|
||||
KEY = 'key',
|
||||
VALUE = 'value',
|
||||
}
|
||||
|
||||
export enum UpdateWebhookModalViews {
|
||||
export enum UpdateModalViews {
|
||||
ADD = 'add',
|
||||
Edit = 'edit',
|
||||
}
|
||||
@@ -175,12 +188,21 @@ export enum UpdateWebhookModalViews {
|
||||
export const pageLimits: number[] = [5, 10, 15];
|
||||
|
||||
export const webhookEventNames = {
|
||||
USER_SIGNUP: 'user.signup',
|
||||
USER_CREATED: 'user.created',
|
||||
USER_LOGIN: 'user.login',
|
||||
USER_DELETED: 'user.deleted',
|
||||
USER_ACCESS_ENABLED: 'user.access_enabled',
|
||||
USER_ACCESS_REVOKED: 'user.access_revoked',
|
||||
'User signup': 'user.signup',
|
||||
'User created': 'user.created',
|
||||
'User login': 'user.login',
|
||||
'User deleted': 'user.deleted',
|
||||
'User access enabled': 'user.access_enabled',
|
||||
'User access revoked': 'user.access_revoked',
|
||||
};
|
||||
|
||||
export const emailTemplateEventNames = {
|
||||
Signup: 'basic_auth_signup',
|
||||
'Magic Link Login': 'magic_link_login',
|
||||
'Update Email': 'update_email',
|
||||
'Forgot Password': 'forgot_password',
|
||||
'Verify Otp': 'verify_otp',
|
||||
'Invite member': 'invite_member',
|
||||
};
|
||||
|
||||
export enum webhookVerifiedStatus {
|
||||
@@ -188,3 +210,117 @@ export enum webhookVerifiedStatus {
|
||||
NOT_VERIFIED = 'not_verified',
|
||||
PENDING = 'verification_pending',
|
||||
}
|
||||
|
||||
export const emailTemplateVariables = {
|
||||
'user.id': {
|
||||
description: `User identifier`,
|
||||
value: '{.user.id}}',
|
||||
},
|
||||
'user.email': {
|
||||
description: 'User email address',
|
||||
value: '{.user.email}}',
|
||||
},
|
||||
'user.given_name': {
|
||||
description: `User first name`,
|
||||
value: '{.user.given_name}}',
|
||||
},
|
||||
'user.family_name': {
|
||||
description: `User last name`,
|
||||
value: '{.user.family_name}}',
|
||||
},
|
||||
'user.middle_name': {
|
||||
description: `Middle name of user`,
|
||||
value: '{.user.middle_name}}',
|
||||
},
|
||||
'user.nickname': {
|
||||
description: `Nick name of user`,
|
||||
value: '{.user.nickname}}',
|
||||
},
|
||||
'user.preferred_username': {
|
||||
description: `Username, by default it is email`,
|
||||
value: '{.user.preferred_username}}',
|
||||
},
|
||||
'user.signup_methods': {
|
||||
description: `Comma separated list of methods using which user has signed up`,
|
||||
value: '{.user.signup_methods}}',
|
||||
},
|
||||
'user.email_verified': {
|
||||
description: `Whether email is verified or not`,
|
||||
value: '{.user.email_verified}}',
|
||||
},
|
||||
'user.picture': {
|
||||
description: `URL of the user profile picture`,
|
||||
value: '{.user.picture}}',
|
||||
},
|
||||
'user.roles': {
|
||||
description: `Comma separated list of roles assigned to user`,
|
||||
value: '{.user.roles}}',
|
||||
},
|
||||
'user.gender': {
|
||||
description: `Gender of user`,
|
||||
value: '{.user.gender}}',
|
||||
},
|
||||
'user.birthdate': {
|
||||
description: `BirthDate of user`,
|
||||
value: '{.user.birthdate}}',
|
||||
},
|
||||
'user.phone_number': {
|
||||
description: `Phone number of user`,
|
||||
value: '{.user.phone_number}}',
|
||||
},
|
||||
'user.phone_number_verified': {
|
||||
description: `Whether phone number is verified or not`,
|
||||
value: '{.user.phone_number_verified}}',
|
||||
},
|
||||
'user.created_at': {
|
||||
description: `User created at time`,
|
||||
value: '{.user.created_at}}',
|
||||
},
|
||||
'user.updated_at': {
|
||||
description: `Last updated time at user`,
|
||||
value: '{.user.updated_at}}',
|
||||
},
|
||||
'organization.name': {
|
||||
description: `Organization name`,
|
||||
value: '{.organization.name}}',
|
||||
},
|
||||
'organization.logo': {
|
||||
description: `Organization logo`,
|
||||
value: '{.organization.logo}}',
|
||||
},
|
||||
verification_url: {
|
||||
description: `Verification URL in case of events other than verify otp`,
|
||||
value: '{.verification_url}}',
|
||||
},
|
||||
otp: {
|
||||
description: `OTP sent during login with Multi factor authentication`,
|
||||
value: '{.otp}}',
|
||||
},
|
||||
};
|
||||
|
||||
export const webhookPayloadExample: string = `{
|
||||
"event_name":"user.login",
|
||||
"user":{
|
||||
"birthdate":null,
|
||||
"created_at":1657524721,
|
||||
"email":"lakhan.m.samani@gmail.com",
|
||||
"email_verified":true,
|
||||
"family_name":"Samani",
|
||||
"gender":null,
|
||||
"given_name":"Lakhan",
|
||||
"id":"466d0b31-1b87-420e-bea5-09d05d79c586",
|
||||
"middle_name":null,
|
||||
"nickname":null,
|
||||
"phone_number":null,
|
||||
"phone_number_verified":false,
|
||||
"picture":"https://lh3.googleusercontent.com/a-/AFdZucppvU6a2zIDkX0wvhhapVjT0ZMKDlYCkQDi3NxcUg=s96-c",
|
||||
"preferred_username":"lakhan.m.samani@gmail.com",
|
||||
"revoked_timestamp":null,
|
||||
"roles":[
|
||||
"user"
|
||||
],
|
||||
"signup_methods":"google",
|
||||
"updated_at":1657526492
|
||||
},
|
||||
"auth_recipe":"google"
|
||||
}`;
|
||||
|
||||
@@ -112,3 +112,27 @@ export const TestEndpoint = `
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
export const AddEmailTemplate = `
|
||||
mutation addEmailTemplate($params: AddEmailTemplateRequest!) {
|
||||
_add_email_template(params: $params) {
|
||||
message
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
export const EditEmailTemplate = `
|
||||
mutation editEmailTemplate($params: UpdateEmailTemplateRequest!) {
|
||||
_update_email_template(params: $params) {
|
||||
message
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
export const DeleteEmailTemplate = `
|
||||
mutation deleteEmailTemplate($params: DeleteEmailTemplateRequest!) {
|
||||
_delete_email_template(params: $params) {
|
||||
message
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
@@ -60,6 +60,8 @@ export const EnvVariablesQuery = `
|
||||
DATABASE_TYPE,
|
||||
DATABASE_URL,
|
||||
ACCESS_TOKEN_EXPIRY_TIME,
|
||||
DISABLE_MULTI_FACTOR_AUTHENTICATION,
|
||||
ENFORCE_MULTI_FACTOR_AUTHENTICATION,
|
||||
}
|
||||
}
|
||||
`;
|
||||
@@ -123,6 +125,27 @@ export const WebhooksDataQuery = `
|
||||
}
|
||||
`;
|
||||
|
||||
export const EmailTemplatesQuery = `
|
||||
query getEmailTemplates($params: PaginatedInput!) {
|
||||
_email_templates(params: $params) {
|
||||
email_templates {
|
||||
id
|
||||
event_name
|
||||
subject
|
||||
created_at
|
||||
template
|
||||
design
|
||||
}
|
||||
pagination {
|
||||
limit
|
||||
page
|
||||
offset
|
||||
total
|
||||
}
|
||||
}
|
||||
}
|
||||
`;
|
||||
|
||||
export const WebhookLogsQuery = `
|
||||
query getWebhookLogs($params: ListWebhookLogRequest!) {
|
||||
_webhook_logs(params: $params) {
|
||||
|
||||
348
dashboard/src/pages/EmailTemplates.tsx
Normal file
348
dashboard/src/pages/EmailTemplates.tsx
Normal file
@@ -0,0 +1,348 @@
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import { useClient } from 'urql';
|
||||
import {
|
||||
Box,
|
||||
Button,
|
||||
Center,
|
||||
Flex,
|
||||
IconButton,
|
||||
Menu,
|
||||
MenuButton,
|
||||
MenuList,
|
||||
NumberDecrementStepper,
|
||||
NumberIncrementStepper,
|
||||
NumberInput,
|
||||
NumberInputField,
|
||||
NumberInputStepper,
|
||||
Select,
|
||||
Spinner,
|
||||
Table,
|
||||
TableCaption,
|
||||
Tbody,
|
||||
Td,
|
||||
Text,
|
||||
Th,
|
||||
Thead,
|
||||
Tooltip,
|
||||
Tr,
|
||||
} from '@chakra-ui/react';
|
||||
import {
|
||||
FaAngleDoubleLeft,
|
||||
FaAngleDoubleRight,
|
||||
FaAngleDown,
|
||||
FaAngleLeft,
|
||||
FaAngleRight,
|
||||
FaExclamationCircle,
|
||||
} from 'react-icons/fa';
|
||||
import UpdateEmailTemplateModal from '../components/UpdateEmailTemplateModal';
|
||||
import {
|
||||
pageLimits,
|
||||
UpdateModalViews,
|
||||
EmailTemplateInputDataFields,
|
||||
} from '../constants';
|
||||
import { EmailTemplatesQuery } from '../graphql/queries';
|
||||
import dayjs from 'dayjs';
|
||||
import DeleteEmailTemplateModal from '../components/DeleteEmailTemplateModal';
|
||||
|
||||
interface paginationPropTypes {
|
||||
limit: number;
|
||||
page: number;
|
||||
offset: number;
|
||||
total: number;
|
||||
maxPages: number;
|
||||
}
|
||||
|
||||
interface EmailTemplateDataType {
|
||||
[EmailTemplateInputDataFields.ID]: string;
|
||||
[EmailTemplateInputDataFields.EVENT_NAME]: string;
|
||||
[EmailTemplateInputDataFields.SUBJECT]: string;
|
||||
[EmailTemplateInputDataFields.CREATED_AT]: number;
|
||||
[EmailTemplateInputDataFields.TEMPLATE]: string;
|
||||
[EmailTemplateInputDataFields.DESIGN]: string;
|
||||
}
|
||||
|
||||
const EmailTemplates = () => {
|
||||
const client = useClient();
|
||||
const [loading, setLoading] = useState<boolean>(false);
|
||||
const [emailTemplatesData, setEmailTemplatesData] = useState<
|
||||
EmailTemplateDataType[]
|
||||
>([]);
|
||||
const [paginationProps, setPaginationProps] = useState<paginationPropTypes>({
|
||||
limit: 5,
|
||||
page: 1,
|
||||
offset: 0,
|
||||
total: 0,
|
||||
maxPages: 1,
|
||||
});
|
||||
const getMaxPages = (pagination: paginationPropTypes) => {
|
||||
const { limit, total } = pagination;
|
||||
if (total > 1) {
|
||||
return total % limit === 0
|
||||
? total / limit
|
||||
: parseInt(`${total / limit}`) + 1;
|
||||
} else return 1;
|
||||
};
|
||||
const fetchEmailTemplatesData = async () => {
|
||||
setLoading(true);
|
||||
const res = await client
|
||||
.query(EmailTemplatesQuery, {
|
||||
params: {
|
||||
pagination: {
|
||||
limit: paginationProps.limit,
|
||||
page: paginationProps.page,
|
||||
},
|
||||
},
|
||||
})
|
||||
.toPromise();
|
||||
if (res.data?._email_templates) {
|
||||
const { pagination, email_templates: emailTemplates } =
|
||||
res.data?._email_templates;
|
||||
const maxPages = getMaxPages(pagination);
|
||||
if (emailTemplates?.length) {
|
||||
setEmailTemplatesData(emailTemplates);
|
||||
setPaginationProps({ ...paginationProps, ...pagination, maxPages });
|
||||
} else {
|
||||
if (paginationProps.page !== 1) {
|
||||
setPaginationProps({
|
||||
...paginationProps,
|
||||
...pagination,
|
||||
maxPages,
|
||||
page: 1,
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
setLoading(false);
|
||||
};
|
||||
const paginationHandler = (value: Record<string, number>) => {
|
||||
setPaginationProps({ ...paginationProps, ...value });
|
||||
};
|
||||
useEffect(() => {
|
||||
fetchEmailTemplatesData();
|
||||
}, [paginationProps.page, paginationProps.limit]);
|
||||
return (
|
||||
<Box m="5" py="5" px="10" bg="white" rounded="md">
|
||||
<Flex margin="2% 0" justifyContent="space-between" alignItems="center">
|
||||
<Text fontSize="md" fontWeight="bold">
|
||||
Email Templates
|
||||
</Text>
|
||||
<UpdateEmailTemplateModal
|
||||
view={UpdateModalViews.ADD}
|
||||
fetchEmailTemplatesData={fetchEmailTemplatesData}
|
||||
/>
|
||||
</Flex>
|
||||
{!loading ? (
|
||||
emailTemplatesData.length ? (
|
||||
<Table variant="simple">
|
||||
<Thead>
|
||||
<Tr>
|
||||
<Th>Event Name</Th>
|
||||
<Th>Subject</Th>
|
||||
<Th>Created At</Th>
|
||||
<Th>Actions</Th>
|
||||
</Tr>
|
||||
</Thead>
|
||||
<Tbody>
|
||||
{emailTemplatesData.map((templateData: EmailTemplateDataType) => (
|
||||
<Tr
|
||||
key={templateData[EmailTemplateInputDataFields.ID]}
|
||||
style={{ fontSize: 14 }}
|
||||
>
|
||||
<Td maxW="300">
|
||||
{templateData[EmailTemplateInputDataFields.EVENT_NAME]}
|
||||
</Td>
|
||||
<Td>{templateData[EmailTemplateInputDataFields.SUBJECT]}</Td>
|
||||
<Td>
|
||||
{dayjs(templateData.created_at * 1000).format(
|
||||
'MMM DD, YYYY'
|
||||
)}
|
||||
</Td>
|
||||
<Td>
|
||||
<Menu>
|
||||
<MenuButton as={Button} variant="unstyled" size="sm">
|
||||
<Flex
|
||||
justifyContent="space-between"
|
||||
alignItems="center"
|
||||
>
|
||||
<Text fontSize="sm" fontWeight="light">
|
||||
Menu
|
||||
</Text>
|
||||
<FaAngleDown style={{ marginLeft: 10 }} />
|
||||
</Flex>
|
||||
</MenuButton>
|
||||
<MenuList>
|
||||
<UpdateEmailTemplateModal
|
||||
view={UpdateModalViews.Edit}
|
||||
selectedTemplate={templateData}
|
||||
fetchEmailTemplatesData={fetchEmailTemplatesData}
|
||||
/>
|
||||
<DeleteEmailTemplateModal
|
||||
emailTemplateId={
|
||||
templateData[EmailTemplateInputDataFields.ID]
|
||||
}
|
||||
eventName={
|
||||
templateData[
|
||||
EmailTemplateInputDataFields.EVENT_NAME
|
||||
]
|
||||
}
|
||||
fetchEmailTemplatesData={fetchEmailTemplatesData}
|
||||
/>
|
||||
</MenuList>
|
||||
</Menu>
|
||||
</Td>
|
||||
</Tr>
|
||||
))}
|
||||
</Tbody>
|
||||
{(paginationProps.maxPages > 1 || paginationProps.total >= 5) && (
|
||||
<TableCaption>
|
||||
<Flex
|
||||
justifyContent="space-between"
|
||||
alignItems="center"
|
||||
m="2% 0"
|
||||
>
|
||||
<Flex flex="1">
|
||||
<Tooltip label="First Page">
|
||||
<IconButton
|
||||
aria-label="icon button"
|
||||
onClick={() =>
|
||||
paginationHandler({
|
||||
page: 1,
|
||||
})
|
||||
}
|
||||
isDisabled={paginationProps.page <= 1}
|
||||
mr={4}
|
||||
icon={<FaAngleDoubleLeft />}
|
||||
/>
|
||||
</Tooltip>
|
||||
<Tooltip label="Previous Page">
|
||||
<IconButton
|
||||
aria-label="icon button"
|
||||
onClick={() =>
|
||||
paginationHandler({
|
||||
page: paginationProps.page - 1,
|
||||
})
|
||||
}
|
||||
isDisabled={paginationProps.page <= 1}
|
||||
icon={<FaAngleLeft />}
|
||||
/>
|
||||
</Tooltip>
|
||||
</Flex>
|
||||
<Flex
|
||||
flex="8"
|
||||
justifyContent="space-evenly"
|
||||
alignItems="center"
|
||||
>
|
||||
<Text mr={8}>
|
||||
Page{' '}
|
||||
<Text fontWeight="bold" as="span">
|
||||
{paginationProps.page}
|
||||
</Text>{' '}
|
||||
of{' '}
|
||||
<Text fontWeight="bold" as="span">
|
||||
{paginationProps.maxPages}
|
||||
</Text>
|
||||
</Text>
|
||||
<Flex alignItems="center">
|
||||
<Text flexShrink="0">Go to page:</Text>{' '}
|
||||
<NumberInput
|
||||
ml={2}
|
||||
mr={8}
|
||||
w={28}
|
||||
min={1}
|
||||
max={paginationProps.maxPages}
|
||||
onChange={(value) =>
|
||||
paginationHandler({
|
||||
page: parseInt(value),
|
||||
})
|
||||
}
|
||||
value={paginationProps.page}
|
||||
>
|
||||
<NumberInputField />
|
||||
<NumberInputStepper>
|
||||
<NumberIncrementStepper />
|
||||
<NumberDecrementStepper />
|
||||
</NumberInputStepper>
|
||||
</NumberInput>
|
||||
</Flex>
|
||||
<Select
|
||||
w={32}
|
||||
value={paginationProps.limit}
|
||||
onChange={(e) =>
|
||||
paginationHandler({
|
||||
page: 1,
|
||||
limit: parseInt(e.target.value),
|
||||
})
|
||||
}
|
||||
>
|
||||
{pageLimits.map((pageSize) => (
|
||||
<option key={pageSize} value={pageSize}>
|
||||
Show {pageSize}
|
||||
</option>
|
||||
))}
|
||||
</Select>
|
||||
</Flex>
|
||||
<Flex flex="1">
|
||||
<Tooltip label="Next Page">
|
||||
<IconButton
|
||||
aria-label="icon button"
|
||||
onClick={() =>
|
||||
paginationHandler({
|
||||
page: paginationProps.page + 1,
|
||||
})
|
||||
}
|
||||
isDisabled={
|
||||
paginationProps.page >= paginationProps.maxPages
|
||||
}
|
||||
icon={<FaAngleRight />}
|
||||
/>
|
||||
</Tooltip>
|
||||
<Tooltip label="Last Page">
|
||||
<IconButton
|
||||
aria-label="icon button"
|
||||
onClick={() =>
|
||||
paginationHandler({
|
||||
page: paginationProps.maxPages,
|
||||
})
|
||||
}
|
||||
isDisabled={
|
||||
paginationProps.page >= paginationProps.maxPages
|
||||
}
|
||||
ml={4}
|
||||
icon={<FaAngleDoubleRight />}
|
||||
/>
|
||||
</Tooltip>
|
||||
</Flex>
|
||||
</Flex>
|
||||
</TableCaption>
|
||||
)}
|
||||
</Table>
|
||||
) : (
|
||||
<Flex
|
||||
flexDirection="column"
|
||||
minH="25vh"
|
||||
justifyContent="center"
|
||||
alignItems="center"
|
||||
>
|
||||
<Center w="50px" marginRight="1.5%">
|
||||
<FaExclamationCircle style={{ color: '#f0f0f0', fontSize: 70 }} />
|
||||
</Center>
|
||||
<Text
|
||||
fontSize="2xl"
|
||||
paddingRight="1%"
|
||||
fontWeight="bold"
|
||||
color="#d9d9d9"
|
||||
>
|
||||
No Data
|
||||
</Text>
|
||||
</Flex>
|
||||
)
|
||||
) : (
|
||||
<Center minH="25vh">
|
||||
<Spinner />
|
||||
</Center>
|
||||
)}
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
|
||||
export default EmailTemplates;
|
||||
@@ -80,6 +80,8 @@ const Environment = () => {
|
||||
DATABASE_TYPE: '',
|
||||
DATABASE_URL: '',
|
||||
ACCESS_TOKEN_EXPIRY_TIME: '',
|
||||
DISABLE_MULTI_FACTOR_AUTHENTICATION: false,
|
||||
ENFORCE_MULTI_FACTOR_AUTHENTICATION: false,
|
||||
});
|
||||
|
||||
const [fieldVisibility, setFieldVisibility] = React.useState<
|
||||
|
||||
@@ -8,7 +8,6 @@ import {
|
||||
IconButton,
|
||||
Menu,
|
||||
MenuButton,
|
||||
MenuItem,
|
||||
MenuList,
|
||||
NumberDecrementStepper,
|
||||
NumberIncrementStepper,
|
||||
@@ -40,7 +39,7 @@ import UpdateWebhookModal from '../components/UpdateWebhookModal';
|
||||
import {
|
||||
pageLimits,
|
||||
WebhookInputDataFields,
|
||||
UpdateWebhookModalViews,
|
||||
UpdateModalViews,
|
||||
} from '../constants';
|
||||
import { WebhooksDataQuery } from '../graphql/queries';
|
||||
import DeleteWebhookModal from '../components/DeleteWebhookModal';
|
||||
@@ -125,7 +124,7 @@ const Webhooks = () => {
|
||||
Webhooks
|
||||
</Text>
|
||||
<UpdateWebhookModal
|
||||
view={UpdateWebhookModalViews.ADD}
|
||||
view={UpdateModalViews.ADD}
|
||||
fetchWebookData={fetchWebookData}
|
||||
/>
|
||||
</Flex>
|
||||
@@ -196,7 +195,7 @@ const Webhooks = () => {
|
||||
</MenuButton>
|
||||
<MenuList>
|
||||
<UpdateWebhookModal
|
||||
view={UpdateWebhookModalViews.Edit}
|
||||
view={UpdateModalViews.Edit}
|
||||
selectedWebhook={webhook}
|
||||
fetchWebookData={fetchWebookData}
|
||||
/>
|
||||
|
||||
@@ -3,6 +3,7 @@ import { Outlet, Route, Routes } from 'react-router-dom';
|
||||
|
||||
import { useAuthContext } from '../contexts/AuthContext';
|
||||
import { DashboardLayout } from '../layouts/DashboardLayout';
|
||||
import EmailTemplates from '../pages/EmailTemplates';
|
||||
|
||||
const Auth = lazy(() => import('../pages/Auth'));
|
||||
const Environment = lazy(() => import('../pages/Environment'));
|
||||
@@ -31,6 +32,7 @@ export const AppRoutes = () => {
|
||||
</Route>
|
||||
<Route path="users" element={<Users />} />
|
||||
<Route path="webhooks" element={<Webhooks />} />
|
||||
<Route path="email-templates" element={<EmailTemplates />} />
|
||||
<Route path="*" element={<Home />} />
|
||||
</Route>
|
||||
</Routes>
|
||||
|
||||
@@ -9,4 +9,8 @@ const (
|
||||
VerificationTypeUpdateEmail = "update_email"
|
||||
// VerificationTypeForgotPassword is the forgot_password verification type
|
||||
VerificationTypeForgotPassword = "forgot_password"
|
||||
// VerificationTypeInviteMember is the invite_member verification type
|
||||
VerificationTypeInviteMember = "invite_member"
|
||||
// VerificationTypeOTP is the otp verification type
|
||||
VerificationTypeOTP = "otp"
|
||||
)
|
||||
|
||||
@@ -12,7 +12,9 @@ type EmailTemplate struct {
|
||||
Key string `json:"_key,omitempty" bson:"_key,omitempty" cql:"_key,omitempty"` // for arangodb
|
||||
ID string `gorm:"primaryKey;type:char(36)" json:"_id" bson:"_id" cql:"id"`
|
||||
EventName string `gorm:"unique" json:"event_name" bson:"event_name" cql:"event_name"`
|
||||
Subject string `gorm:"type:text" json:"subject" bson:"subject" cql:"subject"`
|
||||
Template string `gorm:"type:text" json:"template" bson:"template" cql:"template"`
|
||||
Design string `gorm:"type:text" json:"design" bson:"design" cql:"design"`
|
||||
CreatedAt int64 `json:"created_at" bson:"created_at" cql:"created_at"`
|
||||
UpdatedAt int64 `json:"updated_at" bson:"updated_at" cql:"updated_at"`
|
||||
}
|
||||
@@ -26,7 +28,9 @@ func (e *EmailTemplate) AsAPIEmailTemplate() *model.EmailTemplate {
|
||||
return &model.EmailTemplate{
|
||||
ID: id,
|
||||
EventName: e.EventName,
|
||||
Subject: e.Subject,
|
||||
Template: e.Template,
|
||||
Design: e.Design,
|
||||
CreatedAt: refs.NewInt64Ref(e.CreatedAt),
|
||||
UpdatedAt: refs.NewInt64Ref(e.UpdatedAt),
|
||||
}
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
package models
|
||||
|
||||
import (
|
||||
"encoding/json"
|
||||
"strings"
|
||||
|
||||
"github.com/authorizerdev/authorizer/server/graph/model"
|
||||
@@ -64,3 +65,10 @@ func (user *User) AsAPIUser() *model.User {
|
||||
UpdatedAt: refs.NewInt64Ref(user.UpdatedAt),
|
||||
}
|
||||
}
|
||||
|
||||
func (user *User) ToMap() map[string]interface{} {
|
||||
res := map[string]interface{}{}
|
||||
data, _ := json.Marshal(user) // Convert to a json string
|
||||
json.Unmarshal(data, &res) // Convert to a map
|
||||
return res
|
||||
}
|
||||
|
||||
@@ -29,7 +29,7 @@ func (p *provider) AddEmailTemplate(ctx context.Context, emailTemplate models.Em
|
||||
return nil, fmt.Errorf("Email template with %s event_name already exists", emailTemplate.EventName)
|
||||
}
|
||||
|
||||
insertQuery := fmt.Sprintf("INSERT INTO %s (id, event_name, template, created_at, updated_at) VALUES ('%s', '%s', '%s', %d, %d)", KeySpace+"."+models.Collections.EmailTemplate, emailTemplate.ID, emailTemplate.EventName, emailTemplate.Template, emailTemplate.CreatedAt, emailTemplate.UpdatedAt)
|
||||
insertQuery := fmt.Sprintf("INSERT INTO %s (id, event_name, subject, template, created_at, updated_at) VALUES ('%s', '%s', '%s','%s', %d, %d)", KeySpace+"."+models.Collections.EmailTemplate, emailTemplate.ID, emailTemplate.EventName, emailTemplate.Subject, emailTemplate.Template, emailTemplate.CreatedAt, emailTemplate.UpdatedAt)
|
||||
err := p.db.Query(insertQuery).Exec()
|
||||
if err != nil {
|
||||
return nil, err
|
||||
@@ -103,14 +103,14 @@ func (p *provider) ListEmailTemplate(ctx context.Context, pagination model.Pagin
|
||||
// there is no offset in cassandra
|
||||
// so we fetch till limit + offset
|
||||
// and return the results from offset to limit
|
||||
query := fmt.Sprintf("SELECT id, event_name, template, created_at, updated_at FROM %s LIMIT %d", KeySpace+"."+models.Collections.EmailTemplate, pagination.Limit+pagination.Offset)
|
||||
query := fmt.Sprintf("SELECT id, event_name, subject, template, created_at, updated_at FROM %s LIMIT %d", KeySpace+"."+models.Collections.EmailTemplate, pagination.Limit+pagination.Offset)
|
||||
|
||||
scanner := p.db.Query(query).Iter().Scanner()
|
||||
counter := int64(0)
|
||||
for scanner.Next() {
|
||||
if counter >= pagination.Offset {
|
||||
var emailTemplate models.EmailTemplate
|
||||
err := scanner.Scan(&emailTemplate.ID, &emailTemplate.EventName, &emailTemplate.Template, &emailTemplate.CreatedAt, &emailTemplate.UpdatedAt)
|
||||
err := scanner.Scan(&emailTemplate.ID, &emailTemplate.EventName, &emailTemplate.Subject, &emailTemplate.Template, &emailTemplate.CreatedAt, &emailTemplate.UpdatedAt)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
@@ -128,8 +128,8 @@ func (p *provider) ListEmailTemplate(ctx context.Context, pagination model.Pagin
|
||||
// GetEmailTemplateByID to get EmailTemplate by id
|
||||
func (p *provider) GetEmailTemplateByID(ctx context.Context, emailTemplateID string) (*model.EmailTemplate, error) {
|
||||
var emailTemplate models.EmailTemplate
|
||||
query := fmt.Sprintf(`SELECT id, event_name, template, created_at, updated_at FROM %s WHERE id = '%s' LIMIT 1`, KeySpace+"."+models.Collections.EmailTemplate, emailTemplateID)
|
||||
err := p.db.Query(query).Consistency(gocql.One).Scan(&emailTemplate.ID, &emailTemplate.EventName, &emailTemplate.Template, &emailTemplate.CreatedAt, &emailTemplate.UpdatedAt)
|
||||
query := fmt.Sprintf(`SELECT id, event_name, subject, template, created_at, updated_at FROM %s WHERE id = '%s' LIMIT 1`, KeySpace+"."+models.Collections.EmailTemplate, emailTemplateID)
|
||||
err := p.db.Query(query).Consistency(gocql.One).Scan(&emailTemplate.ID, &emailTemplate.EventName, &emailTemplate.Subject, &emailTemplate.Template, &emailTemplate.CreatedAt, &emailTemplate.UpdatedAt)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
@@ -139,8 +139,8 @@ func (p *provider) GetEmailTemplateByID(ctx context.Context, emailTemplateID str
|
||||
// GetEmailTemplateByEventName to get EmailTemplate by event_name
|
||||
func (p *provider) GetEmailTemplateByEventName(ctx context.Context, eventName string) (*model.EmailTemplate, error) {
|
||||
var emailTemplate models.EmailTemplate
|
||||
query := fmt.Sprintf(`SELECT id, event_name, template, created_at, updated_at FROM %s WHERE event_name = '%s' LIMIT 1 ALLOW FILTERING`, KeySpace+"."+models.Collections.EmailTemplate, eventName)
|
||||
err := p.db.Query(query).Consistency(gocql.One).Scan(&emailTemplate.ID, &emailTemplate.EventName, &emailTemplate.Template, &emailTemplate.CreatedAt, &emailTemplate.UpdatedAt)
|
||||
query := fmt.Sprintf(`SELECT id, event_name, subject, template, created_at, updated_at FROM %s WHERE event_name = '%s' LIMIT 1 ALLOW FILTERING`, KeySpace+"."+models.Collections.EmailTemplate, eventName)
|
||||
err := p.db.Query(query).Consistency(gocql.One).Scan(&emailTemplate.ID, &emailTemplate.EventName, &emailTemplate.Subject, &emailTemplate.Template, &emailTemplate.CreatedAt, &emailTemplate.UpdatedAt)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
|
||||
@@ -223,6 +223,12 @@ func NewProvider() (*provider, error) {
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
// add subject on email_templates table
|
||||
emailTemplateAlterQuery := fmt.Sprintf(`ALTER TABLE %s.%s ADD subject text;`, KeySpace, models.Collections.EmailTemplate)
|
||||
err = session.Query(emailTemplateAlterQuery).Exec()
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
|
||||
otpCollection := fmt.Sprintf("CREATE TABLE IF NOT EXISTS %s.%s (id text, email text, otp text, expires_at bigint, updated_at bigint, created_at bigint, PRIMARY KEY (id))", KeySpace, models.Collections.OTP)
|
||||
err = session.Query(otpCollection).Exec()
|
||||
|
||||
@@ -2,8 +2,8 @@ package email
|
||||
|
||||
import (
|
||||
"bytes"
|
||||
"context"
|
||||
"crypto/tls"
|
||||
"encoding/json"
|
||||
"strconv"
|
||||
"text/template"
|
||||
|
||||
@@ -11,27 +11,75 @@ import (
|
||||
gomail "gopkg.in/mail.v2"
|
||||
|
||||
"github.com/authorizerdev/authorizer/server/constants"
|
||||
"github.com/authorizerdev/authorizer/server/db"
|
||||
"github.com/authorizerdev/authorizer/server/graph/model"
|
||||
"github.com/authorizerdev/authorizer/server/memorystore"
|
||||
)
|
||||
|
||||
// addEmailTemplate is used to add html template in email body
|
||||
func addEmailTemplate(a string, b map[string]interface{}, templateName string) string {
|
||||
tmpl, err := template.New(templateName).Parse(a)
|
||||
if err != nil {
|
||||
output, _ := json.Marshal(b)
|
||||
return string(output)
|
||||
func getDefaultTemplate(event string) *model.EmailTemplate {
|
||||
switch event {
|
||||
case constants.VerificationTypeBasicAuthSignup, constants.VerificationTypeMagicLinkLogin:
|
||||
return &model.EmailTemplate{
|
||||
Subject: emailVerificationSubject,
|
||||
Template: emailVerificationTemplate,
|
||||
}
|
||||
case constants.VerificationTypeForgotPassword:
|
||||
return &model.EmailTemplate{
|
||||
Subject: forgotPasswordSubject,
|
||||
Template: forgotPasswordTemplate,
|
||||
}
|
||||
case constants.VerificationTypeInviteMember:
|
||||
return &model.EmailTemplate{
|
||||
Subject: inviteEmailSubject,
|
||||
Template: inviteEmailTemplate,
|
||||
}
|
||||
case constants.VerificationTypeOTP:
|
||||
return &model.EmailTemplate{
|
||||
Subject: otpEmailSubject,
|
||||
Template: otpEmailTemplate,
|
||||
}
|
||||
default:
|
||||
return nil
|
||||
}
|
||||
buf := &bytes.Buffer{}
|
||||
err = tmpl.Execute(buf, b)
|
||||
if err != nil {
|
||||
panic(err)
|
||||
}
|
||||
s := buf.String()
|
||||
return s
|
||||
}
|
||||
|
||||
// SendMail function to send mail
|
||||
func SendMail(to []string, Subject, bodyMessage string) error {
|
||||
func getEmailTemplate(event string, data map[string]interface{}) (*model.EmailTemplate, error) {
|
||||
ctx := context.Background()
|
||||
tmp, err := db.Provider.GetEmailTemplateByEventName(ctx, event)
|
||||
if err != nil || tmp == nil {
|
||||
tmp = getDefaultTemplate(event)
|
||||
}
|
||||
|
||||
templ, err := template.New(event + "_template.tmpl").Parse(tmp.Template)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
buf := &bytes.Buffer{}
|
||||
err = templ.Execute(buf, data)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
templateString := buf.String()
|
||||
|
||||
subject, err := template.New(event + "_subject.tmpl").Parse(tmp.Subject)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
buf = &bytes.Buffer{}
|
||||
err = subject.Execute(buf, data)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
}
|
||||
subjectString := buf.String()
|
||||
|
||||
return &model.EmailTemplate{
|
||||
Template: templateString,
|
||||
Subject: subjectString,
|
||||
}, nil
|
||||
}
|
||||
|
||||
// SendEmail function to send mail
|
||||
func SendEmail(to []string, event string, data map[string]interface{}) error {
|
||||
// dont trigger email sending in case of test
|
||||
envKey, err := memorystore.Provider.GetStringStoreEnvVariable(constants.EnvKeyEnv)
|
||||
if err != nil {
|
||||
@@ -40,6 +88,13 @@ func SendMail(to []string, Subject, bodyMessage string) error {
|
||||
if envKey == constants.TestEnv {
|
||||
return nil
|
||||
}
|
||||
|
||||
tmp, err := getEmailTemplate(event, data)
|
||||
if err != nil {
|
||||
log.Errorf("Failed to get event template: ", err)
|
||||
return err
|
||||
}
|
||||
|
||||
m := gomail.NewMessage()
|
||||
senderEmail, err := memorystore.Provider.GetStringStoreEnvVariable(constants.EnvKeySenderEmail)
|
||||
if err != nil {
|
||||
@@ -79,8 +134,8 @@ func SendMail(to []string, Subject, bodyMessage string) error {
|
||||
|
||||
m.SetHeader("From", senderEmail)
|
||||
m.SetHeader("To", to...)
|
||||
m.SetHeader("Subject", Subject)
|
||||
m.SetBody("text/html", bodyMessage)
|
||||
m.SetHeader("Subject", tmp.Subject)
|
||||
m.SetBody("text/html", tmp.Template)
|
||||
port, _ := strconv.Atoi(smtpPort)
|
||||
d := gomail.NewDialer(smtpHost, port, smtpUsername, smtpPassword)
|
||||
if !isProd {
|
||||
|
||||
@@ -1,19 +1,8 @@
|
||||
package email
|
||||
|
||||
import (
|
||||
log "github.com/sirupsen/logrus"
|
||||
|
||||
"github.com/authorizerdev/authorizer/server/constants"
|
||||
"github.com/authorizerdev/authorizer/server/memorystore"
|
||||
)
|
||||
|
||||
// SendVerificationMail to send verification email
|
||||
func SendVerificationMail(toEmail, token, hostname string) error {
|
||||
// The receiver needs to be in slice as the receive supports multiple receiver
|
||||
Receiver := []string{toEmail}
|
||||
|
||||
Subject := "Please verify your email"
|
||||
message := `
|
||||
const (
|
||||
emailVerificationSubject = "Please verify your email"
|
||||
emailVerificationTemplate = `
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:o="urn:schemas-microsoft-com:office:office">
|
||||
<head>
|
||||
@@ -98,23 +87,4 @@ func SendVerificationMail(toEmail, token, hostname string) error {
|
||||
</body>
|
||||
</html>
|
||||
`
|
||||
data := make(map[string]interface{}, 3)
|
||||
var err error
|
||||
data["org_logo"], err = memorystore.Provider.GetStringStoreEnvVariable(constants.EnvKeyOrganizationLogo)
|
||||
if err != nil {
|
||||
return err
|
||||
}
|
||||
data["org_name"], err = memorystore.Provider.GetStringStoreEnvVariable(constants.EnvKeyOrganizationName)
|
||||
if err != nil {
|
||||
return err
|
||||
}
|
||||
data["verification_url"] = hostname + "/verify_email?token=" + token
|
||||
message = addEmailTemplate(message, data, "verify_email.tmpl")
|
||||
// bodyMessage := sender.WriteHTMLEmail(Receiver, Subject, message)
|
||||
|
||||
err = SendMail(Receiver, Subject, message)
|
||||
if err != nil {
|
||||
log.Warn("error sending email: ", err)
|
||||
}
|
||||
return err
|
||||
}
|
||||
)
|
||||
@@ -1,28 +1,8 @@
|
||||
package email
|
||||
|
||||
import (
|
||||
"github.com/authorizerdev/authorizer/server/constants"
|
||||
"github.com/authorizerdev/authorizer/server/memorystore"
|
||||
)
|
||||
|
||||
// SendForgotPasswordMail to send forgot password email
|
||||
func SendForgotPasswordMail(toEmail, token, hostname string) error {
|
||||
resetPasswordUrl, err := memorystore.Provider.GetStringStoreEnvVariable(constants.EnvKeyResetPasswordURL)
|
||||
if err != nil {
|
||||
return err
|
||||
}
|
||||
if resetPasswordUrl == "" {
|
||||
if err := memorystore.Provider.UpdateEnvVariable(constants.EnvKeyResetPasswordURL, hostname+"/app/reset-password"); err != nil {
|
||||
return err
|
||||
}
|
||||
}
|
||||
|
||||
// The receiver needs to be in slice as the receive supports multiple receiver
|
||||
Receiver := []string{toEmail}
|
||||
|
||||
Subject := "Reset Password"
|
||||
|
||||
message := `
|
||||
const (
|
||||
forgotPasswordSubject = "Reset Password"
|
||||
forgotPasswordTemplate = `
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:o="urn:schemas-microsoft-com:office:office">
|
||||
<head>
|
||||
@@ -73,13 +53,13 @@ func SendForgotPasswordMail(toEmail, token, hostname string) error {
|
||||
<table width="100%%" cellspacing="0" cellpadding="0">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="esd-block-image es-m-txt-c es-p5b" style="font-size:0;padding:10px" align="center"><a target="_blank" clicktracking="off"><img src="{{.org_logo}}" alt="icon" style="display: block;" title="icon" width="30"></a></td>
|
||||
<td class="esd-block-image es-m-txt-c es-p5b" style="font-size:0;padding:10px" align="center"><a target="_blank" clicktracking="off"><img src="{{.organization.logo}}" alt="icon" style="display: block;" title="icon" width="30"></a></td>
|
||||
</tr>
|
||||
|
||||
<tr style="background: rgb(249,250,251);padding: 10px;margin-bottom:10px;border-radius:5px;">
|
||||
<td class="esd-block-text es-m-txt-c es-p15t" align="center" style="padding:10px;padding-bottom:30px;">
|
||||
<p>Hey there 👋</p>
|
||||
<p>We have received a request to reset password for email: <b>{{.org_name}}</b>. If this is correct, please reset the password clicking the button below.</p> <br/>
|
||||
<p>We have received a request to reset password for email: <b>{{.organization.name}}</b>. If this is correct, please reset the password clicking the button below.</p> <br/>
|
||||
<a clicktracking="off" href="{{.verification_url}}" class="es-button" target="_blank" style="text-decoration: none;padding:10px 15px;background-color: rgba(59,130,246,1);color: #fff;font-size: 1em;border-radius:5px;">Reset Password</a>
|
||||
</td>
|
||||
</tr>
|
||||
@@ -106,18 +86,4 @@ func SendForgotPasswordMail(toEmail, token, hostname string) error {
|
||||
</body>
|
||||
</html>
|
||||
`
|
||||
|
||||
data := make(map[string]interface{}, 3)
|
||||
data["org_logo"], err = memorystore.Provider.GetStringStoreEnvVariable(constants.EnvKeyOrganizationLogo)
|
||||
if err != nil {
|
||||
return err
|
||||
}
|
||||
data["org_name"], err = memorystore.Provider.GetStringStoreEnvVariable(constants.EnvKeyOrganizationName)
|
||||
if err != nil {
|
||||
return err
|
||||
}
|
||||
data["verification_url"] = resetPasswordUrl + "?token=" + token
|
||||
message = addEmailTemplate(message, data, "reset_password_email.tmpl")
|
||||
|
||||
return SendMail(Receiver, Subject, message)
|
||||
}
|
||||
)
|
||||
|
||||
@@ -1,19 +1,8 @@
|
||||
package email
|
||||
|
||||
import (
|
||||
log "github.com/sirupsen/logrus"
|
||||
|
||||
"github.com/authorizerdev/authorizer/server/constants"
|
||||
"github.com/authorizerdev/authorizer/server/memorystore"
|
||||
)
|
||||
|
||||
// InviteEmail to send invite email
|
||||
func InviteEmail(toEmail, token, verificationURL, redirectURI string) error {
|
||||
// The receiver needs to be in slice as the receive supports multiple receiver
|
||||
Receiver := []string{toEmail}
|
||||
|
||||
Subject := "Please accept the invitation"
|
||||
message := `
|
||||
const (
|
||||
inviteEmailSubject = "Please accept the invitation"
|
||||
inviteEmailTemplate = `
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:o="urn:schemas-microsoft-com:office:office">
|
||||
<head>
|
||||
@@ -64,13 +53,13 @@ func InviteEmail(toEmail, token, verificationURL, redirectURI string) error {
|
||||
<table width="100%%" cellspacing="0" cellpadding="0">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="esd-block-image es-m-txt-c es-p5b" style="font-size:0;padding:10px" align="center"><a target="_blank" clicktracking="off"><img src="{{.org_logo}}" alt="icon" style="display: block;" title="icon" width="30"></a></td>
|
||||
<td class="esd-block-image es-m-txt-c es-p5b" style="font-size:0;padding:10px" align="center"><a target="_blank" clicktracking="off"><img src="{{.organization.logo}}" alt="icon" style="display: block;" title="icon" width="30"></a></td>
|
||||
</tr>
|
||||
|
||||
<tr style="background: rgb(249,250,251);padding: 10px;margin-bottom:10px;border-radius:5px;">
|
||||
<td class="esd-block-text es-m-txt-c es-p15t" align="center" style="padding:10px;padding-bottom:30px;">
|
||||
<p>Hi there 👋</p>
|
||||
<p>Join us! You are invited to sign-up for <b>{{.org_name}}</b>. Please accept the invitation by clicking the button below.</p> <br/>
|
||||
<p>Join us! You are invited to sign-up for <b>{{.organization.name}}</b>. Please accept the invitation by clicking the button below.</p> <br/>
|
||||
<a
|
||||
clicktracking="off" href="{{.verification_url}}" class="es-button" target="_blank" style="text-decoration: none;padding:10px 15px;background-color: rgba(59,130,246,1);color: #fff;font-size: 1em;border-radius:5px;">Get Started</a>
|
||||
</td>
|
||||
@@ -98,23 +87,4 @@ func InviteEmail(toEmail, token, verificationURL, redirectURI string) error {
|
||||
</body>
|
||||
</html>
|
||||
`
|
||||
data := make(map[string]interface{}, 3)
|
||||
var err error
|
||||
data["org_logo"], err = memorystore.Provider.GetStringStoreEnvVariable(constants.EnvKeyOrganizationLogo)
|
||||
if err != nil {
|
||||
return err
|
||||
}
|
||||
data["org_name"], err = memorystore.Provider.GetStringStoreEnvVariable(constants.EnvKeyOrganizationName)
|
||||
if err != nil {
|
||||
return err
|
||||
}
|
||||
data["verification_url"] = verificationURL + "?token=" + token + "&redirect_uri=" + redirectURI
|
||||
message = addEmailTemplate(message, data, "invite_email.tmpl")
|
||||
// bodyMessage := sender.WriteHTMLEmail(Receiver, Subject, message)
|
||||
|
||||
err = SendMail(Receiver, Subject, message)
|
||||
if err != nil {
|
||||
log.Warn("error sending email: ", err)
|
||||
}
|
||||
return err
|
||||
}
|
||||
)
|
||||
|
||||
@@ -1,19 +1,8 @@
|
||||
package email
|
||||
|
||||
import (
|
||||
log "github.com/sirupsen/logrus"
|
||||
|
||||
"github.com/authorizerdev/authorizer/server/constants"
|
||||
"github.com/authorizerdev/authorizer/server/memorystore"
|
||||
)
|
||||
|
||||
// SendOtpMail to send otp email
|
||||
func SendOtpMail(toEmail, otp string) error {
|
||||
// The receiver needs to be in slice as the receive supports multiple receiver
|
||||
Receiver := []string{toEmail}
|
||||
|
||||
Subject := "OTP for your multi factor authentication"
|
||||
message := `
|
||||
const (
|
||||
otpEmailSubject = "OTP for your multi factor authentication"
|
||||
otpEmailTemplate = `
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:o="urn:schemas-microsoft-com:office:office">
|
||||
<head>
|
||||
@@ -64,13 +53,13 @@ func SendOtpMail(toEmail, otp string) error {
|
||||
<table width="100%%" cellspacing="0" cellpadding="0">
|
||||
<tbody>
|
||||
<tr>
|
||||
<td class="esd-block-image es-m-txt-c es-p5b" style="font-size:0;padding:10px" align="center"><a target="_blank" clicktracking="off"><img src="{{.org_logo}}" alt="icon" style="display: block;" title="icon" width="30"></a></td>
|
||||
<td class="esd-block-image es-m-txt-c es-p5b" style="font-size:0;padding:10px" align="center"><a target="_blank" clicktracking="off"><img src="{{.organization.logo}}" alt="icon" style="display: block;" title="icon" width="30"></a></td>
|
||||
</tr>
|
||||
|
||||
<tr style="background: rgb(249,250,251);padding: 10px;margin-bottom:10px;border-radius:5px;">
|
||||
<td class="esd-block-text es-m-txt-c es-p15t" align="center" style="padding:10px;padding-bottom:30px;">
|
||||
<p>Hey there 👋</p>
|
||||
<b>{{.otp}}</b> is your one time password (OTP) for accessing {{.org_name}}. Please keep your OTP confidential and it will expire in 1 minute.
|
||||
<b>{{.otp}}</b> is your one time password (OTP) for accessing {{.organization.name}}. Please keep your OTP confidential and it will expire in 1 minute.
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
@@ -96,23 +85,4 @@ func SendOtpMail(toEmail, otp string) error {
|
||||
</body>
|
||||
</html>
|
||||
`
|
||||
data := make(map[string]interface{}, 3)
|
||||
var err error
|
||||
data["org_logo"], err = memorystore.Provider.GetStringStoreEnvVariable(constants.EnvKeyOrganizationLogo)
|
||||
if err != nil {
|
||||
return err
|
||||
}
|
||||
data["org_name"], err = memorystore.Provider.GetStringStoreEnvVariable(constants.EnvKeyOrganizationName)
|
||||
if err != nil {
|
||||
return err
|
||||
}
|
||||
data["otp"] = otp
|
||||
message = addEmailTemplate(message, data, "otp.tmpl")
|
||||
// bodyMessage := sender.WriteHTMLEmail(Receiver, Subject, message)
|
||||
|
||||
err = SendMail(Receiver, Subject, message)
|
||||
if err != nil {
|
||||
log.Warn("error sending email: ", err)
|
||||
}
|
||||
return err
|
||||
}
|
||||
)
|
||||
|
||||
1
server/email/utils.go
Normal file
1
server/email/utils.go
Normal file
@@ -0,0 +1 @@
|
||||
package email
|
||||
@@ -55,8 +55,10 @@ type ComplexityRoot struct {
|
||||
|
||||
EmailTemplate struct {
|
||||
CreatedAt func(childComplexity int) int
|
||||
Design func(childComplexity int) int
|
||||
EventName func(childComplexity int) int
|
||||
ID func(childComplexity int) int
|
||||
Subject func(childComplexity int) int
|
||||
Template func(childComplexity int) int
|
||||
UpdatedAt func(childComplexity int) int
|
||||
}
|
||||
@@ -405,6 +407,13 @@ func (e *executableSchema) Complexity(typeName, field string, childComplexity in
|
||||
|
||||
return e.complexity.EmailTemplate.CreatedAt(childComplexity), true
|
||||
|
||||
case "EmailTemplate.design":
|
||||
if e.complexity.EmailTemplate.Design == nil {
|
||||
break
|
||||
}
|
||||
|
||||
return e.complexity.EmailTemplate.Design(childComplexity), true
|
||||
|
||||
case "EmailTemplate.event_name":
|
||||
if e.complexity.EmailTemplate.EventName == nil {
|
||||
break
|
||||
@@ -419,6 +428,13 @@ func (e *executableSchema) Complexity(typeName, field string, childComplexity in
|
||||
|
||||
return e.complexity.EmailTemplate.ID(childComplexity), true
|
||||
|
||||
case "EmailTemplate.subject":
|
||||
if e.complexity.EmailTemplate.Subject == nil {
|
||||
break
|
||||
}
|
||||
|
||||
return e.complexity.EmailTemplate.Subject(childComplexity), true
|
||||
|
||||
case "EmailTemplate.template":
|
||||
if e.complexity.EmailTemplate.Template == nil {
|
||||
break
|
||||
@@ -433,7 +449,7 @@ func (e *executableSchema) Complexity(typeName, field string, childComplexity in
|
||||
|
||||
return e.complexity.EmailTemplate.UpdatedAt(childComplexity), true
|
||||
|
||||
case "EmailTemplates.EmailTemplates":
|
||||
case "EmailTemplates.email_templates":
|
||||
if e.complexity.EmailTemplates.EmailTemplates == nil {
|
||||
break
|
||||
}
|
||||
@@ -2051,13 +2067,15 @@ type EmailTemplate {
|
||||
id: ID!
|
||||
event_name: String!
|
||||
template: String!
|
||||
design: String!
|
||||
subject: String!
|
||||
created_at: Int64
|
||||
updated_at: Int64
|
||||
}
|
||||
|
||||
type EmailTemplates {
|
||||
pagination: Pagination!
|
||||
EmailTemplates: [EmailTemplate!]!
|
||||
email_templates: [EmailTemplate!]!
|
||||
}
|
||||
|
||||
input UpdateEnvInput {
|
||||
@@ -2271,13 +2289,17 @@ input TestEndpointRequest {
|
||||
|
||||
input AddEmailTemplateRequest {
|
||||
event_name: String!
|
||||
subject: String!
|
||||
template: String!
|
||||
design: String!
|
||||
}
|
||||
|
||||
input UpdateEmailTemplateRequest {
|
||||
id: ID!
|
||||
event_name: String
|
||||
template: String
|
||||
subject: String
|
||||
design: String
|
||||
}
|
||||
|
||||
input DeleteEmailTemplateRequest {
|
||||
@@ -3259,6 +3281,76 @@ func (ec *executionContext) _EmailTemplate_template(ctx context.Context, field g
|
||||
return ec.marshalNString2string(ctx, field.Selections, res)
|
||||
}
|
||||
|
||||
func (ec *executionContext) _EmailTemplate_design(ctx context.Context, field graphql.CollectedField, obj *model.EmailTemplate) (ret graphql.Marshaler) {
|
||||
defer func() {
|
||||
if r := recover(); r != nil {
|
||||
ec.Error(ctx, ec.Recover(ctx, r))
|
||||
ret = graphql.Null
|
||||
}
|
||||
}()
|
||||
fc := &graphql.FieldContext{
|
||||
Object: "EmailTemplate",
|
||||
Field: field,
|
||||
Args: nil,
|
||||
IsMethod: false,
|
||||
IsResolver: false,
|
||||
}
|
||||
|
||||
ctx = graphql.WithFieldContext(ctx, fc)
|
||||
resTmp, err := ec.ResolverMiddleware(ctx, func(rctx context.Context) (interface{}, error) {
|
||||
ctx = rctx // use context from middleware stack in children
|
||||
return obj.Design, nil
|
||||
})
|
||||
if err != nil {
|
||||
ec.Error(ctx, err)
|
||||
return graphql.Null
|
||||
}
|
||||
if resTmp == nil {
|
||||
if !graphql.HasFieldError(ctx, fc) {
|
||||
ec.Errorf(ctx, "must not be null")
|
||||
}
|
||||
return graphql.Null
|
||||
}
|
||||
res := resTmp.(string)
|
||||
fc.Result = res
|
||||
return ec.marshalNString2string(ctx, field.Selections, res)
|
||||
}
|
||||
|
||||
func (ec *executionContext) _EmailTemplate_subject(ctx context.Context, field graphql.CollectedField, obj *model.EmailTemplate) (ret graphql.Marshaler) {
|
||||
defer func() {
|
||||
if r := recover(); r != nil {
|
||||
ec.Error(ctx, ec.Recover(ctx, r))
|
||||
ret = graphql.Null
|
||||
}
|
||||
}()
|
||||
fc := &graphql.FieldContext{
|
||||
Object: "EmailTemplate",
|
||||
Field: field,
|
||||
Args: nil,
|
||||
IsMethod: false,
|
||||
IsResolver: false,
|
||||
}
|
||||
|
||||
ctx = graphql.WithFieldContext(ctx, fc)
|
||||
resTmp, err := ec.ResolverMiddleware(ctx, func(rctx context.Context) (interface{}, error) {
|
||||
ctx = rctx // use context from middleware stack in children
|
||||
return obj.Subject, nil
|
||||
})
|
||||
if err != nil {
|
||||
ec.Error(ctx, err)
|
||||
return graphql.Null
|
||||
}
|
||||
if resTmp == nil {
|
||||
if !graphql.HasFieldError(ctx, fc) {
|
||||
ec.Errorf(ctx, "must not be null")
|
||||
}
|
||||
return graphql.Null
|
||||
}
|
||||
res := resTmp.(string)
|
||||
fc.Result = res
|
||||
return ec.marshalNString2string(ctx, field.Selections, res)
|
||||
}
|
||||
|
||||
func (ec *executionContext) _EmailTemplate_created_at(ctx context.Context, field graphql.CollectedField, obj *model.EmailTemplate) (ret graphql.Marshaler) {
|
||||
defer func() {
|
||||
if r := recover(); r != nil {
|
||||
@@ -3358,7 +3450,7 @@ func (ec *executionContext) _EmailTemplates_pagination(ctx context.Context, fiel
|
||||
return ec.marshalNPagination2ᚖgithubᚗcomᚋauthorizerdevᚋauthorizerᚋserverᚋgraphᚋmodelᚐPagination(ctx, field.Selections, res)
|
||||
}
|
||||
|
||||
func (ec *executionContext) _EmailTemplates_EmailTemplates(ctx context.Context, field graphql.CollectedField, obj *model.EmailTemplates) (ret graphql.Marshaler) {
|
||||
func (ec *executionContext) _EmailTemplates_email_templates(ctx context.Context, field graphql.CollectedField, obj *model.EmailTemplates) (ret graphql.Marshaler) {
|
||||
defer func() {
|
||||
if r := recover(); r != nil {
|
||||
ec.Error(ctx, ec.Recover(ctx, r))
|
||||
@@ -10459,6 +10551,14 @@ func (ec *executionContext) unmarshalInputAddEmailTemplateRequest(ctx context.Co
|
||||
if err != nil {
|
||||
return it, err
|
||||
}
|
||||
case "subject":
|
||||
var err error
|
||||
|
||||
ctx := graphql.WithPathContext(ctx, graphql.NewPathWithField("subject"))
|
||||
it.Subject, err = ec.unmarshalNString2string(ctx, v)
|
||||
if err != nil {
|
||||
return it, err
|
||||
}
|
||||
case "template":
|
||||
var err error
|
||||
|
||||
@@ -10467,6 +10567,14 @@ func (ec *executionContext) unmarshalInputAddEmailTemplateRequest(ctx context.Co
|
||||
if err != nil {
|
||||
return it, err
|
||||
}
|
||||
case "design":
|
||||
var err error
|
||||
|
||||
ctx := graphql.WithPathContext(ctx, graphql.NewPathWithField("design"))
|
||||
it.Design, err = ec.unmarshalNString2string(ctx, v)
|
||||
if err != nil {
|
||||
return it, err
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -11269,6 +11377,22 @@ func (ec *executionContext) unmarshalInputUpdateEmailTemplateRequest(ctx context
|
||||
if err != nil {
|
||||
return it, err
|
||||
}
|
||||
case "subject":
|
||||
var err error
|
||||
|
||||
ctx := graphql.WithPathContext(ctx, graphql.NewPathWithField("subject"))
|
||||
it.Subject, err = ec.unmarshalOString2ᚖstring(ctx, v)
|
||||
if err != nil {
|
||||
return it, err
|
||||
}
|
||||
case "design":
|
||||
var err error
|
||||
|
||||
ctx := graphql.WithPathContext(ctx, graphql.NewPathWithField("design"))
|
||||
it.Design, err = ec.unmarshalOString2ᚖstring(ctx, v)
|
||||
if err != nil {
|
||||
return it, err
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -12100,6 +12224,16 @@ func (ec *executionContext) _EmailTemplate(ctx context.Context, sel ast.Selectio
|
||||
if out.Values[i] == graphql.Null {
|
||||
invalids++
|
||||
}
|
||||
case "design":
|
||||
out.Values[i] = ec._EmailTemplate_design(ctx, field, obj)
|
||||
if out.Values[i] == graphql.Null {
|
||||
invalids++
|
||||
}
|
||||
case "subject":
|
||||
out.Values[i] = ec._EmailTemplate_subject(ctx, field, obj)
|
||||
if out.Values[i] == graphql.Null {
|
||||
invalids++
|
||||
}
|
||||
case "created_at":
|
||||
out.Values[i] = ec._EmailTemplate_created_at(ctx, field, obj)
|
||||
case "updated_at":
|
||||
@@ -12131,8 +12265,8 @@ func (ec *executionContext) _EmailTemplates(ctx context.Context, sel ast.Selecti
|
||||
if out.Values[i] == graphql.Null {
|
||||
invalids++
|
||||
}
|
||||
case "EmailTemplates":
|
||||
out.Values[i] = ec._EmailTemplates_EmailTemplates(ctx, field, obj)
|
||||
case "email_templates":
|
||||
out.Values[i] = ec._EmailTemplates_email_templates(ctx, field, obj)
|
||||
if out.Values[i] == graphql.Null {
|
||||
invalids++
|
||||
}
|
||||
|
||||
@@ -4,7 +4,9 @@ package model
|
||||
|
||||
type AddEmailTemplateRequest struct {
|
||||
EventName string `json:"event_name"`
|
||||
Subject string `json:"subject"`
|
||||
Template string `json:"template"`
|
||||
Design string `json:"design"`
|
||||
}
|
||||
|
||||
type AddWebhookRequest struct {
|
||||
@@ -44,13 +46,15 @@ type EmailTemplate struct {
|
||||
ID string `json:"id"`
|
||||
EventName string `json:"event_name"`
|
||||
Template string `json:"template"`
|
||||
Design string `json:"design"`
|
||||
Subject string `json:"subject"`
|
||||
CreatedAt *int64 `json:"created_at"`
|
||||
UpdatedAt *int64 `json:"updated_at"`
|
||||
}
|
||||
|
||||
type EmailTemplates struct {
|
||||
Pagination *Pagination `json:"pagination"`
|
||||
EmailTemplates []*EmailTemplate `json:"EmailTemplates"`
|
||||
EmailTemplates []*EmailTemplate `json:"email_templates"`
|
||||
}
|
||||
|
||||
type Env struct {
|
||||
@@ -249,6 +253,8 @@ type UpdateEmailTemplateRequest struct {
|
||||
ID string `json:"id"`
|
||||
EventName *string `json:"event_name"`
|
||||
Template *string `json:"template"`
|
||||
Subject *string `json:"subject"`
|
||||
Design *string `json:"design"`
|
||||
}
|
||||
|
||||
type UpdateEnvInput struct {
|
||||
|
||||
@@ -194,13 +194,15 @@ type EmailTemplate {
|
||||
id: ID!
|
||||
event_name: String!
|
||||
template: String!
|
||||
design: String!
|
||||
subject: String!
|
||||
created_at: Int64
|
||||
updated_at: Int64
|
||||
}
|
||||
|
||||
type EmailTemplates {
|
||||
pagination: Pagination!
|
||||
EmailTemplates: [EmailTemplate!]!
|
||||
email_templates: [EmailTemplate!]!
|
||||
}
|
||||
|
||||
input UpdateEnvInput {
|
||||
@@ -414,13 +416,17 @@ input TestEndpointRequest {
|
||||
|
||||
input AddEmailTemplateRequest {
|
||||
event_name: String!
|
||||
subject: String!
|
||||
template: String!
|
||||
design: String!
|
||||
}
|
||||
|
||||
input UpdateEmailTemplateRequest {
|
||||
id: ID!
|
||||
event_name: String
|
||||
template: String
|
||||
subject: String
|
||||
design: String
|
||||
}
|
||||
|
||||
input DeleteEmailTemplateRequest {
|
||||
|
||||
@@ -14,8 +14,6 @@ import (
|
||||
log "github.com/sirupsen/logrus"
|
||||
)
|
||||
|
||||
// TODO add template validator
|
||||
|
||||
// AddEmailTemplateResolver resolver for add email template mutation
|
||||
func AddEmailTemplateResolver(ctx context.Context, params model.AddEmailTemplateRequest) (*model.Response, error) {
|
||||
gc, err := utils.GinContextFromContext(ctx)
|
||||
@@ -34,13 +32,23 @@ func AddEmailTemplateResolver(ctx context.Context, params model.AddEmailTemplate
|
||||
return nil, fmt.Errorf("invalid event name %s", params.EventName)
|
||||
}
|
||||
|
||||
if strings.TrimSpace(params.Subject) == "" {
|
||||
return nil, fmt.Errorf("empty subject not allowed")
|
||||
}
|
||||
|
||||
if strings.TrimSpace(params.Template) == "" {
|
||||
return nil, fmt.Errorf("empty template not allowed")
|
||||
}
|
||||
|
||||
if strings.TrimSpace(params.Design) == "" {
|
||||
return nil, fmt.Errorf("empty design not allowed")
|
||||
}
|
||||
|
||||
_, err = db.Provider.AddEmailTemplate(ctx, models.EmailTemplate{
|
||||
EventName: params.EventName,
|
||||
Template: params.Template,
|
||||
Subject: params.Subject,
|
||||
Design: params.Design,
|
||||
})
|
||||
if err != nil {
|
||||
log.Debug("Failed to add email template: ", err)
|
||||
|
||||
@@ -49,7 +49,7 @@ func ForgotPasswordResolver(ctx context.Context, params model.ForgotPasswordInpu
|
||||
log := log.WithFields(log.Fields{
|
||||
"email": params.Email,
|
||||
})
|
||||
_, err = db.Provider.GetUserByEmail(ctx, params.Email)
|
||||
user, err := db.Provider.GetUserByEmail(ctx, params.Email)
|
||||
if err != nil {
|
||||
log.Debug("User not found: ", err)
|
||||
return res, fmt.Errorf(`user with this email not found`)
|
||||
@@ -84,8 +84,12 @@ func ForgotPasswordResolver(ctx context.Context, params model.ForgotPasswordInpu
|
||||
return res, err
|
||||
}
|
||||
|
||||
// exec it as go routin so that we can reduce the api latency
|
||||
go email.SendForgotPasswordMail(params.Email, verificationToken, hostname)
|
||||
// exec it as go routine so that we can reduce the api latency
|
||||
go email.SendEmail([]string{params.Email}, constants.VerificationTypeForgotPassword, map[string]interface{}{
|
||||
"user": user.ToMap(),
|
||||
"organization": utils.GetOrganization(),
|
||||
"verification_url": utils.GetForgotPasswordURL(verificationToken, hostname),
|
||||
})
|
||||
|
||||
res = &model.Response{
|
||||
Message: `Please check your inbox! We have sent a password reset link.`,
|
||||
|
||||
@@ -115,7 +115,7 @@ func InviteMembersResolver(ctx context.Context, params model.InviteMemberInput)
|
||||
return nil, err
|
||||
}
|
||||
|
||||
verificationToken, err := token.CreateVerificationToken(email, constants.VerificationTypeForgotPassword, hostname, nonceHash, redirectURL)
|
||||
verificationToken, err := token.CreateVerificationToken(email, constants.VerificationTypeInviteMember, hostname, nonceHash, redirectURL)
|
||||
if err != nil {
|
||||
log.Debug("Failed to create verification token: ", err)
|
||||
}
|
||||
@@ -135,7 +135,7 @@ func InviteMembersResolver(ctx context.Context, params model.InviteMemberInput)
|
||||
} else {
|
||||
// use basic authentication if that option is on
|
||||
user.SignupMethods = constants.AuthRecipeMethodBasicAuth
|
||||
verificationRequest.Identifier = constants.VerificationTypeForgotPassword
|
||||
verificationRequest.Identifier = constants.VerificationTypeInviteMember
|
||||
|
||||
isMFAEnforced, err := memorystore.Provider.GetBoolStoreEnvVariable(constants.EnvKeyEnforceMultiFactorAuthentication)
|
||||
if err != nil {
|
||||
@@ -162,7 +162,12 @@ func InviteMembersResolver(ctx context.Context, params model.InviteMemberInput)
|
||||
return nil, err
|
||||
}
|
||||
|
||||
go emailservice.InviteEmail(email, verificationToken, verifyEmailURL, redirectURL)
|
||||
// exec it as go routine so that we can reduce the api latency
|
||||
go emailservice.SendEmail([]string{user.Email}, constants.VerificationTypeInviteMember, map[string]interface{}{
|
||||
"user": user.ToMap(),
|
||||
"organization": utils.GetOrganization(),
|
||||
"verification_url": utils.GetInviteVerificationURL(verifyEmailURL, verificationToken, redirectURL),
|
||||
})
|
||||
}
|
||||
|
||||
return &model.Response{
|
||||
|
||||
@@ -123,7 +123,12 @@ func LoginResolver(ctx context.Context, params model.LoginInput) (*model.AuthRes
|
||||
}
|
||||
|
||||
go func() {
|
||||
err := email.SendOtpMail(user.Email, otpData.Otp)
|
||||
// exec it as go routine so that we can reduce the api latency
|
||||
go email.SendEmail([]string{params.Email}, constants.VerificationTypeOTP, map[string]interface{}{
|
||||
"user": user.ToMap(),
|
||||
"organization": utils.GetOrganization(),
|
||||
"otp": otpData.Otp,
|
||||
})
|
||||
if err != nil {
|
||||
log.Debug("Failed to send otp email: ", err)
|
||||
}
|
||||
|
||||
@@ -219,8 +219,12 @@ func MagicLinkLoginResolver(ctx context.Context, params model.MagicLinkLoginInpu
|
||||
return res, err
|
||||
}
|
||||
|
||||
// exec it as go routing so that we can reduce the api latency
|
||||
go email.SendVerificationMail(params.Email, verificationToken, hostname)
|
||||
// exec it as go routine so that we can reduce the api latency
|
||||
go email.SendEmail([]string{params.Email}, constants.VerificationTypeMagicLinkLogin, map[string]interface{}{
|
||||
"user": user.ToMap(),
|
||||
"organization": utils.GetOrganization(),
|
||||
"verification_url": utils.GetEmailVerificationURL(verificationToken, hostname),
|
||||
})
|
||||
}
|
||||
|
||||
res = &model.Response{
|
||||
|
||||
@@ -84,7 +84,12 @@ func ResendOTPResolver(ctx context.Context, params model.ResendOTPRequest) (*mod
|
||||
}
|
||||
|
||||
go func() {
|
||||
err := email.SendOtpMail(params.Email, otp)
|
||||
// exec it as go routine so that we can reduce the api latency
|
||||
go email.SendEmail([]string{params.Email}, constants.VerificationTypeOTP, map[string]interface{}{
|
||||
"user": user.ToMap(),
|
||||
"organization": utils.GetOrganization(),
|
||||
"otp": otp,
|
||||
})
|
||||
if err != nil {
|
||||
log.Debug("Error sending otp email: ", otp)
|
||||
}
|
||||
|
||||
@@ -39,6 +39,11 @@ func ResendVerifyEmailResolver(ctx context.Context, params model.ResendVerifyEma
|
||||
return res, fmt.Errorf("invalid identifier")
|
||||
}
|
||||
|
||||
user, err := db.Provider.GetUserByEmail(ctx, params.Email)
|
||||
if err != nil {
|
||||
return res, fmt.Errorf("invalid user")
|
||||
}
|
||||
|
||||
verificationRequest, err := db.Provider.GetVerificationRequestByEmail(ctx, params.Email, params.Identifier)
|
||||
if err != nil {
|
||||
log.Debug("Failed to get verification request: ", err)
|
||||
@@ -74,8 +79,12 @@ func ResendVerifyEmailResolver(ctx context.Context, params model.ResendVerifyEma
|
||||
log.Debug("Failed to add verification request: ", err)
|
||||
}
|
||||
|
||||
// exec it as go routin so that we can reduce the api latency
|
||||
go email.SendVerificationMail(params.Email, verificationToken, hostname)
|
||||
// exec it as go routine so that we can reduce the api latency
|
||||
go email.SendEmail([]string{params.Email}, params.Identifier, map[string]interface{}{
|
||||
"user": user.ToMap(),
|
||||
"organization": utils.GetOrganization(),
|
||||
"verification_url": utils.GetEmailVerificationURL(verificationToken, hostname),
|
||||
})
|
||||
|
||||
res = &model.Response{
|
||||
Message: `Verification email has been sent. Please check your inbox`,
|
||||
|
||||
@@ -221,9 +221,14 @@ func SignupResolver(ctx context.Context, params model.SignUpInput) (*model.AuthR
|
||||
return res, err
|
||||
}
|
||||
|
||||
// exec it as go routin so that we can reduce the api latency
|
||||
// exec it as go routine so that we can reduce the api latency
|
||||
go func() {
|
||||
email.SendVerificationMail(params.Email, verificationToken, hostname)
|
||||
// exec it as go routine so that we can reduce the api latency
|
||||
email.SendEmail([]string{params.Email}, constants.VerificationTypeBasicAuthSignup, map[string]interface{}{
|
||||
"user": user.ToMap(),
|
||||
"organization": utils.GetOrganization(),
|
||||
"verification_url": utils.GetEmailVerificationURL(verificationToken, hostname),
|
||||
})
|
||||
utils.RegisterEvent(ctx, constants.UserCreatedWebhookEvent, constants.AuthRecipeMethodBasicAuth, user)
|
||||
}()
|
||||
|
||||
|
||||
@@ -15,8 +15,6 @@ import (
|
||||
log "github.com/sirupsen/logrus"
|
||||
)
|
||||
|
||||
// TODO add template validator
|
||||
|
||||
// UpdateEmailTemplateResolver resolver for update email template mutation
|
||||
func UpdateEmailTemplateResolver(ctx context.Context, params model.UpdateEmailTemplateRequest) (*model.Response, error) {
|
||||
gc, err := utils.GinContextFromContext(ctx)
|
||||
@@ -51,6 +49,14 @@ func UpdateEmailTemplateResolver(ctx context.Context, params model.UpdateEmailTe
|
||||
emailTemplateDetails.EventName = refs.StringValue(params.EventName)
|
||||
}
|
||||
|
||||
if params.Subject != nil && emailTemplateDetails.Subject != refs.StringValue(params.Subject) {
|
||||
if strings.TrimSpace(refs.StringValue(params.Subject)) == "" {
|
||||
log.Debug("empty subject not allowed")
|
||||
return nil, fmt.Errorf("empty subject not allowed")
|
||||
}
|
||||
emailTemplateDetails.Subject = refs.StringValue(params.Subject)
|
||||
}
|
||||
|
||||
if params.Template != nil && emailTemplateDetails.Template != refs.StringValue(params.Template) {
|
||||
if strings.TrimSpace(refs.StringValue(params.Template)) == "" {
|
||||
log.Debug("empty template not allowed")
|
||||
@@ -59,6 +65,14 @@ func UpdateEmailTemplateResolver(ctx context.Context, params model.UpdateEmailTe
|
||||
emailTemplateDetails.Template = refs.StringValue(params.Template)
|
||||
}
|
||||
|
||||
if params.Design != nil && emailTemplateDetails.Design != refs.StringValue(params.Design) {
|
||||
if strings.TrimSpace(refs.StringValue(params.Design)) == "" {
|
||||
log.Debug("empty design not allowed")
|
||||
return nil, fmt.Errorf("empty design not allowed")
|
||||
}
|
||||
emailTemplateDetails.Design = refs.StringValue(params.Design)
|
||||
}
|
||||
|
||||
_, err = db.Provider.UpdateEmailTemplate(ctx, emailTemplateDetails)
|
||||
if err != nil {
|
||||
return nil, err
|
||||
|
||||
@@ -244,8 +244,12 @@ func UpdateProfileResolver(ctx context.Context, params model.UpdateProfileInput)
|
||||
return res, err
|
||||
}
|
||||
|
||||
// exec it as go routin so that we can reduce the api latency
|
||||
go email.SendVerificationMail(newEmail, verificationToken, hostname)
|
||||
// exec it as go routine so that we can reduce the api latency
|
||||
go email.SendEmail([]string{user.Email}, constants.VerificationTypeBasicAuthSignup, map[string]interface{}{
|
||||
"user": user.ToMap(),
|
||||
"organization": utils.GetOrganization(),
|
||||
"verification_url": utils.GetEmailVerificationURL(verificationToken, hostname),
|
||||
})
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@@ -156,8 +156,12 @@ func UpdateUserResolver(ctx context.Context, params model.UpdateUserInput) (*mod
|
||||
return res, err
|
||||
}
|
||||
|
||||
// exec it as go routin so that we can reduce the api latency
|
||||
go email.SendVerificationMail(newEmail, verificationToken, hostname)
|
||||
// exec it as go routine so that we can reduce the api latency
|
||||
go email.SendEmail([]string{user.Email}, constants.VerificationTypeBasicAuthSignup, map[string]interface{}{
|
||||
"user": user.ToMap(),
|
||||
"organization": utils.GetOrganization(),
|
||||
"verification_url": utils.GetEmailVerificationURL(verificationToken, hostname),
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
|
||||
@@ -31,10 +31,21 @@ func addEmailTemplateTest(t *testing.T, s TestSetup) {
|
||||
assert.Nil(t, emailTemplate)
|
||||
})
|
||||
|
||||
t.Run("should not add email template for empty template", func(t *testing.T) {
|
||||
emailTemplate, err := resolvers.AddEmailTemplateResolver(ctx, model.AddEmailTemplateRequest{
|
||||
EventName: s.TestInfo.TestEmailTemplateEventTypes[0],
|
||||
Template: " test ",
|
||||
Subject: " ",
|
||||
})
|
||||
assert.Error(t, err)
|
||||
assert.Nil(t, emailTemplate)
|
||||
})
|
||||
|
||||
t.Run("should not add email template for empty template", func(t *testing.T) {
|
||||
emailTemplate, err := resolvers.AddEmailTemplateResolver(ctx, model.AddEmailTemplateRequest{
|
||||
EventName: s.TestInfo.TestEmailTemplateEventTypes[0],
|
||||
Template: " ",
|
||||
Subject: "test",
|
||||
})
|
||||
assert.Error(t, err)
|
||||
assert.Nil(t, emailTemplate)
|
||||
@@ -43,7 +54,8 @@ func addEmailTemplateTest(t *testing.T, s TestSetup) {
|
||||
t.Run("should add email template for "+eventType, func(t *testing.T) {
|
||||
emailTemplate, err := resolvers.AddEmailTemplateResolver(ctx, model.AddEmailTemplateRequest{
|
||||
EventName: eventType,
|
||||
Template: `Test email`,
|
||||
Template: "Test email",
|
||||
Subject: "Test email",
|
||||
})
|
||||
assert.NoError(t, err)
|
||||
assert.NotNil(t, emailTemplate)
|
||||
@@ -52,6 +64,7 @@ func addEmailTemplateTest(t *testing.T, s TestSetup) {
|
||||
et, err := db.Provider.GetEmailTemplateByEventName(ctx, eventType)
|
||||
assert.NoError(t, err)
|
||||
assert.Equal(t, et.EventName, eventType)
|
||||
assert.Equal(t, "Test email", et.Subject)
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
@@ -31,6 +31,7 @@ func updateEmailTemplateTest(t *testing.T, s TestSetup) {
|
||||
res, err := resolvers.UpdateEmailTemplateResolver(ctx, model.UpdateEmailTemplateRequest{
|
||||
ID: emailTemplate.ID,
|
||||
Template: refs.NewStringRef("Updated test template"),
|
||||
Subject: refs.NewStringRef("Updated subject"),
|
||||
})
|
||||
|
||||
assert.NoError(t, err)
|
||||
@@ -42,5 +43,6 @@ func updateEmailTemplateTest(t *testing.T, s TestSetup) {
|
||||
assert.NotNil(t, updatedEmailTemplate)
|
||||
assert.Equal(t, emailTemplate.ID, updatedEmailTemplate.ID)
|
||||
assert.Equal(t, updatedEmailTemplate.Template, "Updated test template")
|
||||
assert.Equal(t, updatedEmailTemplate.Subject, "Updated subject")
|
||||
})
|
||||
}
|
||||
|
||||
@@ -2,6 +2,9 @@ package utils
|
||||
|
||||
import (
|
||||
"reflect"
|
||||
|
||||
"github.com/authorizerdev/authorizer/server/constants"
|
||||
"github.com/authorizerdev/authorizer/server/memorystore"
|
||||
)
|
||||
|
||||
// StringSliceContains checks if a string slice contains a particular string
|
||||
@@ -58,3 +61,46 @@ func ConvertInterfaceToStringSlice(slice interface{}) []string {
|
||||
}
|
||||
return resSlice
|
||||
}
|
||||
|
||||
// GetOrganization to get organization object
|
||||
func GetOrganization() map[string]interface{} {
|
||||
orgLogo, err := memorystore.Provider.GetStringStoreEnvVariable(constants.EnvKeyOrganizationLogo)
|
||||
if err != nil {
|
||||
return nil
|
||||
}
|
||||
orgName, err := memorystore.Provider.GetStringStoreEnvVariable(constants.EnvKeyOrganizationName)
|
||||
if err != nil {
|
||||
return nil
|
||||
}
|
||||
organization := map[string]interface{}{
|
||||
"name": orgName,
|
||||
"logo": orgLogo,
|
||||
}
|
||||
|
||||
return organization
|
||||
}
|
||||
|
||||
// GetForgotPasswordURL to get url for given token and hostname
|
||||
func GetForgotPasswordURL(token, hostname string) string {
|
||||
resetPasswordUrl, err := memorystore.Provider.GetStringStoreEnvVariable(constants.EnvKeyResetPasswordURL)
|
||||
if err != nil {
|
||||
return ""
|
||||
}
|
||||
if resetPasswordUrl == "" {
|
||||
if err := memorystore.Provider.UpdateEnvVariable(constants.EnvKeyResetPasswordURL, hostname+"/app/reset-password"); err != nil {
|
||||
return ""
|
||||
}
|
||||
}
|
||||
verificationURL := resetPasswordUrl + "?token=" + token
|
||||
return verificationURL
|
||||
}
|
||||
|
||||
// GetInviteVerificationURL to get url for invite email verification
|
||||
func GetInviteVerificationURL(verificationURL, token, redirectURI string) string {
|
||||
return verificationURL + "?token=" + token + "&redirect_uri=" + redirectURI
|
||||
}
|
||||
|
||||
// GetEmailVerificationURL to get url for invite email verification
|
||||
func GetEmailVerificationURL(token, hostname string) string {
|
||||
return hostname + "/verify_email?token=" + token
|
||||
}
|
||||
|
||||
@@ -4,7 +4,7 @@ import "github.com/authorizerdev/authorizer/server/constants"
|
||||
|
||||
// IsValidEmailTemplateEventName function to validate email template events
|
||||
func IsValidEmailTemplateEventName(eventName string) bool {
|
||||
if eventName != constants.VerificationTypeBasicAuthSignup && eventName != constants.VerificationTypeForgotPassword && eventName != constants.VerificationTypeMagicLinkLogin && eventName != constants.VerificationTypeUpdateEmail {
|
||||
if eventName != constants.VerificationTypeBasicAuthSignup && eventName != constants.VerificationTypeForgotPassword && eventName != constants.VerificationTypeMagicLinkLogin && eventName != constants.VerificationTypeUpdateEmail && eventName != constants.VerificationTypeOTP && eventName != constants.VerificationTypeInviteMember {
|
||||
return false
|
||||
}
|
||||
|
||||
|
||||
@@ -12,9 +12,901 @@
|
||||
<script>
|
||||
window.__authorizer__ = {{.data}}
|
||||
</script>
|
||||
<style>
|
||||
.rdw-option-wrapper {
|
||||
border: 1px solid #F1F1F1;
|
||||
padding: 5px;
|
||||
min-width: 25px;
|
||||
height: 20px;
|
||||
border-radius: 2px;
|
||||
margin: 0 4px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
cursor: pointer;
|
||||
background: white;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
.rdw-option-wrapper:hover {
|
||||
box-shadow: 1px 1px 0px #BFBDBD;
|
||||
}
|
||||
.rdw-option-wrapper:active {
|
||||
box-shadow: 1px 1px 0px #BFBDBD inset;
|
||||
}
|
||||
.rdw-option-active {
|
||||
box-shadow: 1px 1px 0px #BFBDBD inset;
|
||||
}
|
||||
.rdw-option-disabled {
|
||||
opacity: 0.3;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.rdw-dropdown-wrapper {
|
||||
height: 30px;
|
||||
background: white;
|
||||
cursor: pointer;
|
||||
border: 1px solid #F1F1F1;
|
||||
border-radius: 2px;
|
||||
margin: 0 3px;
|
||||
text-transform: capitalize;
|
||||
background: white;
|
||||
}
|
||||
.rdw-dropdown-wrapper:focus {
|
||||
outline: none;
|
||||
}
|
||||
.rdw-dropdown-wrapper:hover {
|
||||
box-shadow: 1px 1px 0px #BFBDBD;
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
.rdw-dropdown-wrapper:active {
|
||||
box-shadow: 1px 1px 0px #BFBDBD inset;
|
||||
}
|
||||
.rdw-dropdown-carettoopen {
|
||||
height: 0px;
|
||||
width: 0px;
|
||||
position: absolute;
|
||||
top: 35%;
|
||||
right: 10%;
|
||||
border-top: 6px solid black;
|
||||
border-left: 5px solid transparent;
|
||||
border-right: 5px solid transparent;
|
||||
}
|
||||
.rdw-dropdown-carettoclose {
|
||||
height: 0px;
|
||||
width: 0px;
|
||||
position: absolute;
|
||||
top: 35%;
|
||||
right: 10%;
|
||||
border-bottom: 6px solid black;
|
||||
border-left: 5px solid transparent;
|
||||
border-right: 5px solid transparent;
|
||||
}
|
||||
.rdw-dropdown-selectedtext {
|
||||
display: flex;
|
||||
position: relative;
|
||||
height: 100%;
|
||||
align-items: center;
|
||||
padding: 0 5px;
|
||||
}
|
||||
.rdw-dropdown-optionwrapper {
|
||||
z-index: 100;
|
||||
position: relative;
|
||||
border: 1px solid #F1F1F1;
|
||||
width: 98%;
|
||||
background: white;
|
||||
border-radius: 2px;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
max-height: 250px;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
.rdw-dropdown-optionwrapper:hover {
|
||||
box-shadow: 1px 1px 0px #BFBDBD;
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
|
||||
.rdw-dropdownoption-default {
|
||||
min-height: 25px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 5px;
|
||||
}
|
||||
.rdw-dropdownoption-highlighted {
|
||||
background: #F1F1F1;
|
||||
}
|
||||
.rdw-dropdownoption-active {
|
||||
background: #f5f5f5;
|
||||
}
|
||||
.rdw-dropdownoption-disabled {
|
||||
opacity: 0.3;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.rdw-inline-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 6px;
|
||||
flex-wrap: wrap
|
||||
}
|
||||
.rdw-inline-dropdown {
|
||||
width: 50px;
|
||||
}
|
||||
.rdw-inline-dropdownoption {
|
||||
height: 40px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.rdw-block-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 6px;
|
||||
flex-wrap: wrap
|
||||
}
|
||||
.rdw-block-dropdown {
|
||||
width: 110px;
|
||||
}
|
||||
|
||||
.rdw-fontsize-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 6px;
|
||||
flex-wrap: wrap
|
||||
}
|
||||
.rdw-fontsize-dropdown {
|
||||
min-width: 40px;
|
||||
}
|
||||
.rdw-fontsize-option {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.rdw-fontfamily-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 6px;
|
||||
flex-wrap: wrap
|
||||
}
|
||||
.rdw-fontfamily-dropdown {
|
||||
width: 115px;
|
||||
}
|
||||
.rdw-fontfamily-placeholder {
|
||||
white-space: nowrap;
|
||||
max-width: 90px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.rdw-fontfamily-optionwrapper {
|
||||
width: 140px;
|
||||
}
|
||||
|
||||
.rdw-list-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 6px;
|
||||
flex-wrap: wrap
|
||||
}
|
||||
.rdw-list-dropdown {
|
||||
width: 50px;
|
||||
z-index: 90;
|
||||
}
|
||||
.rdw-list-dropdownOption {
|
||||
height: 40px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.rdw-text-align-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 6px;
|
||||
flex-wrap: wrap
|
||||
}
|
||||
.rdw-text-align-dropdown {
|
||||
width: 50px;
|
||||
z-index: 90;
|
||||
}
|
||||
.rdw-text-align-dropdownOption {
|
||||
height: 40px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.rdw-right-aligned-block {
|
||||
text-align: right;
|
||||
}
|
||||
.rdw-left-aligned-block {
|
||||
text-align: left !important;
|
||||
}
|
||||
.rdw-center-aligned-block {
|
||||
text-align: center !important;
|
||||
}
|
||||
.rdw-justify-aligned-block {
|
||||
text-align: justify !important;
|
||||
}
|
||||
.rdw-right-aligned-block > div {
|
||||
display: inline-block;
|
||||
}
|
||||
.rdw-left-aligned-block > div {
|
||||
display: inline-block;
|
||||
}
|
||||
.rdw-center-aligned-block > div {
|
||||
display: inline-block;
|
||||
}
|
||||
.rdw-justify-aligned-block > div {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.rdw-colorpicker-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 6px;
|
||||
position: relative;
|
||||
flex-wrap: wrap
|
||||
}
|
||||
.rdw-colorpicker-modal {
|
||||
position: absolute;
|
||||
top: 35px;
|
||||
left: 5px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 175px;
|
||||
height: 175px;
|
||||
border: 1px solid #F1F1F1;
|
||||
padding: 15px;
|
||||
border-radius: 2px;
|
||||
z-index: 100;
|
||||
background: white;
|
||||
box-shadow: 3px 3px 5px #BFBDBD;
|
||||
}
|
||||
.rdw-colorpicker-modal-header {
|
||||
display: flex;
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
.rdw-colorpicker-modal-style-label {
|
||||
font-size: 15px;
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
padding: 0 10px 5px;
|
||||
}
|
||||
.rdw-colorpicker-modal-style-label-active {
|
||||
border-bottom: 2px solid #0a66b7;
|
||||
}
|
||||
.rdw-colorpicker-modal-options {
|
||||
margin: 5px auto;
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
flex-wrap: wrap;
|
||||
overflow: scroll;
|
||||
}
|
||||
.rdw-colorpicker-cube {
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
border: 1px solid #F1F1F1;
|
||||
}
|
||||
.rdw-colorpicker-option {
|
||||
margin: 3px;
|
||||
padding: 0;
|
||||
min-height: 20px;
|
||||
border: none;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
min-width: 22px;
|
||||
box-shadow: 1px 2px 1px #BFBDBD inset;
|
||||
}
|
||||
.rdw-colorpicker-option:hover {
|
||||
box-shadow: 1px 2px 1px #BFBDBD;
|
||||
}
|
||||
.rdw-colorpicker-option:active {
|
||||
box-shadow: -1px -2px 1px #BFBDBD;
|
||||
}
|
||||
.rdw-colorpicker-option-active {
|
||||
box-shadow: 0px 0px 2px 2px #BFBDBD;
|
||||
}
|
||||
|
||||
.rdw-link-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 6px;
|
||||
position: relative;
|
||||
flex-wrap: wrap
|
||||
}
|
||||
.rdw-link-dropdown {
|
||||
width: 50px;
|
||||
}
|
||||
.rdw-link-dropdownOption {
|
||||
height: 40px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.rdw-link-dropdownPlaceholder {
|
||||
margin-left: 8px;
|
||||
}
|
||||
.rdw-link-modal {
|
||||
position: absolute;
|
||||
top: 35px;
|
||||
left: 5px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 235px;
|
||||
height: 205px;
|
||||
border: 1px solid #F1F1F1;
|
||||
padding: 15px;
|
||||
border-radius: 2px;
|
||||
z-index: 100;
|
||||
background: white;
|
||||
box-shadow: 3px 3px 5px #BFBDBD;
|
||||
}
|
||||
.rdw-link-modal-label {
|
||||
font-size: 15px;
|
||||
}
|
||||
.rdw-link-modal-input {
|
||||
margin-top: 5px;
|
||||
border-radius: 2px;
|
||||
border: 1px solid #F1F1F1;
|
||||
height: 25px;
|
||||
margin-bottom: 15px;
|
||||
padding: 0 5px;
|
||||
}
|
||||
.rdw-link-modal-input:focus {
|
||||
outline: none;
|
||||
}
|
||||
.rdw-link-modal-buttonsection {
|
||||
margin: 0 auto;
|
||||
}
|
||||
.rdw-link-modal-target-option {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.rdw-link-modal-target-option > span {
|
||||
margin-left: 5px;
|
||||
}
|
||||
.rdw-link-modal-btn {
|
||||
margin-left: 10px;
|
||||
width: 75px;
|
||||
height: 30px;
|
||||
border: 1px solid #F1F1F1;
|
||||
border-radius: 2px;
|
||||
cursor: pointer;
|
||||
background: white;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
.rdw-link-modal-btn:hover {
|
||||
box-shadow: 1px 1px 0px #BFBDBD;
|
||||
}
|
||||
.rdw-link-modal-btn:active {
|
||||
box-shadow: 1px 1px 0px #BFBDBD inset;
|
||||
}
|
||||
.rdw-link-modal-btn:focus {
|
||||
outline: none !important;
|
||||
}
|
||||
.rdw-link-modal-btn:disabled {
|
||||
background: #ece9e9;
|
||||
}
|
||||
.rdw-link-dropdownoption {
|
||||
height: 40px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.rdw-history-dropdown {
|
||||
width: 50px;
|
||||
}
|
||||
|
||||
.rdw-embedded-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 6px;
|
||||
position: relative;
|
||||
flex-wrap: wrap
|
||||
}
|
||||
.rdw-embedded-modal {
|
||||
position: absolute;
|
||||
top: 35px;
|
||||
left: 5px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 235px;
|
||||
height: 180px;
|
||||
border: 1px solid #F1F1F1;
|
||||
padding: 15px;
|
||||
border-radius: 2px;
|
||||
z-index: 100;
|
||||
background: white;
|
||||
justify-content: space-between;
|
||||
box-shadow: 3px 3px 5px #BFBDBD;
|
||||
}
|
||||
.rdw-embedded-modal-header {
|
||||
font-size: 15px;
|
||||
display: flex;
|
||||
}
|
||||
.rdw-embedded-modal-header-option {
|
||||
width: 50%;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
.rdw-embedded-modal-header-label {
|
||||
width: 95px;
|
||||
border: 1px solid #f1f1f1;
|
||||
margin-top: 5px;
|
||||
background: #6EB8D4;
|
||||
border-bottom: 2px solid #0a66b7;
|
||||
}
|
||||
.rdw-embedded-modal-link-section {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
.rdw-embedded-modal-link-input {
|
||||
width: 88%;
|
||||
height: 35px;
|
||||
margin: 10px 0;
|
||||
border: 1px solid #F1F1F1;
|
||||
border-radius: 2px;
|
||||
font-size: 15px;
|
||||
padding: 0 5px;
|
||||
}
|
||||
.rdw-embedded-modal-link-input-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.rdw-embedded-modal-link-input:focus {
|
||||
outline: none;
|
||||
}
|
||||
.rdw-embedded-modal-btn-section {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.rdw-embedded-modal-btn {
|
||||
margin: 0 3px;
|
||||
width: 75px;
|
||||
height: 30px;
|
||||
border: 1px solid #F1F1F1;
|
||||
border-radius: 2px;
|
||||
cursor: pointer;
|
||||
background: white;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
.rdw-embedded-modal-btn:hover {
|
||||
box-shadow: 1px 1px 0px #BFBDBD;
|
||||
}
|
||||
.rdw-embedded-modal-btn:active {
|
||||
box-shadow: 1px 1px 0px #BFBDBD inset;
|
||||
}
|
||||
.rdw-embedded-modal-btn:focus {
|
||||
outline: none !important;
|
||||
}
|
||||
.rdw-embedded-modal-btn:disabled {
|
||||
background: #ece9e9;
|
||||
}
|
||||
.rdw-embedded-modal-size {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
margin: 8px 0;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.rdw-embedded-modal-size-input {
|
||||
width: 80%;
|
||||
height: 20px;
|
||||
border: 1px solid #F1F1F1;
|
||||
border-radius: 2px;
|
||||
font-size: 12px;
|
||||
}
|
||||
.rdw-embedded-modal-size-input:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.rdw-emoji-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 6px;
|
||||
position: relative;
|
||||
flex-wrap: wrap
|
||||
}
|
||||
.rdw-emoji-modal {
|
||||
overflow: auto;
|
||||
position: absolute;
|
||||
top: 35px;
|
||||
left: 5px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
width: 235px;
|
||||
height: 180px;
|
||||
border: 1px solid #F1F1F1;
|
||||
padding: 15px;
|
||||
border-radius: 2px;
|
||||
z-index: 100;
|
||||
background: white;
|
||||
box-shadow: 3px 3px 5px #BFBDBD;
|
||||
}
|
||||
.rdw-emoji-icon {
|
||||
margin: 2.5px;
|
||||
height: 24px;
|
||||
width: 24px;
|
||||
cursor: pointer;
|
||||
font-size: 22px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.rdw-spinner {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
.rdw-spinner > div {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
background-color: #333;
|
||||
|
||||
border-radius: 100%;
|
||||
display: inline-block;
|
||||
-webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
|
||||
animation: sk-bouncedelay 1.4s infinite ease-in-out both;
|
||||
}
|
||||
.rdw-spinner .rdw-bounce1 {
|
||||
-webkit-animation-delay: -0.32s;
|
||||
animation-delay: -0.32s;
|
||||
}
|
||||
.rdw-spinner .rdw-bounce2 {
|
||||
-webkit-animation-delay: -0.16s;
|
||||
animation-delay: -0.16s;
|
||||
}
|
||||
@-webkit-keyframes sk-bouncedelay {
|
||||
0%, 80%, 100% { -webkit-transform: scale(0) }
|
||||
40% { -webkit-transform: scale(1.0) }
|
||||
}
|
||||
@keyframes sk-bouncedelay {
|
||||
0%, 80%, 100% {
|
||||
-webkit-transform: scale(0);
|
||||
transform: scale(0);
|
||||
} 40% {
|
||||
-webkit-transform: scale(1.0);
|
||||
transform: scale(1.0);
|
||||
}
|
||||
}
|
||||
|
||||
.rdw-image-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 6px;
|
||||
position: relative;
|
||||
flex-wrap: wrap
|
||||
}
|
||||
.rdw-image-modal {
|
||||
position: absolute;
|
||||
top: 35px;
|
||||
left: 5px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 235px;
|
||||
border: 1px solid #F1F1F1;
|
||||
padding: 15px;
|
||||
border-radius: 2px;
|
||||
z-index: 100;
|
||||
background: white;
|
||||
box-shadow: 3px 3px 5px #BFBDBD;
|
||||
}
|
||||
.rdw-image-modal-header {
|
||||
font-size: 15px;
|
||||
margin: 10px 0;
|
||||
display: flex;
|
||||
}
|
||||
.rdw-image-modal-header-option {
|
||||
width: 50%;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
.rdw-image-modal-header-label {
|
||||
width: 80px;
|
||||
background: #f1f1f1;
|
||||
border: 1px solid #f1f1f1;
|
||||
margin-top: 5px;
|
||||
}
|
||||
.rdw-image-modal-header-label-highlighted {
|
||||
background: #6EB8D4;
|
||||
border-bottom: 2px solid #0a66b7;
|
||||
}
|
||||
.rdw-image-modal-upload-option {
|
||||
width: 100%;
|
||||
color: gray;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
border: none;
|
||||
font-size: 15px;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background-color: #f1f1f1;
|
||||
outline: 2px dashed gray;
|
||||
outline-offset: -10px;
|
||||
margin: 10px 0;
|
||||
padding: 9px 0;
|
||||
}
|
||||
.rdw-image-modal-upload-option-highlighted {
|
||||
outline: 2px dashed #0a66b7;
|
||||
}
|
||||
.rdw-image-modal-upload-option-label {
|
||||
cursor: pointer;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 15px;
|
||||
}
|
||||
.rdw-image-modal-upload-option-label span{
|
||||
padding: 0 20px;
|
||||
}
|
||||
.rdw-image-modal-upload-option-image-preview {
|
||||
max-width: 100%;
|
||||
max-height: 200px;
|
||||
}
|
||||
.rdw-image-modal-upload-option-input {
|
||||
width: 0.1px;
|
||||
height: 0.1px;
|
||||
opacity: 0;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
z-index: -1;
|
||||
}
|
||||
.rdw-image-modal-url-section {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.rdw-image-modal-url-input {
|
||||
width: 90%;
|
||||
height: 35px;
|
||||
margin: 15px 0 12px;
|
||||
border: 1px solid #F1F1F1;
|
||||
border-radius: 2px;
|
||||
font-size: 15px;
|
||||
padding: 0 5px;
|
||||
}
|
||||
.rdw-image-modal-btn-section {
|
||||
margin: 10px auto 0;
|
||||
}
|
||||
.rdw-image-modal-url-input:focus {
|
||||
outline: none;
|
||||
}
|
||||
.rdw-image-modal-btn {
|
||||
margin: 0 5px;
|
||||
width: 75px;
|
||||
height: 30px;
|
||||
border: 1px solid #F1F1F1;
|
||||
border-radius: 2px;
|
||||
cursor: pointer;
|
||||
background: white;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
.rdw-image-modal-btn:hover {
|
||||
box-shadow: 1px 1px 0px #BFBDBD;
|
||||
}
|
||||
.rdw-image-modal-btn:active {
|
||||
box-shadow: 1px 1px 0px #BFBDBD inset;
|
||||
}
|
||||
.rdw-image-modal-btn:focus {
|
||||
outline: none !important;
|
||||
}
|
||||
.rdw-image-modal-btn:disabled {
|
||||
background: #ece9e9;
|
||||
}
|
||||
.rdw-image-modal-spinner {
|
||||
position: absolute;
|
||||
top: -3px;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
opacity: 0.5;
|
||||
}
|
||||
.rdw-image-modal-alt-input {
|
||||
width: 70%;
|
||||
height: 20px;
|
||||
border: 1px solid #F1F1F1;
|
||||
border-radius: 2px;
|
||||
font-size: 12px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
.rdw-image-modal-alt-input:focus {
|
||||
outline: none;
|
||||
}
|
||||
.rdw-image-modal-alt-lbl {
|
||||
font-size: 12px;
|
||||
}
|
||||
.rdw-image-modal-size {
|
||||
align-items: center;
|
||||
display: flex;
|
||||
margin: 8px 0;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.rdw-image-modal-size-input {
|
||||
width: 40%;
|
||||
height: 20px;
|
||||
border: 1px solid #F1F1F1;
|
||||
border-radius: 2px;
|
||||
font-size: 12px;
|
||||
}
|
||||
.rdw-image-modal-size-input:focus {
|
||||
outline: none;
|
||||
}
|
||||
.rdw-image-mandatory-sign {
|
||||
color: red;
|
||||
margin-left: 3px;
|
||||
margin-right: 3px;
|
||||
}
|
||||
|
||||
.rdw-remove-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 6px;
|
||||
position: relative;
|
||||
flex-wrap: wrap
|
||||
}
|
||||
|
||||
.rdw-history-wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 6px;
|
||||
flex-wrap: wrap
|
||||
}
|
||||
.rdw-history-dropdownoption {
|
||||
height: 40px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.rdw-history-dropdown {
|
||||
width: 50px;
|
||||
}
|
||||
|
||||
.rdw-link-decorator-wrapper {
|
||||
position: relative;
|
||||
}
|
||||
.rdw-link-decorator-icon {
|
||||
position: absolute;
|
||||
left: 40%;
|
||||
top: 0;
|
||||
cursor: pointer;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.rdw-mention-link {
|
||||
text-decoration: none;
|
||||
color: #1236ff;
|
||||
background-color: #f0fbff;
|
||||
padding: 1px 2px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.rdw-suggestion-wrapper {
|
||||
position: relative;
|
||||
}
|
||||
.rdw-suggestion-dropdown {
|
||||
position: absolute;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border: 1px solid #F1F1F1;
|
||||
min-width: 100px;
|
||||
max-height: 150px;
|
||||
overflow: auto;
|
||||
background: white;
|
||||
z-index: 100;
|
||||
}
|
||||
.rdw-suggestion-option {
|
||||
padding: 7px 5px;
|
||||
border-bottom: 1px solid #f1f1f1;
|
||||
}
|
||||
.rdw-suggestion-option-active {
|
||||
background-color: #F1F1F1;
|
||||
}
|
||||
|
||||
.rdw-hashtag-link {
|
||||
text-decoration: none;
|
||||
color: #1236ff;
|
||||
background-color: #f0fbff;
|
||||
padding: 1px 2px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
.rdw-image-alignment-options-popup {
|
||||
position: absolute;
|
||||
background: white;
|
||||
display: flex;
|
||||
padding: 5px 2px;
|
||||
border-radius: 2px;
|
||||
border: 1px solid #F1F1F1;
|
||||
width: 105px;
|
||||
cursor: pointer;
|
||||
z-index: 100;
|
||||
}
|
||||
.rdw-alignment-option-left {
|
||||
justify-content: flex-start;
|
||||
}
|
||||
.rdw-image-alignment-option {
|
||||
height: 15px;
|
||||
width: 15px;
|
||||
min-width: 15px;
|
||||
}
|
||||
.rdw-image-alignment {
|
||||
position: relative;
|
||||
}
|
||||
.rdw-image-imagewrapper {
|
||||
position: relative;
|
||||
}
|
||||
.rdw-image-center {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
.rdw-image-left {
|
||||
display: flex;
|
||||
}
|
||||
.rdw-image-right {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
.rdw-image-alignment-options-popup-right {
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.rdw-editor-main {
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.rdw-editor-toolbar {
|
||||
padding: 6px 5px 0;
|
||||
border-radius: 2px;
|
||||
border: 1px solid #F1F1F1;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
background: white;
|
||||
flex-wrap: wrap;
|
||||
font-size: 15px;
|
||||
margin-bottom: 5px;
|
||||
user-select: none;
|
||||
}
|
||||
.public-DraftStyleDefault-block {
|
||||
margin: 1em 0;
|
||||
}
|
||||
.rdw-editor-wrapper:focus {
|
||||
outline: none;
|
||||
}
|
||||
.rdw-editor-wrapper {
|
||||
box-sizing: content-box;
|
||||
}
|
||||
.rdw-editor-main blockquote {
|
||||
border-left: 5px solid #f1f1f1;
|
||||
padding-left: 5px;
|
||||
}
|
||||
.rdw-editor-main pre {
|
||||
background: #f1f1f1;
|
||||
border-radius: 3px;
|
||||
padding: 1px 10px;
|
||||
}
|
||||
/**
|
||||
* Draft v0.9.1
|
||||
*
|
||||
* Copyright (c) 2013-present, Facebook, Inc.
|
||||
* All rights reserved.
|
||||
*
|
||||
* This source code is licensed under the BSD-style license found in the
|
||||
* LICENSE file in the root directory of this source tree. An additional grant
|
||||
* of patent rights can be found in the PATENTS file in the same directory.
|
||||
*/
|
||||
.DraftEditor-editorContainer,.DraftEditor-root,.public-DraftEditor-content{height:inherit;text-align:initial}.public-DraftEditor-content[contenteditable=true]{-webkit-user-modify:read-write-plaintext-only}.DraftEditor-root{position:relative}.DraftEditor-editorContainer{background-color:rgba(255,255,255,0);border-left:.1px solid transparent;position:relative;z-index:1}.public-DraftEditor-block{position:relative}.DraftEditor-alignLeft .public-DraftStyleDefault-block{text-align:left}.DraftEditor-alignLeft .public-DraftEditorPlaceholder-root{left:0;text-align:left}.DraftEditor-alignCenter .public-DraftStyleDefault-block{text-align:center}.DraftEditor-alignCenter .public-DraftEditorPlaceholder-root{margin:0 auto;text-align:center;width:100%}.DraftEditor-alignRight .public-DraftStyleDefault-block{text-align:right}.DraftEditor-alignRight .public-DraftEditorPlaceholder-root{right:0;text-align:right}.public-DraftEditorPlaceholder-root{color:#9197a3;position:absolute;z-index:0}.public-DraftEditorPlaceholder-hasFocus{color:#bdc1c9}.DraftEditorPlaceholder-hidden{display:none}.public-DraftStyleDefault-block{position:relative;white-space:pre-wrap}.public-DraftStyleDefault-ltr{direction:ltr;text-align:left}.public-DraftStyleDefault-rtl{direction:rtl;text-align:right}.public-DraftStyleDefault-listLTR{direction:ltr}.public-DraftStyleDefault-listRTL{direction:rtl}.public-DraftStyleDefault-ol,.public-DraftStyleDefault-ul{margin:16px 0;padding:0}.public-DraftStyleDefault-depth0.public-DraftStyleDefault-listLTR{margin-left:1.5em}.public-DraftStyleDefault-depth0.public-DraftStyleDefault-listRTL{margin-right:1.5em}.public-DraftStyleDefault-depth1.public-DraftStyleDefault-listLTR{margin-left:3em}.public-DraftStyleDefault-depth1.public-DraftStyleDefault-listRTL{margin-right:3em}.public-DraftStyleDefault-depth2.public-DraftStyleDefault-listLTR{margin-left:4.5em}.public-DraftStyleDefault-depth2.public-DraftStyleDefault-listRTL{margin-right:4.5em}.public-DraftStyleDefault-depth3.public-DraftStyleDefault-listLTR{margin-left:6em}.public-DraftStyleDefault-depth3.public-DraftStyleDefault-listRTL{margin-right:6em}.public-DraftStyleDefault-depth4.public-DraftStyleDefault-listLTR{margin-left:7.5em}.public-DraftStyleDefault-depth4.public-DraftStyleDefault-listRTL{margin-right:7.5em}.public-DraftStyleDefault-unorderedListItem{list-style-type:square;position:relative}.public-DraftStyleDefault-unorderedListItem.public-DraftStyleDefault-depth0{list-style-type:disc}.public-DraftStyleDefault-unorderedListItem.public-DraftStyleDefault-depth1{list-style-type:circle}.public-DraftStyleDefault-orderedListItem{list-style-type:none;position:relative}.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-listLTR:before{left:-36px;position:absolute;text-align:right;width:30px}.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-listRTL:before{position:absolute;right:-36px;text-align:left;width:30px}.public-DraftStyleDefault-orderedListItem:before{content:counter(ol0) ". ";counter-increment:ol0}.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth1:before{content:counter(ol1) ". ";counter-increment:ol1}.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth2:before{content:counter(ol2) ". ";counter-increment:ol2}.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth3:before{content:counter(ol3) ". ";counter-increment:ol3}.public-DraftStyleDefault-orderedListItem.public-DraftStyleDefault-depth4:before{content:counter(ol4) ". ";counter-increment:ol4}.public-DraftStyleDefault-depth0.public-DraftStyleDefault-reset{counter-reset:ol0}.public-DraftStyleDefault-depth1.public-DraftStyleDefault-reset{counter-reset:ol1}.public-DraftStyleDefault-depth2.public-DraftStyleDefault-reset{counter-reset:ol2}.public-DraftStyleDefault-depth3.public-DraftStyleDefault-reset{counter-reset:ol3}.public-DraftStyleDefault-depth4.public-DraftStyleDefault-reset{counter-reset:ol4}
|
||||
|
||||
|
||||
/*# sourceMappingURL=react-draft-wysiwyg.css.map*/
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id="root"></div>
|
||||
<script type="module" src="/dashboard/build/index.js"></script>
|
||||
<script>var global = global || window;</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Reference in New Issue
Block a user