diff --git a/kafka-ui-react-app/package.json b/kafka-ui-react-app/package.json index 58ad6095c9..f2eb3558c1 100644 --- a/kafka-ui-react-app/package.json +++ b/kafka-ui-react-app/package.json @@ -21,7 +21,6 @@ "react-datepicker": "^3.7.0", "react-dom": "^17.0.1", "react-hook-form": "^6.15.5", - "react-json-tree": "^0.15.0", "react-multi-select-component": "^4.0.0", "react-redux": "^7.2.2", "react-router": "^5.2.0", diff --git a/kafka-ui-react-app/src/components/ConsumerGroups/Details/Details.tsx b/kafka-ui-react-app/src/components/ConsumerGroups/Details/Details.tsx index f32ad6e678..c1ae9a1639 100644 --- a/kafka-ui-react-app/src/components/ConsumerGroups/Details/Details.tsx +++ b/kafka-ui-react-app/src/components/ConsumerGroups/Details/Details.tsx @@ -54,30 +54,28 @@ const Details: React.FC = ({ {isFetched ? (
-
- - - - - - - - - - - - - - {items.map((consumer) => ( - - ))} - -
Consumer IDHostTopicPartitionMessages behindCurrent offsetEnd offset
-
+ + + + + + + + + + + + + + {items.map((consumer) => ( + + ))} + +
Consumer IDHostTopicPartitionMessages behindCurrent offsetEnd offset
) : ( diff --git a/kafka-ui-react-app/src/components/ConsumerGroups/List/List.tsx b/kafka-ui-react-app/src/components/ConsumerGroups/List/List.tsx index 3d1b6a25a4..0dc5c84adb 100644 --- a/kafka-ui-react-app/src/components/ConsumerGroups/List/List.tsx +++ b/kafka-ui-react-app/src/components/ConsumerGroups/List/List.tsx @@ -37,31 +37,29 @@ const List: React.FC = ({ consumerGroups }) => { /> -
- - - - - - - - - - {consumerGroups - .filter( - (consumerGroup) => - !searchText || - consumerGroup?.consumerGroupId?.indexOf(searchText) >= 0 - ) - .map((consumerGroup) => ( - - ))} - -
Consumer group IDNum of consumersNum of topics
-
+ + + + + + + + + + {consumerGroups + .filter( + (consumerGroup) => + !searchText || + consumerGroup?.consumerGroupId?.indexOf(searchText) >= 0 + ) + .map((consumerGroup) => ( + + ))} + +
Consumer group IDNum of consumersNum of topics
) : ( 'No active consumer groups' diff --git a/kafka-ui-react-app/src/components/Schemas/Details/Details.tsx b/kafka-ui-react-app/src/components/Schemas/Details/Details.tsx index dbeda4843f..e1fd0161d5 100644 --- a/kafka-ui-react-app/src/components/Schemas/Details/Details.tsx +++ b/kafka-ui-react-app/src/components/Schemas/Details/Details.tsx @@ -112,22 +112,20 @@ const Details: React.FC = ({
-
- - - - - - - - - - {versions.map((version) => ( - - ))} - -
VersionIDSchema
-
+ + + + + + + + + + {versions.map((version) => ( + + ))} + +
VersionIDSchema
) : ( diff --git a/kafka-ui-react-app/src/components/Schemas/Details/LatestVersionItem.tsx b/kafka-ui-react-app/src/components/Schemas/Details/LatestVersionItem.tsx index 973d091d9d..70f405af4e 100644 --- a/kafka-ui-react-app/src/components/Schemas/Details/LatestVersionItem.tsx +++ b/kafka-ui-react-app/src/components/Schemas/Details/LatestVersionItem.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { SchemaSubject } from 'generated-sources'; -import JSONViewer from 'components/common/JSONViewer/JSONViewer'; +import JSONEditor from 'components/common/JSONEditor/JSONEditor'; interface LatestVersionProps { schema: SchemaSubject; @@ -12,29 +12,32 @@ const LatestVersionItem: React.FC = ({
-
- - - - - - - - - - - - - - - -
ID{id}
Subject{subject}
Compatibility{compatibilityLevel}
-
+ + + + + + + + + + + + + + + +
ID{id}
Subject{subject}
Compatibility{compatibilityLevel}
-
- +
+
diff --git a/kafka-ui-react-app/src/components/Schemas/Details/SchemaVersion.tsx b/kafka-ui-react-app/src/components/Schemas/Details/SchemaVersion.tsx index e71c71e20a..61ee2025c9 100644 --- a/kafka-ui-react-app/src/components/Schemas/Details/SchemaVersion.tsx +++ b/kafka-ui-react-app/src/components/Schemas/Details/SchemaVersion.tsx @@ -1,6 +1,6 @@ import React from 'react'; import { SchemaSubject } from 'generated-sources'; -import JSONViewer from 'components/common/JSONViewer/JSONViewer'; +import JSONEditor from 'components/common/JSONEditor/JSONEditor'; interface SchemaVersionProps { version: SchemaSubject; @@ -13,8 +13,13 @@ const SchemaVersion: React.FC = ({ {version} {id} - - + + ); diff --git a/kafka-ui-react-app/src/components/Schemas/Details/__test__/LatestVersionItem.spec.tsx b/kafka-ui-react-app/src/components/Schemas/Details/__test__/LatestVersionItem.spec.tsx index 7b45d0fff0..0e0aff8cea 100644 --- a/kafka-ui-react-app/src/components/Schemas/Details/__test__/LatestVersionItem.spec.tsx +++ b/kafka-ui-react-app/src/components/Schemas/Details/__test__/LatestVersionItem.spec.tsx @@ -10,7 +10,7 @@ describe('LatestVersionItem', () => { expect(wrapper.find('table').length).toEqual(1); expect(wrapper.find('td').at(1).text()).toEqual('1'); - expect(wrapper.exists('JSONViewer')).toBeTruthy(); + expect(wrapper.exists('JSONEditor')).toBeTruthy(); }); it('matches snapshot', () => { diff --git a/kafka-ui-react-app/src/components/Schemas/Details/__test__/SchemaVersion.spec.tsx b/kafka-ui-react-app/src/components/Schemas/Details/__test__/SchemaVersion.spec.tsx index 4e817692e6..84fce9f29b 100644 --- a/kafka-ui-react-app/src/components/Schemas/Details/__test__/SchemaVersion.spec.tsx +++ b/kafka-ui-react-app/src/components/Schemas/Details/__test__/SchemaVersion.spec.tsx @@ -9,7 +9,7 @@ describe('SchemaVersion', () => { const wrapper = shallow(); expect(wrapper.find('td').length).toEqual(3); - expect(wrapper.exists('JSONViewer')).toBeTruthy(); + expect(wrapper.exists('JSONEditor')).toBeTruthy(); }); it('matches snapshot', () => { diff --git a/kafka-ui-react-app/src/components/Schemas/Details/__test__/__snapshots__/Details.spec.tsx.snap b/kafka-ui-react-app/src/components/Schemas/Details/__test__/__snapshots__/Details.spec.tsx.snap index 566ec68ba3..4eb2a9a100 100644 --- a/kafka-ui-react-app/src/components/Schemas/Details/__test__/__snapshots__/Details.spec.tsx.snap +++ b/kafka-ui-react-app/src/components/Schemas/Details/__test__/__snapshots__/Details.spec.tsx.snap @@ -94,28 +94,24 @@ exports[`Details View Initial state matches snapshot 1`] = `
-
- - - - - - - - - -
- Version - - ID - - Schema -
-
+ + + + Version + + + ID + + + Schema + + + + +
`; @@ -238,55 +234,51 @@ exports[`Details View when page with schema versions loaded when schema has vers
-
- - - - - - - - - - + + + + + + + + - + - -
- Version - - ID - - Schema -
+ Version + + ID + + Schema +
-
+ } + /> + +
`; @@ -385,28 +377,24 @@ exports[`Details View when page with schema versions loaded when versions are em
-
- - - - - - - - - -
- Version - - ID - - Schema -
-
+ + + + Version + + + ID + + + Schema + + + + +
`; diff --git a/kafka-ui-react-app/src/components/Schemas/Details/__test__/__snapshots__/LatestVersionItem.spec.tsx.snap b/kafka-ui-react-app/src/components/Schemas/Details/__test__/__snapshots__/LatestVersionItem.spec.tsx.snap index 6fe72c8211..702748ee84 100644 --- a/kafka-ui-react-app/src/components/Schemas/Details/__test__/__snapshots__/LatestVersionItem.spec.tsx.snap +++ b/kafka-ui-react-app/src/components/Schemas/Details/__test__/__snapshots__/LatestVersionItem.spec.tsx.snap @@ -10,62 +10,59 @@ exports[`LatestVersionItem matches snapshot 1`] = `
-
- - - - - - - - - - - - - - - -
- ID - - 1 -
- Subject - - test -
- Compatibility - - BACKWARD -
-
+ + + + ID + + + 1 + + + + + Subject + + + test + + + + + Compatibility + + + BACKWARD + + + +
-
diff --git a/kafka-ui-react-app/src/components/Schemas/Details/__test__/__snapshots__/SchemaVersion.spec.tsx.snap b/kafka-ui-react-app/src/components/Schemas/Details/__test__/__snapshots__/SchemaVersion.spec.tsx.snap index 7c578c09dd..6ba75801dd 100644 --- a/kafka-ui-react-app/src/components/Schemas/Details/__test__/__snapshots__/SchemaVersion.spec.tsx.snap +++ b/kafka-ui-react-app/src/components/Schemas/Details/__test__/__snapshots__/SchemaVersion.spec.tsx.snap @@ -8,23 +8,22 @@ exports[`SchemaVersion matches snapshot 1`] = ` 1 - - + diff --git a/kafka-ui-react-app/src/components/Schemas/Edit/Edit.tsx b/kafka-ui-react-app/src/components/Schemas/Edit/Edit.tsx index d99f2aa2eb..37674a825c 100644 --- a/kafka-ui-react-app/src/components/Schemas/Edit/Edit.tsx +++ b/kafka-ui-react-app/src/components/Schemas/Edit/Edit.tsx @@ -1,16 +1,16 @@ -import Breadcrumb from 'components/common/Breadcrumb/Breadcrumb'; +import React from 'react'; +import { useHistory } from 'react-router'; +import { useForm, Controller } from 'react-hook-form'; import { CompatibilityLevelCompatibilityEnum, SchemaSubject, SchemaType, } from 'generated-sources'; import { clusterSchemaPath, clusterSchemasPath } from 'lib/paths'; -import React from 'react'; import { ClusterName, NewSchemaSubjectRaw, SchemaName } from 'redux/interfaces'; import PageLoader from 'components/common/PageLoader/PageLoader'; -import { useHistory } from 'react-router'; import JSONEditor from 'components/common/JSONEditor/JSONEditor'; -import { useForm } from 'react-hook-form'; +import Breadcrumb from 'components/common/Breadcrumb/Breadcrumb'; export interface EditProps { subject: SchemaName; @@ -143,17 +143,24 @@ const Edit = ({

Latest Schema

New Schema

- ( + + )} />
diff --git a/kafka-ui-react-app/src/components/Schemas/Edit/__tests__/Edit.spec.tsx b/kafka-ui-react-app/src/components/Schemas/Edit/__tests__/Edit.spec.tsx index ad9205c6f0..5bd676e330 100644 --- a/kafka-ui-react-app/src/components/Schemas/Edit/__tests__/Edit.spec.tsx +++ b/kafka-ui-react-app/src/components/Schemas/Edit/__tests__/Edit.spec.tsx @@ -54,7 +54,10 @@ describe('Edit Component', () => { expect(component).toMatchSnapshot(); }); it('shows editor', () => { - expect(component.find('JSONEditor').length).toEqual(2); + expect(component.find('JSONEditor[name="latestSchema"]').length).toEqual( + 1 + ); + expect(component.find('Controller[name="newSchema"]').length).toEqual(1); expect(component.find('button').exists()).toBeTruthy(); }); it('does not fetch them', () => { diff --git a/kafka-ui-react-app/src/components/Schemas/Edit/__tests__/__snapshots__/Edit.spec.tsx.snap b/kafka-ui-react-app/src/components/Schemas/Edit/__tests__/__snapshots__/Edit.spec.tsx.snap index 290e3612ae..d7287b0de3 100644 --- a/kafka-ui-react-app/src/components/Schemas/Edit/__tests__/__snapshots__/Edit.spec.tsx.snap +++ b/kafka-ui-react-app/src/components/Schemas/Edit/__tests__/__snapshots__/Edit.spec.tsx.snap @@ -143,8 +143,9 @@ exports[`Edit Component when schemas are fetched matches the snapshot 1`] = ` Latest Schema New Schema - diff --git a/kafka-ui-react-app/src/components/Schemas/List/List.tsx b/kafka-ui-react-app/src/components/Schemas/List/List.tsx index 9516e8c3b4..fd7abd0085 100644 --- a/kafka-ui-react-app/src/components/Schemas/List/List.tsx +++ b/kafka-ui-react-app/src/components/Schemas/List/List.tsx @@ -49,27 +49,25 @@ const List: React.FC = ({ ) : (
-
- - +
+ + + + + + + + + {schemas.length === 0 && ( - - - + - - - {schemas.length === 0 && ( - - - - )} - {schemas.map((subject) => ( - - ))} - -
Schema NameVersionCompatibility
Schema NameVersionCompatibilityNo schemas found
No schemas found
-
+ )} + {schemas.map((subject) => ( + + ))} + +
)} diff --git a/kafka-ui-react-app/src/components/Topics/List/List.tsx b/kafka-ui-react-app/src/components/Topics/List/List.tsx index 31bd9500c6..54d4b7854a 100644 --- a/kafka-ui-react-app/src/components/Topics/List/List.tsx +++ b/kafka-ui-react-app/src/components/Topics/List/List.tsx @@ -88,36 +88,34 @@ const List: React.FC = ({ ) : (
-
- - +
+ + + + + + + + + + + {items.map((topic) => ( + + ))} + {items.length === 0 && ( - - - - - + - - - {items.map((topic) => ( - - ))} - {items.length === 0 && ( - - - - )} - -
Topic NameTotal PartitionsOut of sync replicasType
Topic NameTotal PartitionsOut of sync replicasType No topics found
No topics found
- -
+ )} + + +
)} diff --git a/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/MessageItem.tsx b/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/MessageItem.tsx index f5ddcd86f1..f6dc39a292 100644 --- a/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/MessageItem.tsx +++ b/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/MessageItem.tsx @@ -1,10 +1,9 @@ import React from 'react'; import { format } from 'date-fns'; import { TopicMessage } from 'generated-sources'; -import JSONViewer from 'components/common/JSONViewer/JSONViewer'; -import { isObject } from 'lodash'; import Dropdown from 'components/common/Dropdown/Dropdown'; import DropdownItem from 'components/common/Dropdown/DropdownItem'; +import JSONEditor from 'components/common/JSONEditor/JSONEditor'; import useDataSaver from 'lib/hooks/useDataSaver'; export interface MessageItemProp { @@ -24,18 +23,19 @@ const MessageItem: React.FC = ({ 'topic-message', (content as Record) || '' ); - return ( {format(timestamp, 'yyyy-MM-dd HH:mm:ss')} {offset} {partition} - {isObject(content) ? ( - } /> - ) : ( - content - )} + = ({ messages, onNext }) => { return ( <> -
- - - - - - - - - - - - {messages.map( - ({ partition, offset, timestamp, content }: TopicMessage) => ( - - ) - )} - -
TimestampOffsetPartitionContent
-
+ + + + + + + + + + + + {messages.map( + ({ partition, offset, timestamp, content }: TopicMessage) => ( + + ) + )} + +
TimestampOffsetPartitionContent
({ describe('MessageItem', () => { describe('when content is defined', () => { - it('renders table row with JSONTree', () => { + it('renders table row with JSONEditor', () => { const wrapper = shallow(); expect(wrapper.find('tr').length).toEqual(1); expect(wrapper.find('td').length).toEqual(5); - expect(wrapper.find('JSONViewer').length).toEqual(1); + expect(wrapper.find('JSONEditor').length).toEqual(1); }); it('matches snapshot', () => { @@ -24,14 +24,6 @@ describe('MessageItem', () => { }); describe('when content is undefined', () => { - it('renders table row without JSONTree', () => { - const wrapper = shallow(); - - expect(wrapper.find('tr').length).toEqual(1); - expect(wrapper.find('td').length).toEqual(5); - expect(wrapper.find('JSONViewer').length).toEqual(0); - }); - it('matches snapshot', () => { expect(shallow()).toMatchSnapshot(); }); diff --git a/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/__test__/Messages.spec.tsx b/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/__test__/Messages.spec.tsx index 9a7b7e8963..3ca92a03b9 100644 --- a/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/__test__/Messages.spec.tsx +++ b/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/__test__/Messages.spec.tsx @@ -65,8 +65,8 @@ describe('Messages', () => { it('renders table', () => { expect(messagesWrapper.exists('.table.is-fullwidth')).toBeTruthy(); }); - it('renders JSONTree', () => { - expect(messagesWrapper.find('JSONTree').length).toEqual(1); + it('renders JSONEditor', () => { + expect(messagesWrapper.find('JSONEditor').length).toEqual(1); }); it('parses message content correctly', () => { const messages = [ diff --git a/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/__test__/MessagesTable.spec.tsx b/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/__test__/MessagesTable.spec.tsx index 0627b773a9..0683e26bc7 100644 --- a/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/__test__/MessagesTable.spec.tsx +++ b/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/__test__/MessagesTable.spec.tsx @@ -16,7 +16,7 @@ describe('MessagesTable', () => { ); describe('when topic is empty', () => { - it('renders table row with JSONTree', () => { + it('renders table row with JSONEditor', () => { const wrapper = shallow(setupWrapper()); expect(wrapper.exists('table')).toBeFalsy(); expect(wrapper.exists('CustomParamButton')).toBeFalsy(); @@ -32,7 +32,7 @@ describe('MessagesTable', () => { const onNext = jest.fn(); const wrapper = shallow(setupWrapper({ messages, onNext })); - it('renders table row without JSONTree', () => { + it('renders table row without JSONEditor', () => { expect(wrapper.exists('table')).toBeTruthy(); expect(wrapper.exists('CustomParamButton')).toBeTruthy(); expect(wrapper.find('MessageItem').length).toEqual(2); diff --git a/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/__test__/__snapshots__/MessageItem.spec.tsx.snap b/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/__test__/__snapshots__/MessageItem.spec.tsx.snap index fd9d4fd740..339f189409 100644 --- a/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/__test__/__snapshots__/MessageItem.spec.tsx.snap +++ b/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/__test__/__snapshots__/MessageItem.spec.tsx.snap @@ -36,13 +36,15 @@ exports[`MessageItem when content is defined matches snapshot 1`] = ` } } > - + > + + diff --git a/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/__test__/__snapshots__/MessagesTable.spec.tsx.snap b/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/__test__/__snapshots__/MessagesTable.spec.tsx.snap index 7c11426434..bbf1d6a9e8 100644 --- a/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/__test__/__snapshots__/MessagesTable.spec.tsx.snap +++ b/kafka-ui-react-app/src/components/Topics/Topic/Details/Messages/__test__/__snapshots__/MessagesTable.spec.tsx.snap @@ -2,53 +2,49 @@ exports[`MessagesTable when topic contains messages matches snapshot 1`] = ` -
- - - - - - - - - - - - + + + + + + + + + + - - -
- Timestamp - - Offset - - Partition - - Content - - -
+ Timestamp + + Offset + + Partition + + Content + + +
-
+ } + key="message-802310400000-2" + offset={2} + partition={1} + timestamp={1995-06-05T00:00:00.000Z} + /> + + +
diff --git a/kafka-ui-react-app/src/components/Topics/Topic/Details/Settings/Settings.tsx b/kafka-ui-react-app/src/components/Topics/Topic/Details/Settings/Settings.tsx index 03c3f8e2d6..979ee36749 100644 --- a/kafka-ui-react-app/src/components/Topics/Topic/Details/Settings/Settings.tsx +++ b/kafka-ui-react-app/src/components/Topics/Topic/Details/Settings/Settings.tsx @@ -47,22 +47,20 @@ const Settings: React.FC = ({ return (
-
- - - - - - - - - - {config.map((item) => ( - - ))} - -
KeyValueDefault Value
-
+ + + + + + + + + + {config.map((item) => ( + + ))} + +
KeyValueDefault Value
); }; diff --git a/kafka-ui-react-app/src/components/common/JSONEditor/JSONEditor.tsx b/kafka-ui-react-app/src/components/common/JSONEditor/JSONEditor.tsx index f479bb392f..a1e70b3d90 100644 --- a/kafka-ui-react-app/src/components/common/JSONEditor/JSONEditor.tsx +++ b/kafka-ui-react-app/src/components/common/JSONEditor/JSONEditor.tsx @@ -1,56 +1,18 @@ -import AceEditor from 'react-ace'; +/* eslint-disable react/jsx-props-no-spreading */ +import AceEditor, { IAceEditorProps } from 'react-ace'; import 'ace-builds/src-noconflict/mode-json5'; -import 'ace-builds/src-noconflict/theme-dawn'; +import 'ace-builds/src-noconflict/theme-textmate'; import React from 'react'; -import { Control, Controller } from 'react-hook-form'; -interface JSONEditorProps { - readonly?: boolean; - onChange?: (e: string) => void; - value: string; - name: string; - control?: Control; -} - -const JSONEditor: React.FC = ({ - readonly, - onChange, - value, - name, - control, -}) => { - if (control) { - return ( - - } - /> - ); - } - return ( - - ); -}; +const JSONEditor: React.FC = (props) => ( + +); export default JSONEditor; diff --git a/kafka-ui-react-app/src/components/common/JSONEditor/__tests__/__snapshots__/JSONEditor.spec.tsx.snap b/kafka-ui-react-app/src/components/common/JSONEditor/__tests__/__snapshots__/JSONEditor.spec.tsx.snap index 737750fe3b..abb13063c8 100644 --- a/kafka-ui-react-app/src/components/common/JSONEditor/__tests__/__snapshots__/JSONEditor.spec.tsx.snap +++ b/kafka-ui-react-app/src/components/common/JSONEditor/__tests__/__snapshots__/JSONEditor.spec.tsx.snap @@ -35,7 +35,7 @@ exports[`JSONEditor component matches the snapshot 1`] = ` showPrintMargin={true} style={Object {}} tabSize={2} - theme="dawn" + theme="textmate" value="{}" width="100%" wrapEnabled={true} diff --git a/kafka-ui-react-app/src/components/common/JSONViewer/JSONViewer.tsx b/kafka-ui-react-app/src/components/common/JSONViewer/JSONViewer.tsx deleted file mode 100644 index 4ee54ec584..0000000000 --- a/kafka-ui-react-app/src/components/common/JSONViewer/JSONViewer.tsx +++ /dev/null @@ -1,13 +0,0 @@ -import React from 'react'; -import JSONTree from 'react-json-tree'; -import theme from 'components/common/JSONViewer/themes/google'; - -interface JSONViewerProps { - data: Record; -} - -const JSONViewer: React.FC = ({ data }) => ( - true} hideRoot /> -); - -export default JSONViewer; diff --git a/kafka-ui-react-app/src/components/common/JSONViewer/themes/google.ts b/kafka-ui-react-app/src/components/common/JSONViewer/themes/google.ts deleted file mode 100644 index cbe708e7c6..0000000000 --- a/kafka-ui-react-app/src/components/common/JSONViewer/themes/google.ts +++ /dev/null @@ -1,20 +0,0 @@ -export default { - scheme: 'google', - author: 'seth wright (http://sethawright.com)', - base00: '#1d1f21', - base01: '#282a2e', - base02: '#373b41', - base03: '#969896', - base04: '#b4b7b4', - base05: '#c5c8c6', - base06: '#e0e0e0', - base07: '#ffffff', - base08: '#CC342B', - base09: '#F96A38', - base0A: '#FBA922', - base0B: '#198844', - base0C: '#3971ED', - base0D: '#3971ED', - base0E: '#A36AC7', - base0F: '#3971ED', -}; diff --git a/kafka-ui-react-app/src/redux/reducers/schemas/__test__/selectors.spec.ts b/kafka-ui-react-app/src/redux/reducers/schemas/__test__/selectors.spec.ts index 1108ae6d55..7081baa23c 100644 --- a/kafka-ui-react-app/src/redux/reducers/schemas/__test__/selectors.spec.ts +++ b/kafka-ui-react-app/src/redux/reducers/schemas/__test__/selectors.spec.ts @@ -1,3 +1,4 @@ +import { orderBy } from 'lodash'; import { createSchemaAction, fetchSchemasByClusterNameAction, @@ -65,9 +66,9 @@ describe('Schemas selectors', () => { ); }); - it('returns sorted versions of schema', () => { + it('returns ordered versions of schema', () => { expect(selectors.getSortedSchemaVersions(store.getState())).toEqual( - schemaVersionsPayload + orderBy(schemaVersionsPayload, 'id', 'desc') ); }); }); diff --git a/kafka-ui-react-app/src/redux/reducers/schemas/selectors.ts b/kafka-ui-react-app/src/redux/reducers/schemas/selectors.ts index 5da7fd3f0b..fc39a87f12 100644 --- a/kafka-ui-react-app/src/redux/reducers/schemas/selectors.ts +++ b/kafka-ui-react-app/src/redux/reducers/schemas/selectors.ts @@ -1,7 +1,7 @@ import { createSelector } from 'reselect'; +import { orderBy } from 'lodash'; import { RootState, SchemasState } from 'redux/interfaces'; import { createFetchingSelector } from 'redux/reducers/loader/selectors'; -import { sortBy } from 'lodash'; const schemasState = ({ schemas }: RootState): SchemasState => schemas; @@ -56,5 +56,6 @@ export const getSchema = createSelector( export const getSortedSchemaVersions = createSelector( schemasState, - ({ currentSchemaVersions }) => sortBy(currentSchemaVersions, ['id']) + ({ currentSchemaVersions }) => + orderBy(currentSchemaVersions, ['id'], ['desc']) );