232 | );
233 | }
234 |
235 | export default PoliciesEditor;
236 |
--------------------------------------------------------------------------------
/ui/src/components/RollupRuleEditor.js:
--------------------------------------------------------------------------------
1 | // Copyright (c) 2017 Uber Technologies, Inc.
2 | //
3 | // Permission is hereby granted, free of charge, to any person obtaining a copy
4 | // of this software and associated documentation files (the "Software"), to deal
5 | // in the Software without restriction, including without limitation the rights
6 | // to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
7 | // copies of the Software, and to permit persons to whom the Software is
8 | // furnished to do so, subject to the following conditions:
9 | //
10 | // The above copyright notice and this permission notice shall be included in
11 | // all copies or substantial portions of the Software.
12 | //
13 | // THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
14 | // IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
15 | // FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
16 | // AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
17 | // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
18 | // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
19 | // THE SOFTWARE.
20 |
21 | import React from 'react';
22 | import {Button, Input, Form, Icon, Select, Card, Tag} from 'antd';
23 | import {toClass} from 'recompose';
24 | import _ from 'lodash';
25 | import {withFormik} from 'formik';
26 | import * as util from 'utils';
27 | import PoliciesEditor from './PolicyEditor';
28 | import {filterPoliciesBasedOnTag} from 'utils';
29 | import {getHelpText} from 'utils/helpText';
30 | import HelpTooltip from './HelpTooltip';
31 |
32 | // @TODO Move to config service
33 | const REQUIRED_TAGS = ['dc', 'env', 'service', 'type'];
34 |
35 | const FormItem = Form.Item;
36 | const formItemLayout = {
37 | labelCol: {
38 | xs: {span: 24},
39 | sm: {span: 4},
40 | },
41 | wrapperCol: {
42 | xs: {span: 24},
43 | sm: {span: 18},
44 | },
45 | };
46 |
47 | function removeRequiredTags(tags, requiredTags) {
48 | return _.filter(tags, t => !_.includes(requiredTags, t));
49 | }
50 |
51 | function addRequiredTags(tags, requiredTags) {
52 | return _.concat(tags, requiredTags);
53 | }
54 |
55 | function RollupRuleEditor({values, handleChange, handleSubmit, setFieldValue}) {
56 | const typeTag = util.getTypeTag(values.filter);
57 | return (
58 |
121 | );
122 | }
123 |
124 | const TargetsEditorBase = props => {
125 | const {value: targets = [], onChange, typeTag} = props;
126 | const handleChange = (index, property, newValue) => {
127 | targets[index][property] = newValue;
128 | onChange(targets);
129 | };
130 | return (
131 |
189 | );
190 | };
191 | const TargetsEditor = toClass(TargetsEditorBase);
192 |
193 | export default withFormik({
194 | enableReinitialize: true,
195 | mapPropsToValues: ({rollupRule}) => {
196 | return rollupRule || {};
197 | },
198 | handleSubmit: (values, {props}) => {
199 | props.onSubmit({
200 | ...values,
201 | targets: _.map(values.targets, target => {
202 | return {
203 | ...target,
204 | tags: _.union(target.tags, REQUIRED_TAGS),
205 | };
206 | }),
207 | });
208 | },
209 | })(RollupRuleEditor);
210 |
--------------------------------------------------------------------------------
/ui/src/components/RollupRulesTable.js:
--------------------------------------------------------------------------------
1 | // Copyright (c) 2017 Uber Technologies, Inc.
2 | //
3 | // Permission is hereby granted, free of charge, to any person obtaining a copy
4 | // of this software and associated documentation files (the "Software"), to deal
5 | // in the Software without restriction, including without limitation the rights
6 | // to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
7 | // copies of the Software, and to permit persons to whom the Software is
8 | // furnished to do so, subject to the following conditions:
9 | //
10 | // The above copyright notice and this permission notice shall be included in
11 | // all copies or substantial portions of the Software.
12 | //
13 | // THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
14 | // IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
15 | // FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
16 | // AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
17 | // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
18 | // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
19 | // THE SOFTWARE.
20 |
21 | import React from 'react';
22 | import {Table, Popover, Tag} from 'antd';
23 | import _ from 'lodash';
24 |
25 | import RollupRuleEditor from 'components/RollupRuleEditor';
26 | import TableActions from './TableActions';
27 | import HelpTooltip from './HelpTooltip';
28 | import {compose} from 'recompose';
29 | import {connectR2API} from 'hocs';
30 | import {formatTimestampMilliseconds} from 'utils';
31 |
32 | const {Column} = Table;
33 |
34 | function TargetPreview({target}) {
35 | const content = (
36 |
192 | );
193 | }
194 |
195 | export default RollupRulesTable;
196 |
--------------------------------------------------------------------------------
/ui/src/components/TableActions.js:
--------------------------------------------------------------------------------
1 | // Copyright (c) 2017 Uber Technologies, Inc.
2 | //
3 | // Permission is hereby granted, free of charge, to any person obtaining a copy
4 | // of this software and associated documentation files (the "Software"), to deal
5 | // in the Software without restriction, including without limitation the rights
6 | // to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
7 | // copies of the Software, and to permit persons to whom the Software is
8 | // furnished to do so, subject to the following conditions:
9 | //
10 | // The above copyright notice and this permission notice shall be included in
11 | // all copies or substantial portions of the Software.
12 | //
13 | // THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
14 | // IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
15 | // FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
16 | // AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
17 | // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
18 | // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
19 | // THE SOFTWARE.
20 |
21 | import React from 'react';
22 | import {Icon, Popconfirm, Tooltip} from 'antd';
23 |
24 | function TableActions(props) {
25 | const {
26 | onDeleteClicked,
27 | onEditClicked,
28 | onHistoryClicked = noop => noop,
29 | } = props;
30 | return (
31 |
54 | );
55 | }
56 |
57 | export default TableActions;
58 |
--------------------------------------------------------------------------------
/ui/src/hocs/api.js:
--------------------------------------------------------------------------------
1 | // Copyright (c) 2017 Uber Technologies, Inc.
2 | //
3 | // Permission is hereby granted, free of charge, to any person obtaining a copy
4 | // of this software and associated documentation files (the "Software"), to deal
5 | // in the Software without restriction, including without limitation the rights
6 | // to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
7 | // copies of the Software, and to permit persons to whom the Software is
8 | // furnished to do so, subject to the following conditions:
9 | //
10 | // The above copyright notice and this permission notice shall be included in
11 | // all copies or substantial portions of the Software.
12 | //
13 | // THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
14 | // IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
15 | // FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
16 | // AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
17 | // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
18 | // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
19 | // THE SOFTWARE.
20 |
21 | import React from 'react';
22 | import {message} from 'antd';
23 | import NProgress from 'nprogress';
24 | import _ from 'lodash';
25 | import {connect} from 'react-refetch';
26 |
27 | const BASE_URL = '/r2/v1';
28 | function getErrorMessage(errorMessage) {
29 | return (
30 |
31 | {errorMessage}
32 |
33 | );
34 | }
35 | function customFetch(mapping) {
36 | const meta = _.get(mapping, 'meta', {});
37 | if (meta.loadingMessage || meta.successMessage) {
38 | message.destroy();
39 | message.loading(
40 | _.isString(meta.loadingMessage) ? meta.loadingMessage : 'Loading...',
41 | 0,
42 | );
43 | }
44 | const options = {
45 | method: mapping.method,
46 | cache: 'force-cache',
47 | headers: mapping.headers,
48 | credentials: mapping.credentials,
49 | redirect: mapping.redirect,
50 | body: JSON.stringify(mapping.body),
51 | };
52 | const req = new Request(BASE_URL + mapping.url, options);
53 |
54 | NProgress.start();
55 | return fetch(req).then(response => {
56 | NProgress.done();
57 | if (!response.ok) {
58 | const clonedResponse = response.clone();
59 | clonedResponse.json().then(t => {
60 | message.destroy();
61 | message.error(getErrorMessage(`[${response.status}] ${t.message}`), 5);
62 | });
63 | } else if (meta.successMessage) {
64 | message.destroy();
65 | message.success(
66 | getErrorMessage(
67 | _.isString(meta.successMessage) ? meta.successMessage : 'Success!',
68 | ),
69 | 1,
70 | );
71 | }
72 | return response;
73 | });
74 | }
75 |
76 | export const connectR2API = connect.defaults({
77 | fetch: customFetch,
78 | refetching: true,
79 | force: true,
80 | buildRequest: mapping => mapping,
81 | });
82 |
--------------------------------------------------------------------------------
/ui/src/hocs/filter.js:
--------------------------------------------------------------------------------
1 | import _ from 'lodash';
2 | import {withProps, withHandlers, compose} from 'recompose';
3 | import qs from 'query-string';
4 |
5 | export const withFilter = ({
6 | propMapper,
7 | propName,
8 | propField,
9 | queryParam = 'q',
10 | filterPropName = 'filter',
11 | filterChangeHandlerName = 'setFilter',
12 | }) => {
13 | return compose(
14 | withProps(props => {
15 | const prop = propMapper(props);
16 | const filter = qs.parse(props.location.search.replace('?', ''))[
17 | queryParam
18 | ];
19 |
20 | return {
21 | [filterPropName]: filter,
22 | [propName]: _.isEmpty(filter)
23 | ? prop
24 | : _.filter(prop, n => n[propField].indexOf(filter) !== -1),
25 | };
26 | }),
27 | withHandlers({
28 | [filterChangeHandlerName]: props => filter => {
29 | props.history.replace({
30 | pathname: window.location.pathname,
31 | search: filter ? `?${queryParam}=${filter}` : '',
32 | });
33 | },
34 | }),
35 | );
36 | };
37 |
--------------------------------------------------------------------------------
/ui/src/hocs/index.js:
--------------------------------------------------------------------------------
1 | // Copyright (c) 2017 Uber Technologies, Inc.
2 | //
3 | // Permission is hereby granted, free of charge, to any person obtaining a copy
4 | // of this software and associated documentation files (the "Software"), to deal
5 | // in the Software without restriction, including without limitation the rights
6 | // to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
7 | // copies of the Software, and to permit persons to whom the Software is
8 | // furnished to do so, subject to the following conditions:
9 | //
10 | // The above copyright notice and this permission notice shall be included in
11 | // all copies or substantial portions of the Software.
12 | //
13 | // THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
14 | // IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
15 | // FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
16 | // AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
17 | // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
18 | // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
19 | // THE SOFTWARE.
20 |
21 | export * from './promiseState';
22 | export * from './api';
23 | export * from './filter';
24 |
--------------------------------------------------------------------------------
/ui/src/hocs/promiseState.js:
--------------------------------------------------------------------------------
1 | // Copyright (c) 2017 Uber Technologies, Inc.
2 | //
3 | // Permission is hereby granted, free of charge, to any person obtaining a copy
4 | // of this software and associated documentation files (the "Software"), to deal
5 | // in the Software without restriction, including without limitation the rights
6 | // to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
7 | // copies of the Software, and to permit persons to whom the Software is
8 | // furnished to do so, subject to the following conditions:
9 | //
10 | // The above copyright notice and this permission notice shall be included in
11 | // all copies or substantial portions of the Software.
12 | //
13 | // THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
14 | // IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
15 | // FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
16 | // AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
17 | // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
18 | // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
19 | // THE SOFTWARE.
20 |
21 | import {lifecycle} from 'recompose';
22 | import {PromiseState} from 'react-refetch';
23 | import _ from 'lodash';
24 |
25 | export function withPromiseStateChangeCallback(keys, fn) {
26 | return lifecycle({
27 | componentDidUpdate(prevProps) {
28 | const props = this.props;
29 | const filteredProps = keys ? _.pick(props, keys) : props;
30 | _.forEach(filteredProps, (prop, propName) => {
31 | if (prop instanceof PromiseState) {
32 | const promiseState = prop;
33 | const prevPromiseState = prevProps[propName];
34 | // Dont do anything
35 | if (
36 | prevPromiseState &&
37 | (prevPromiseState.pending !== promiseState.pending ||
38 | prevPromiseState.refreshing !== promiseState.refreshing)
39 | ) {
40 | fn(props);
41 | }
42 | }
43 | });
44 | },
45 | });
46 | }
47 |
48 | export default {
49 | withPromiseStateChangeCallback,
50 | };
51 |
--------------------------------------------------------------------------------
/ui/src/index.css:
--------------------------------------------------------------------------------
1 | body {
2 | margin: 0;
3 | padding: 0;
4 | }
5 |
6 | #root {
7 | height: 100%
8 | }
9 |
10 | .ant-form-item-control {
11 | line-height: inherit
12 | }
--------------------------------------------------------------------------------
/ui/src/index.js:
--------------------------------------------------------------------------------
1 | // Copyright (c) 2017 Uber Technologies, Inc.
2 | //
3 | // Permission is hereby granted, free of charge, to any person obtaining a copy
4 | // of this software and associated documentation files (the "Software"), to deal
5 | // in the Software without restriction, including without limitation the rights
6 | // to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
7 | // copies of the Software, and to permit persons to whom the Software is
8 | // furnished to do so, subject to the following conditions:
9 | //
10 | // The above copyright notice and this permission notice shall be included in
11 | // all copies or substantial portions of the Software.
12 | //
13 | // THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
14 | // IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
15 | // FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
16 | // AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
17 | // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
18 | // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
19 | // THE SOFTWARE.
20 |
21 | import React from 'react';
22 | import ReactDOM from 'react-dom';
23 | import {
24 | BrowserRouter as Router,
25 | Route,
26 | Link,
27 | withRouter,
28 | matchPath,
29 | Redirect,
30 | } from 'react-router-dom';
31 | import {Layout, Menu, Icon, LocaleProvider} from 'antd';
32 | import enUS from 'antd/lib/locale-provider/en_US';
33 |
34 | import 'antd/dist/antd.css';
35 | import 'basscss/css/basscss.css';
36 | import 'nprogress/nprogress.css';
37 | import './index.css';
38 |
39 | import NamespacesPage from 'pages/Namespaces';
40 | import NamespacePage from 'pages/Namespace';
41 | const {Sider, Content} = Layout;
42 |
43 | const MenuSideBar = withRouter(({location}) => {
44 | let selectedKey;
45 | if (
46 | matchPath(location.pathname, {
47 | path: '/namespaces',
48 | })
49 | ) {
50 | selectedKey = 'namespaces';
51 | }
52 |
53 | return (
54 |
67 | );
68 | });
69 |
70 | function AppContainer() {
71 | return (
72 |
73 |
74 |
75 |
76 |
77 |
78 |
79 |
86 |
87 |
88 |
93 |
94 | }
98 | />
99 |
100 |
101 |
102 |
103 |
104 | );
105 | }
106 |
107 | ReactDOM.render(, document.getElementById('root'));
108 |
--------------------------------------------------------------------------------
/ui/src/pages/Namespace.js:
--------------------------------------------------------------------------------
1 | // Copyright (c) 2017 Uber Technologies, Inc.
2 | //
3 | // Permission is hereby granted, free of charge, to any person obtaining a copy
4 | // of this software and associated documentation files (the "Software"), to deal
5 | // in the Software without restriction, including without limitation the rights
6 | // to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
7 | // copies of the Software, and to permit persons to whom the Software is
8 | // furnished to do so, subject to the following conditions:
9 | //
10 | // The above copyright notice and this permission notice shall be included in
11 | // all copies or substantial portions of the Software.
12 | //
13 | // THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
14 | // IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
15 | // FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
16 | // AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
17 | // LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
18 | // OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
19 | // THE SOFTWARE.
20 |
21 | import React from 'react';
22 | import {Breadcrumb, Card, Tabs, Button, Modal, Input} from 'antd';
23 | import {Link} from 'react-router-dom';
24 | import _ from 'lodash';
25 | import {compose, withProps, withReducer} from 'recompose';
26 | import {connectR2API, withPromiseStateChangeCallback, withFilter} from 'hocs';
27 | import MappingRuleEditor from 'components/MappingRuleEditor';
28 | import MappingRulesTable from 'components/MappingRulesTable';
29 | import RollupRuleEditor from 'components/RollupRuleEditor';
30 | import RollupRulesTable from 'components/RollupRulesTable';
31 | import {getHelpText} from 'utils/helpText';
32 |
33 | const TabPane = Tabs.TabPane;
34 |
35 | function Namespace(props) {
36 | const {namespaceID, mappingRules, rollupRules, loading} = props;
37 | return (
38 |