diff --git a/package.json b/package.json index d116ce2..7f3acbf 100644 --- a/package.json +++ b/package.json @@ -26,10 +26,12 @@ "react-redux": "^8.1.3", "react-scripts": "5.0.1", "sass": "^1.69.1", - "typescript": "^4.4.2" + "typescript": "^4.4.2", + "uuid": "^9.0.1" }, "devDependencies": { - "@babel/plugin-proposal-private-property-in-object": "^7.21.11" + "@babel/plugin-proposal-private-property-in-object": "^7.21.11", + "@types/uuid": "^9.0.5" }, "scripts": { "start": "GENERATE_SOURCEMAP=false react-scripts start", diff --git a/src/components/App.tsx b/src/components/App.tsx index 44764b7..87fe777 100644 --- a/src/components/App.tsx +++ b/src/components/App.tsx @@ -5,23 +5,27 @@ import UserItem from './User' import PostItem from './Post' import Notify from './Notify' -const renderUser = (item: User) => -const renderPost = (item: Post) => +const renderUser = (item: User) => +const renderPost = (item: Post) => const App = () => { return (
+

Users

fetchItems={useFetchUsersQuery} renderItem={renderUser} - /> + /> +

Posts

fetchItems={useFetchPostsQuery} renderItem={renderPost} /> + +
) } diff --git a/src/features/control/notify.ts b/src/features/control/notify.ts index db73738..7573e07 100644 --- a/src/features/control/notify.ts +++ b/src/features/control/notify.ts @@ -12,6 +12,7 @@ export type NotifyDataItem = object | string | number | boolean export type NotifyData = NotifyDataItem | Array export type Notify = { + time: Date severity: SeverityType message: string data?: NotifyData diff --git a/src/index.scss b/src/index.scss new file mode 100644 index 0000000..83e7014 --- /dev/null +++ b/src/index.scss @@ -0,0 +1,8 @@ +@import url('https://fonts.cdnfonts.com/css/libre-franklin'); + +body { + margin: 0; + font-family: 'LibreFranklin', 'Libre Franklin', 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif; + color: black; + font-weight: 300; +} \ No newline at end of file diff --git a/src/index.tsx b/src/index.tsx index f1c4cb1..fd294d8 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -4,6 +4,7 @@ import App from 'components/App' import { Provider } from 'react-redux' import { store } from 'features/store' import { SharedCssBaseline, SharedThemeProvider } from '@catena-x/portal-shared-components' +import './index.scss' ReactDOM.createRoot( document.getElementById('app') as HTMLElement diff --git a/src/services/NotifyService.ts b/src/services/NotifyService.ts index faad78c..5ed914b 100644 --- a/src/services/NotifyService.ts +++ b/src/services/NotifyService.ts @@ -5,7 +5,7 @@ const NOTIFY_TIME = 7000 const NotifyService = { notify: (severity: SeverityType, message: string) => { - store.dispatch(enq({ severity, message })) + store.dispatch(enq({ time: new Date(), severity, message })) setTimeout(() => store.dispatch(deq()), NOTIFY_TIME) }, success: (message: string) => NotifyService.notify(SeverityType.SUCCESS, message), diff --git a/src/shared/ItemList/index.tsx b/src/shared/ItemList/index.tsx index 48fd0f0..bd34b91 100644 --- a/src/shared/ItemList/index.tsx +++ b/src/shared/ItemList/index.tsx @@ -1,3 +1,4 @@ +import { v4 as uuid } from 'uuid' import './style.scss' const defaultRender = function(item: Item) { @@ -21,7 +22,7 @@ const ItemList = function ({ return (
    { - data?.map((item: Item) =>
  • {renderItem(item)}
  • ) + data?.map((item: Item) =>
  • {renderItem(item)}
  • ) }
) diff --git a/yarn.lock b/yarn.lock index 63e52d8..cbb8c02 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2459,6 +2459,11 @@ resolved "https://registry.yarnpkg.com/@types/use-sync-external-store/-/use-sync-external-store-0.0.3.tgz#b6725d5f4af24ace33b36fafd295136e75509f43" integrity sha512-EwmlvuaxPNej9+T4v5AuBPJa2x2UOJVdjCtDHgcDqitUeOtjnJKJ+apYjVcAoBEMjKW1VVFGZLUb5+qqa09XFA== +"@types/uuid@^9.0.5": + version "9.0.5" + resolved "https://registry.yarnpkg.com/@types/uuid/-/uuid-9.0.5.tgz#25a71eb73eba95ac0e559ff3dd018fc08294acf6" + integrity sha512-xfHdwa1FMJ082prjSJpoEI57GZITiQz10r3vEJCHa2khEFQjKy91aWKz6+zybzssCvXUwE1LQWgWVwZ4nYUvHQ== + "@types/ws@^8.5.5": version "8.5.6" resolved "https://registry.yarnpkg.com/@types/ws/-/ws-8.5.6.tgz#e9ad51f0ab79b9110c50916c9fcbddc36d373065" @@ -9614,6 +9619,11 @@ uuid@^8.3.2: resolved "https://registry.yarnpkg.com/uuid/-/uuid-8.3.2.tgz#80d5b5ced271bb9af6c445f21a1a04c606cefbe2" integrity sha512-+NYs2QeMWy+GWFOEm9xnn6HCDp0l7QBD7ml8zLUmJ+93Q5NF0NocErnwkTkXVFNiX3/fpC6afS8Dhb/gz7R7eg== +uuid@^9.0.1: + version "9.0.1" + resolved "https://registry.yarnpkg.com/uuid/-/uuid-9.0.1.tgz#e188d4c8853cc722220392c424cd637f32293f30" + integrity sha512-b+1eJOlsR9K8HJpow9Ok3fiWOWSIcIzXodvv0rQjVoOVNpWMpxf1wZNpt4y9h10odCNrqnYp1OBzRktckBe3sA== + v8-to-istanbul@^8.1.0: version "8.1.1" resolved "https://registry.yarnpkg.com/v8-to-istanbul/-/v8-to-istanbul-8.1.1.tgz#77b752fd3975e31bbcef938f85e9bd1c7a8d60ed"