Skip to content

Commit 6b8c7ef

Browse files
author
Rishichandra Wawhal
authored
console: add actions support (hasura#3889)
1 parent ff3ac78 commit 6b8c7ef

File tree

133 files changed

+9269
-2826
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

133 files changed

+9269
-2826
lines changed

Diff for: ‎console/.eslintrc

+1
Original file line numberDiff line numberDiff line change
@@ -81,6 +81,7 @@
8181
"jsx-a11y/no-autofocus": 0,
8282
"max-len": 0,
8383
"no-continue": 0,
84+
"eqeqeq": 0,
8485
"no-nested-ternary": 0
8586
},
8687
"plugins": [

Diff for: ‎console/package-lock.json

+2,323-2,534
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

Diff for: ‎console/package.json

+4-2
Original file line numberDiff line numberDiff line change
@@ -53,6 +53,8 @@
5353
}
5454
},
5555
"dependencies": {
56+
"@graphql-codegen/core": "^1.11.2",
57+
"@graphql-codegen/typescript": "^1.11.2",
5658
"apollo-link": "^1.2.2",
5759
"apollo-link-ws": "^1.0.8",
5860
"brace": "^0.11.1",
@@ -78,7 +80,7 @@
7880
"prop-types": "^15.6.0",
7981
"query-string": "^6.1.0",
8082
"react": "16.8.6",
81-
"react-ace": "^6.1.1",
83+
"react-ace": "^8.0.0",
8284
"react-autosuggest": "^9.4.3",
8385
"react-bootstrap": "^0.32.1",
8486
"react-copy-to-clipboard": "^5.0.0",
@@ -96,7 +98,6 @@
9698
"react-tabs": "^2.1.0",
9799
"react-toggle": "^4.0.2",
98100
"redux": "^4.0.0",
99-
"redux-logger": "3.0.1",
100101
"redux-thunk": "^2.2.0",
101102
"sanitize-filename": "^1.6.1",
102103
"semver": "5.5.1",
@@ -170,6 +171,7 @@
170171
"redux-devtools": "^3.4.1",
171172
"redux-devtools-dock-monitor": "^1.1.2",
172173
"redux-devtools-log-monitor": "^1.3.0",
174+
"redux-logger": "3.0.1",
173175
"resolve-url-loader": "^2.3.0",
174176
"sass-loader": "^7.0.1",
175177
"sinon": "^1.17.7",

Diff for: ‎console/src/client.js

+1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
/**
22
* THIS IS THE ENTRY POINT FOR THE CLIENT, JUST LIKE server.js IS THE ENTRY POINT FOR THE SERVER.
33
*/
4+
45
import React from 'react';
56
import ReactDOM from 'react-dom';
67
import { createLogger } from 'redux-logger';

Diff for: ‎console/src/components/Common/AceEditor/BaseEditor.js

+29
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import React from 'react';
2+
import AceEditor from 'react-ace';
3+
import { ACE_EDITOR_THEME, ACE_EDITOR_FONT_SIZE } from './utils';
4+
import 'ace-builds/src-noconflict/ext-searchbox';
5+
import 'ace-builds/src-noconflict/ext-language_tools';
6+
import 'ace-builds/src-noconflict/ext-error_marker';
7+
import 'ace-builds/src-noconflict/ext-beautify';
8+
9+
const Editor = ({ mode, ...props }) => {
10+
return (
11+
<AceEditor
12+
mode={mode}
13+
theme={ACE_EDITOR_THEME}
14+
fontSize={ACE_EDITOR_FONT_SIZE}
15+
showPrintMargine
16+
showGutter
17+
tabSize={2}
18+
setOptions={{
19+
showLineNumbers: true,
20+
enableBasicAutocompletion: true,
21+
enableSnippets: true,
22+
behavioursEnabled: true,
23+
}}
24+
{...props}
25+
/>
26+
);
27+
};
28+
29+
export default Editor;

Diff for: ‎console/src/components/Common/AceEditor/JavaScriptEditor.js

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import React from 'react';
2+
import BaseEditor from './BaseEditor';
3+
4+
const JSEditor = props => {
5+
return <BaseEditor {...props} mode="javascript" />;
6+
};
7+
8+
export default JSEditor;

Diff for: ‎console/src/components/Common/AceEditor/SDLEditor.js

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import React from 'react';
2+
import BaseEditor from './BaseEditor';
3+
4+
const SDLEditor = props => {
5+
return <BaseEditor mode="graphqlschema" {...props} />;
6+
};
7+
8+
export default SDLEditor;

Diff for: ‎console/src/components/Common/AceEditor/TypescriptEditor.js

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import React from 'react';
2+
import BaseEditor from './BaseEditor';
3+
4+
const Editor = ({ value, onChange, ...props }) => {
5+
return <BaseEditor {...props} mode="typescript" />;
6+
};
7+
8+
export default Editor;

Diff for: ‎console/src/components/Common/AceEditor/utils.js

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import 'ace-builds/src-noconflict/theme-dawn';
2+
import 'ace-builds/src-noconflict/mode-graphqlschema';
3+
import 'ace-builds/src-noconflict/mode-sql';
4+
import 'ace-builds/src-noconflict/ext-searchbox';
5+
6+
export const ACE_EDITOR_THEME = 'dawn';
7+
export const ACE_EDITOR_FONT_SIZE = 16;

Diff for: ‎console/src/components/Common/Button/Button.js

+2-2
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ import styles from '../Common.scss';
1010
*/
1111

1212
const Button = props => {
13-
const { children, size, color, className } = props;
13+
const { children, size, color, className, type = 'button' } = props;
1414
let extendedClassName = `${className || ''} btn ${
1515
size ? `btn-${size} ` : 'button '
1616
}`;
@@ -32,7 +32,7 @@ const Button = props => {
3232
break;
3333
}
3434
return (
35-
<button {...props} className={extendedClassName}>
35+
<button {...props} className={extendedClassName} type={type}>
3636
{children}
3737
</button>
3838
);

Diff for: ‎console/src/components/Common/Button/index.js

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import Button from './Button';
2+
3+
export default Button;

Diff for: ‎console/src/components/Common/Common.scss

+9
Original file line numberDiff line numberDiff line change
@@ -606,6 +606,10 @@ code {
606606
padding-top: 10px;
607607
}
608608

609+
.add_pad_top {
610+
padding-top: 20px;
611+
}
612+
609613
.padd_bottom {
610614
padding-bottom: 10px !important;
611615
}
@@ -614,6 +618,7 @@ code {
614618
padding-bottom: 20px;
615619
}
616620

621+
617622
.add_padd_bottom {
618623
padding-bottom: 25px;
619624
}
@@ -1368,6 +1373,10 @@ code {
13681373
cursor: not-allowed;
13691374
}
13701375

1376+
.hiddenMoreWidth {
1377+
width: 300px;
1378+
}
1379+
13711380
/* container height subtracting top header and bottom scroll bar */
13721381
$mainContainerHeight: calc(100vh - 50px - 25px);
13731382

Diff for: ‎console/src/components/Common/Headers/Headers.js

+88
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
import React from 'react';
2+
import styles from './Headers.scss';
3+
import DropdownButton from '../DropdownButton/DropdownButton';
4+
import { addPlaceholderHeader } from './utils';
5+
6+
const Headers = ({ headers, setHeaders }) => {
7+
return headers.map(({ name, value, type }, i) => {
8+
const setHeaderType = e => {
9+
const newHeaders = JSON.parse(JSON.stringify(headers));
10+
newHeaders[i].type = e.target.getAttribute('value');
11+
addPlaceholderHeader(newHeaders);
12+
setHeaders(newHeaders);
13+
};
14+
15+
const setHeaderKey = e => {
16+
const newHeaders = JSON.parse(JSON.stringify(headers));
17+
newHeaders[i].name = e.target.value;
18+
addPlaceholderHeader(newHeaders);
19+
setHeaders(newHeaders);
20+
};
21+
22+
const setHeaderValue = e => {
23+
const newHeaders = JSON.parse(JSON.stringify(headers));
24+
newHeaders[i].value = e.target.value;
25+
addPlaceholderHeader(newHeaders);
26+
setHeaders(newHeaders);
27+
};
28+
29+
const removeHeader = () => {
30+
const newHeaders = JSON.parse(JSON.stringify(headers));
31+
setHeaders([...newHeaders.slice(0, i), ...newHeaders.slice(i + 1)]);
32+
};
33+
34+
const getHeaderNameInput = () => {
35+
return (
36+
<input
37+
value={name}
38+
onChange={setHeaderKey}
39+
placeholder="key"
40+
className={`form-control ${styles.add_mar_right} ${styles.headerInputWidth}`}
41+
/>
42+
);
43+
};
44+
45+
const getHeaderValueInput = () => {
46+
return (
47+
<div className={styles.headerInputWidth}>
48+
<DropdownButton
49+
dropdownOptions={[
50+
{ display_text: 'Value', value: 'static' },
51+
{ display_text: 'From env var', value: 'env' },
52+
]}
53+
title={type === 'env' ? 'From env var' : 'Value'}
54+
dataKey={type === 'env' ? 'env' : 'static'}
55+
onButtonChange={setHeaderType}
56+
onInputChange={setHeaderValue}
57+
required
58+
bsClass={styles.dropdown_button}
59+
inputVal={value}
60+
id={`header-value-${i}`}
61+
inputPlaceHolder={type === 'env' ? 'HEADER_FROM_ENV' : 'value'}
62+
testId={`header-value-${i}`}
63+
/>
64+
</div>
65+
);
66+
};
67+
68+
const getRemoveButton = () => {
69+
if (i === headers.length - 1) return null;
70+
return (
71+
<i
72+
className={`${styles.fontAwosomeClose} fa-lg fa fa-times`}
73+
onClick={removeHeader}
74+
/>
75+
);
76+
};
77+
78+
return (
79+
<div className={`${styles.display_flex} ${styles.add_mar_bottom_mid}`}>
80+
{getHeaderNameInput()}
81+
{getHeaderValueInput()}
82+
{getRemoveButton()}
83+
</div>
84+
);
85+
});
86+
};
87+
88+
export default Headers;

Diff for: ‎console/src/components/Common/Headers/Headers.scss

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
@import "../Common.scss";
2+
3+
.headerInputWidth {
4+
width: 300px
5+
}

Diff for: ‎console/src/components/Common/Headers/utils.js

+50
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
const emptyHeader = {
2+
name: '',
3+
value: '',
4+
type: 'static',
5+
};
6+
7+
export const transformHeaders = (headers = []) => {
8+
return headers
9+
.map(h => {
10+
const transformedHeader = {
11+
name: h.name,
12+
};
13+
if (h.type === 'static') {
14+
transformedHeader.value = h.value;
15+
} else {
16+
transformedHeader.value_from_env = h.value;
17+
}
18+
return transformedHeader;
19+
})
20+
.filter(h => !!h.name && (!!h.value || !!h.value_from_env));
21+
};
22+
23+
export const addPlaceholderHeader = newHeaders => {
24+
if (newHeaders.length) {
25+
const lastHeader = newHeaders[newHeaders.length - 1];
26+
if (lastHeader.name && lastHeader.value) {
27+
newHeaders.push(emptyHeader);
28+
}
29+
} else {
30+
newHeaders.push(emptyHeader);
31+
}
32+
return newHeaders;
33+
};
34+
35+
export const parseServerHeaders = (headers = []) => {
36+
return addPlaceholderHeader(
37+
headers.map(h => {
38+
const parsedHeader = {
39+
name: h.name,
40+
value: h.value,
41+
type: 'static',
42+
};
43+
if (h.value_from_env) {
44+
parsedHeader.value = h.value_from_env;
45+
parsedHeader.type = 'env';
46+
}
47+
return parsedHeader;
48+
})
49+
);
50+
};

Diff for: ‎console/src/components/Common/HiddenMore/HiddenMore.js

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
import React from 'react';
2+
import styles from '../Common.scss';
3+
4+
const HiddenMore = ({ title, more, expanded = false }) => {
5+
const [isExpanded, setIsExpanded] = React.useState(expanded);
6+
7+
const toggle = () => setIsExpanded(!isExpanded);
8+
9+
const getTitle = () => {
10+
return (
11+
<div
12+
className={`${styles.display_flex} ${styles.add_mar_bottom} ${styles.cursorPointer} ${styles.hiddenMoreWidth}`}
13+
onClick={toggle}
14+
>
15+
<i
16+
className={`fa fa-chevron-${isExpanded ? 'down' : 'right'} ${
17+
styles.add_mar_right_small
18+
}`}
19+
aria-hidden="true"
20+
/>
21+
<b>{title}</b>
22+
</div>
23+
);
24+
};
25+
26+
return (
27+
<div>
28+
{getTitle()}
29+
{isExpanded && more}
30+
</div>
31+
);
32+
};
33+
34+
export default HiddenMore;

Diff for: ‎console/src/components/Common/HiddenMore/index.js

+3
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
import HiddenMore from './HiddenMore';
2+
3+
export default HiddenMore;

Diff for: ‎console/src/components/Common/Icons/Copy.js

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import React from 'react';
2+
3+
const Copy = ({ className }) => {
4+
return <i className={`fa fa-copy ${className || ''}`} aria-hidden="true" />;
5+
};
6+
7+
export default Copy;

Diff for: ‎console/src/components/Common/Icons/Remove.js

+12
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import React from 'react';
2+
import styles from '../Common.scss';
3+
4+
const RemoveIcon = ({ className, ...props }) => (
5+
<i
6+
className={`${styles.fontAwosomeClose} fa-lg fa fa-times ${className ||
7+
''}`}
8+
{...props}
9+
/>
10+
);
11+
12+
export default RemoveIcon;

0 commit comments

Comments
 (0)