Skip to content

Commit 4a6dd27

Browse files
authored
Merge pull request #1099 from memphisdev/message-journey-issue
Message journey issue
2 parents ff0bdcc + 36e9914 commit 4a6dd27

File tree

20 files changed

+296
-264
lines changed

20 files changed

+296
-264
lines changed
7.87 KB
Loading
25.4 KB
Loading

ui_src/src/assets/images/s3Logo.svg

Lines changed: 17 additions & 9 deletions
Loading

ui_src/src/domain/administration/integrations/components/s3Integration/index.js

Lines changed: 109 additions & 104 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ const S3Integration = ({ close, value }) => {
2828
const isValue = value && Object.keys(value)?.length !== 0;
2929
const s3Configuration = INTEGRATION_LIST['S3'];
3030
const [creationForm] = Form.useForm();
31-
const [dispatch] = useContext(Context);
31+
const [state, dispatch] = useContext(Context);
3232
const [formFields, setFormFields] = useState({
3333
name: 's3',
3434
keys: {
@@ -64,7 +64,6 @@ const S3Integration = ({ close, value }) => {
6464
Promise.all(promises).then(() => {
6565
setImagesLoaded(true);
6666
});
67-
6867
}, []);
6968

7069
const updateKeysState = (field, value) => {
@@ -130,6 +129,7 @@ const S3Integration = ({ close, value }) => {
130129
setLoadingSubmit(false);
131130
}
132131
};
132+
133133
const disconnect = async () => {
134134
setLoadingDisconnect(true);
135135
try {
@@ -192,9 +192,9 @@ const S3Integration = ({ close, value }) => {
192192
<div className="api-key">
193193
<p>Secret access key</p>
194194
<span className="desc">
195-
When you use S3 compatible storage programmatically, you provide your access keys so that the provider can verify your identity in programmatic calls. Access
196-
keys can be either temporary (short-term) credentials or long-term credentials, such as for an IAM user, provider provided keys or credentials.{' '}
197-
<br />
195+
When you use S3 compatible storage programmatically, you provide your access keys so that the provider can verify your identity in
196+
programmatic calls. Access keys can be either temporary (short-term) credentials or long-term credentials, such as for an IAM user,
197+
provider provided keys or credentials. <br />
198198
<b>Memphis encrypts all stored information using Triple DES algorithm</b>
199199
</span>
200200
<Form.Item
@@ -249,106 +249,111 @@ const S3Integration = ({ close, value }) => {
249249
/>
250250
</Form.Item>
251251
</div>
252-
<div className="select-field">
253-
<p>Region</p>
254-
<Form.Item
255-
name="region"
256-
initialValue={formFields?.keys?.region}
257-
rules={[
258-
{
259-
required: true,
260-
message: 'Please insert region'
261-
}
262-
]}
263-
>
264-
<Input
265-
type="text"
266-
placeholder="us-east-1"
267-
fontSize="12px"
268-
colorType="black"
269-
backgroundColorType="none"
270-
borderColorType="gray"
271-
radiusType="semi-round"
272-
height="40px"
273-
value={formFields?.keys?.region}
274-
onBlur={(e) => updateKeysState('region', e.target.value)}
275-
onChange={(e) => updateKeysState('region', e.target.value)}
276-
/>
277-
</Form.Item>
278-
</div>
279-
<div className="input-field">
280-
<p>Bucket name</p>
281-
<Form.Item
282-
name="bucket_name"
283-
rules={[
284-
{
285-
required: true,
286-
message: 'Please insert bucket name'
287-
}
288-
]}
289-
initialValue={formFields?.keys?.bucket_name}
290-
>
291-
<Input
292-
placeholder="Insert your bucket name"
293-
type="text"
294-
fontSize="12px"
295-
radiusType="semi-round"
296-
colorType="black"
297-
backgroundColorType="none"
298-
borderColorType="gray"
299-
height="40px"
300-
onBlur={(e) => updateKeysState('bucket_name', e.target.value)}
301-
onChange={(e) => updateKeysState('bucket_name', e.target.value)}
302-
value={formFields.keys?.bucket_name}
303-
/>
304-
</Form.Item>
305-
</div>
306-
<div className="input-field">
307-
<p>Endpoint URL (optional)</p>
308-
<Form.Item
309-
name="url"
310-
rules={[
311-
{
312-
required: false,
313-
}
314-
]}
315-
initialValue={formFields?.keys?.url}
316-
>
317-
<Input
318-
placeholder="Insert custom S3 API endpoint url (Optional; leave empty for AWS)"
319-
type="text"
320-
fontSize="12px"
321-
radiusType="semi-round"
322-
colorType="black"
323-
backgroundColorType="none"
324-
borderColorType="gray"
325-
height="40px"
326-
onBlur={(e) => updateKeysState('url', e.target.value)}
327-
onChange={(e) => updateKeysState('url', e.target.value)}
328-
value={formFields.keys?.url}
329-
/>
330-
</Form.Item>
252+
<div className="flex-fields">
253+
<div className="input-field">
254+
<p>Region</p>
255+
<Form.Item
256+
name="region"
257+
initialValue={formFields?.keys?.region}
258+
rules={[
259+
{
260+
required: true,
261+
message: 'Please insert region'
262+
}
263+
]}
264+
>
265+
<Input
266+
type="text"
267+
placeholder="us-east-1"
268+
fontSize="12px"
269+
colorType="black"
270+
backgroundColorType="none"
271+
borderColorType="gray"
272+
radiusType="semi-round"
273+
height="40px"
274+
value={formFields?.keys?.region}
275+
onBlur={(e) => updateKeysState('region', e.target.value)}
276+
onChange={(e) => updateKeysState('region', e.target.value)}
277+
/>
278+
</Form.Item>
279+
</div>
280+
<div className="input-field">
281+
<p>Bucket name</p>
282+
<Form.Item
283+
name="bucket_name"
284+
rules={[
285+
{
286+
required: true,
287+
message: 'Please insert bucket name'
288+
}
289+
]}
290+
initialValue={formFields?.keys?.bucket_name}
291+
>
292+
<Input
293+
placeholder="Insert your bucket name"
294+
type="text"
295+
fontSize="12px"
296+
radiusType="semi-round"
297+
colorType="black"
298+
backgroundColorType="none"
299+
borderColorType="gray"
300+
height="40px"
301+
onBlur={(e) => updateKeysState('bucket_name', e.target.value)}
302+
onChange={(e) => updateKeysState('bucket_name', e.target.value)}
303+
value={formFields.keys?.bucket_name}
304+
/>
305+
</Form.Item>
306+
</div>
331307
</div>
332-
<div className="input-field">
333-
<p>Use Path Style</p>
334-
<Form.Item
335-
name="s3_path_style"
336-
rules={[
337-
{
338-
required: false,
339-
}
340-
]}
341-
initialValue={formFields?.keys?.s3_path_style}
342-
>
343-
<>
344-
<Checkbox
345-
defaultChecked={false}
346-
checkName="s3_path_style"
347-
checked={formFields.keys?.s3_path_style === "1" ? true : false}
348-
onChange={(e) => updateKeysState('s3_path_style', e.target.checked ? "1" : "0")}
349-
/> Enable
350-
</>
351-
</Form.Item>
308+
<div className="flex-fields">
309+
<div className="input-field">
310+
<p>Endpoint URL (optional)</p>
311+
<Form.Item
312+
name="url"
313+
rules={[
314+
{
315+
required: false
316+
}
317+
]}
318+
initialValue={formFields?.keys?.url}
319+
>
320+
<Input
321+
placeholder="Insert custom S3 API endpoint url (Optional; leave empty for AWS)"
322+
type="text"
323+
fontSize="12px"
324+
radiusType="semi-round"
325+
colorType="black"
326+
backgroundColorType="none"
327+
borderColorType="gray"
328+
height="40px"
329+
onBlur={(e) => updateKeysState('url', e.target.value)}
330+
onChange={(e) => updateKeysState('url', e.target.value)}
331+
value={formFields.keys?.url}
332+
/>
333+
</Form.Item>
334+
</div>
335+
<div className="input-field">
336+
<p>Use Path Style</p>
337+
<Form.Item
338+
name="s3_path_style"
339+
rules={[
340+
{
341+
required: false
342+
}
343+
]}
344+
initialValue={formFields?.keys?.s3_path_style}
345+
>
346+
<>
347+
<Checkbox
348+
defaultChecked={false}
349+
checkName="s3_path_style"
350+
checked={formFields.keys?.s3_path_style === '1' ? true : false}
351+
onChange={(e) => updateKeysState('s3_path_style', e.target.checked ? '1' : '0')}
352+
/>{' '}
353+
Enable
354+
</>
355+
</Form.Item>
356+
</div>
352357
</div>
353358
</div>
354359
<Form.Item className="button-container">
Lines changed: 0 additions & 122 deletions
Original file line numberDiff line numberDiff line change
@@ -1,123 +1 @@
1-
dynamic-integration{
2-
display: flex;
3-
flex-direction: column;
4-
height: 100%;
5-
min-height:550px;
6-
p{
7-
margin: 0;
8-
}
9-
.insideBanner{
10-
border-top-left-radius: 16px;
11-
border-top-right-radius: 16px;
12-
}
13-
form{
14-
position: relative;
15-
height: calc(100% - 455px);
16-
17-
.api-details{
18-
height: calc(100% - 62px);
19-
overflow: scroll;
20-
margin: 0 20px;
21-
margin-right: 2px;
22-
padding-right: 13px;
23-
.title{
24-
font-family: 'InterMedium';
25-
font-size: 15px;
26-
margin-top: 5px;
27-
}
28-
.api-key{
29-
margin-top: 5px;
30-
padding: 10px;
31-
padding-bottom:1px;
32-
border-radius: 8px;
33-
background-color: rgba(101, 87, 255, 0.1);
34-
p{
35-
font-family: 'InterSemiBold';
36-
font-size: 12px;
37-
color: #2C2C2C;
38-
}
39-
.desc{
40-
color: rgba(74, 73, 92, 0.8);
41-
font-size: 14px;
42-
margin-bottom:15px;
43-
}
44-
.input-component-container{
45-
padding-top:10px;
46-
.input-container input{
47-
background-color: rgba(101, 87, 255, 0.2) !important;
48-
}
49-
.ant-input::placeholder{
50-
color: rgba(46, 44, 52, 0.5)
51-
}
52-
}
53-
}
54-
.input-field{
55-
margin: 10px 0px;
56-
font-size: 13px;
57-
p{
58-
color: #1D1D1D;
59-
}
60-
.desc{
61-
color: #B4B4B4;
62-
font-size: 12px;
631

64-
}
65-
.input-component-container{
66-
margin-top: 10px;
67-
}
68-
}
69-
.notification-option{
70-
p{
71-
font-family: 'InterMedium';
72-
font-size: 15px;
73-
}
74-
.desc{
75-
color: #B4B4B4;
76-
font-size: 12px;
77-
margin-bottom:15px;
78-
}
79-
.option-wrapper{
80-
display: flex;
81-
width: 100%;
82-
height: 80px;
83-
border: 1px solid #E1E1E1;
84-
border-radius: 8px;
85-
margin:10px 0px;
86-
padding: 0px 10px;
87-
align-items: center;
88-
justify-content: space-between;
89-
.option-name{
90-
display: flex;
91-
align-items: flex-start;
92-
img{
93-
width: 35px;
94-
margin-right:10px
95-
}
96-
.name-des{
97-
padding-right:10px;
98-
p{
99-
font-family:'InterSemiBold';
100-
font-size: 14px;
101-
}
102-
span{
103-
color: #B4B4B4;
104-
font-size: 12px;
105-
}
106-
}
107-
108-
}
109-
}
110-
}
111-
}
112-
.button-wrapper{
113-
display: grid;
114-
grid-template-columns: 50% 50%;
115-
text-align: -moz-center;
116-
text-align: -webkit-center;
117-
height: 90px;
118-
align-items: center;
119-
margin: 0 20px;
120-
border-top: 1px solid #DEDEDE;
121-
}
122-
}
123-
}

ui_src/src/domain/administration/integrations/index.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@ import Loader from '../../../components/loader';
3232
import { isCloud } from '../../../services/valueConvertor';
3333

3434
const Integrations = () => {
35-
const [dispatch] = useContext(Context);
35+
const [state, dispatch] = useContext(Context);
3636
const [modalIsOpen, modalFlip] = useState(false);
3737
const [integrationRequest, setIntegrationRequest] = useState('');
3838
const [categoryFilter, setCategoryFilter] = useState('All');

0 commit comments

Comments
 (0)