From d3b9e48db55080c8da733da239a34c0103f53f3c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Micha=C5=82=20Kurczewski?= Date: Fri, 5 Jan 2024 14:14:41 +0100 Subject: [PATCH] [CP-2347] Added theme and block boxes (#1624) --- .eslintignore | 1 + .eslintrc.js | 1 - .../src/lib/generic-view/generic-view.tsx | 7 +++- .../store/src/lib/generic-dispatch-demo.ts | 5 --- libs/generic-view/theme/.babelrc | 20 +++++++++++ libs/generic-view/theme/.eslintrc.json | 18 ++++++++++ libs/generic-view/theme/README.md | 7 ++++ libs/generic-view/theme/jest.config.ts | 11 ++++++ libs/generic-view/theme/project.json | 20 +++++++++++ libs/generic-view/theme/src/index.ts | 7 ++++ libs/generic-view/theme/src/lib/color.ts | 9 +++++ libs/generic-view/theme/src/lib/font-size.ts | 8 +++++ .../theme/src/lib/generic-theme-provider.tsx | 25 ++++++++++++++ .../generic-view/theme/src/lib/line-height.ts | 8 +++++ libs/generic-view/theme/src/lib/radius.ts | 8 +++++ libs/generic-view/theme/src/lib/space.ts | 12 +++++++ libs/generic-view/theme/src/lib/theme.ts | 20 +++++++++++ libs/generic-view/theme/tsconfig.json | 20 +++++++++++ libs/generic-view/theme/tsconfig.lib.json | 23 +++++++++++++ libs/generic-view/theme/tsconfig.spec.json | 20 +++++++++++ libs/generic-view/ui/.eslintrc.json | 6 ++-- .../ui/src/lib/blocks/block-box.tsx | 23 ++++++++----- .../{block-wrapper.tsx => block-plain.tsx} | 6 ++-- .../ui/src/lib/blocks/block-vanilla.tsx | 17 ---------- libs/generic-view/ui/src/lib/blocks/blocks.ts | 6 ++-- libs/generic-view/ui/styled.d.ts | 13 +++++++ libs/generic-view/ui/tsconfig.json | 1 - libs/generic-view/ui/tsconfig.lib.json | 9 +++-- .../generic-view/views/src/lib/mc-calendar.ts | 2 +- .../generic-view/views/src/lib/mc-overview.ts | 34 ++++++++++++------- tsconfig.base.json | 4 ++- 31 files changed, 310 insertions(+), 61 deletions(-) create mode 100644 libs/generic-view/theme/.babelrc create mode 100644 libs/generic-view/theme/.eslintrc.json create mode 100644 libs/generic-view/theme/README.md create mode 100644 libs/generic-view/theme/jest.config.ts create mode 100644 libs/generic-view/theme/project.json create mode 100644 libs/generic-view/theme/src/index.ts create mode 100644 libs/generic-view/theme/src/lib/color.ts create mode 100644 libs/generic-view/theme/src/lib/font-size.ts create mode 100644 libs/generic-view/theme/src/lib/generic-theme-provider.tsx create mode 100644 libs/generic-view/theme/src/lib/line-height.ts create mode 100644 libs/generic-view/theme/src/lib/radius.ts create mode 100644 libs/generic-view/theme/src/lib/space.ts create mode 100644 libs/generic-view/theme/src/lib/theme.ts create mode 100644 libs/generic-view/theme/tsconfig.json create mode 100644 libs/generic-view/theme/tsconfig.lib.json create mode 100644 libs/generic-view/theme/tsconfig.spec.json rename libs/generic-view/ui/src/lib/blocks/{block-wrapper.tsx => block-plain.tsx} (56%) delete mode 100644 libs/generic-view/ui/src/lib/blocks/block-vanilla.tsx create mode 100644 libs/generic-view/ui/styled.d.ts diff --git a/.eslintignore b/.eslintignore index 567d61525..c2d1b507c 100644 --- a/.eslintignore +++ b/.eslintignore @@ -3,3 +3,4 @@ jest jest.config.ts jest.preset.js demo-data +auth-server.test.ts diff --git a/.eslintrc.js b/.eslintrc.js index 193cda3a9..93e1cfed1 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -128,5 +128,4 @@ module.exports = { version: "detect", }, }, - ignorePatterns: ["auth-server.test.ts", "./jest"], } diff --git a/libs/generic-view/feature/src/lib/generic-view/generic-view.tsx b/libs/generic-view/feature/src/lib/generic-view/generic-view.tsx index 203ed7c75..3fcbd4faa 100644 --- a/libs/generic-view/feature/src/lib/generic-view/generic-view.tsx +++ b/libs/generic-view/feature/src/lib/generic-view/generic-view.tsx @@ -8,6 +8,7 @@ import { useParams } from "react-router" import { useSelector } from "react-redux" import { ReduxRootState } from "Core/__deprecated__/renderer/store" import { isEmpty } from "lodash" +import { GenericThemeProvider } from "generic-view/theme" import RecursiveLayout from "../recursive-layout/recursive-layout" export const GenericView: FunctionComponent = () => { @@ -22,7 +23,11 @@ export const GenericView: FunctionComponent = () => { return
Not found
} - return + return ( + + + + ) } export default GenericView diff --git a/libs/generic-view/store/src/lib/generic-dispatch-demo.ts b/libs/generic-view/store/src/lib/generic-dispatch-demo.ts index c30794ec9..4763b1b43 100644 --- a/libs/generic-view/store/src/lib/generic-dispatch-demo.ts +++ b/libs/generic-view/store/src/lib/generic-dispatch-demo.ts @@ -4,7 +4,6 @@ */ // TODO: demo code, file to be removed -import { wait } from "fork-ts-checker-webpack-plugin/lib/utils/async/wait" import { generateMcCalendarLayout, generateMcOverviewLayout, @@ -33,11 +32,9 @@ export const useGenericStoreDemo = () => { } // Simulate menu setup after device connection - await wait(2000) dispatch(setMenu(generateMenu(menuConfig))) // Simulate mc-overview layout - await wait(1000) dispatch( setViewLayout({ feature: "mc-overview", @@ -46,7 +43,6 @@ export const useGenericStoreDemo = () => { ) // Simulate mc-calendar layout - await wait(1000) dispatch( setViewLayout({ feature: "mc-calendar", @@ -54,7 +50,6 @@ export const useGenericStoreDemo = () => { }) ) - await wait(1000) dispatch( setViewData({ feature: "mc-overview", diff --git a/libs/generic-view/theme/.babelrc b/libs/generic-view/theme/.babelrc new file mode 100644 index 000000000..ef4889c1a --- /dev/null +++ b/libs/generic-view/theme/.babelrc @@ -0,0 +1,20 @@ +{ + "presets": [ + [ + "@nx/react/babel", + { + "runtime": "automatic", + "useBuiltIns": "usage" + } + ] + ], + "plugins": [ + [ + "styled-components", + { + "pure": true, + "ssr": true + } + ] + ] +} diff --git a/libs/generic-view/theme/.eslintrc.json b/libs/generic-view/theme/.eslintrc.json new file mode 100644 index 000000000..cacbe2621 --- /dev/null +++ b/libs/generic-view/theme/.eslintrc.json @@ -0,0 +1,18 @@ +{ + "extends": ["../../../.eslintrc.js"], + "ignorePatterns": ["!**/*"], + "overrides": [ + { + "files": ["*.ts", "*.tsx", "*.js", "*.jsx"], + "rules": {} + }, + { + "files": ["*.ts", "*.tsx"], + "rules": {} + }, + { + "files": ["*.js", "*.jsx"], + "rules": {} + } + ] +} diff --git a/libs/generic-view/theme/README.md b/libs/generic-view/theme/README.md new file mode 100644 index 000000000..caf43fe8a --- /dev/null +++ b/libs/generic-view/theme/README.md @@ -0,0 +1,7 @@ +# generic-view-theme + +This library was generated with [Nx](https://nx.dev). + +## Running unit tests + +Run `nx test generic-view-theme` to execute the unit tests via [Jest](https://jestjs.io). diff --git a/libs/generic-view/theme/jest.config.ts b/libs/generic-view/theme/jest.config.ts new file mode 100644 index 000000000..6328465fe --- /dev/null +++ b/libs/generic-view/theme/jest.config.ts @@ -0,0 +1,11 @@ +/* eslint-disable */ +export default { + displayName: "generic-view-theme", + preset: "../../../jest.preset.js", + transform: { + "^(?!.*\\.(js|jsx|ts|tsx|css|json)$)": "@nx/react/plugins/jest", + "^.+\\.[tj]sx?$": ["babel-jest", { presets: ["@nx/react/babel"] }], + }, + moduleFileExtensions: ["ts", "tsx", "js", "jsx"], + coverageDirectory: "../../../coverage/libs/generic-view/theme", +} diff --git a/libs/generic-view/theme/project.json b/libs/generic-view/theme/project.json new file mode 100644 index 000000000..5b93c74f0 --- /dev/null +++ b/libs/generic-view/theme/project.json @@ -0,0 +1,20 @@ +{ + "name": "generic-view-theme", + "$schema": "../../../node_modules/nx/schemas/project-schema.json", + "sourceRoot": "libs/generic-view/theme/src", + "projectType": "library", + "tags": [], + "targets": { + "lint": { + "executor": "@nx/eslint:lint", + "outputs": ["{options.outputFile}"] + }, + "test": { + "executor": "@nx/jest:jest", + "outputs": ["{workspaceRoot}/coverage/{projectRoot}"], + "options": { + "jestConfig": "libs/generic-view/theme/jest.config.ts" + } + } + } +} diff --git a/libs/generic-view/theme/src/index.ts b/libs/generic-view/theme/src/index.ts new file mode 100644 index 000000000..3b411d214 --- /dev/null +++ b/libs/generic-view/theme/src/index.ts @@ -0,0 +1,7 @@ +/** + * Copyright (c) Mudita sp. z o.o. All rights reserved. + * For licensing, see https://github.com/mudita/mudita-center/blob/master/LICENSE.md + */ + +export * from "./lib/generic-theme-provider" +export * from "./lib/theme" diff --git a/libs/generic-view/theme/src/lib/color.ts b/libs/generic-view/theme/src/lib/color.ts new file mode 100644 index 000000000..de8039a6b --- /dev/null +++ b/libs/generic-view/theme/src/lib/color.ts @@ -0,0 +1,9 @@ +/** + * Copyright (c) Mudita sp. z o.o. All rights reserved. + * For licensing, see https://github.com/mudita/mudita-center/blob/master/LICENSE.md + */ + +export const color = { + white: "#FFFFFF", + grey6: "#FBFBFB", +} as const diff --git a/libs/generic-view/theme/src/lib/font-size.ts b/libs/generic-view/theme/src/lib/font-size.ts new file mode 100644 index 000000000..5f65f2fac --- /dev/null +++ b/libs/generic-view/theme/src/lib/font-size.ts @@ -0,0 +1,8 @@ +/** + * Copyright (c) Mudita sp. z o.o. All rights reserved. + * For licensing, see https://github.com/mudita/mudita-center/blob/master/LICENSE.md + */ + +export const fontSize = { + headline3: "24px", +} as const diff --git a/libs/generic-view/theme/src/lib/generic-theme-provider.tsx b/libs/generic-view/theme/src/lib/generic-theme-provider.tsx new file mode 100644 index 000000000..7643c2781 --- /dev/null +++ b/libs/generic-view/theme/src/lib/generic-theme-provider.tsx @@ -0,0 +1,25 @@ +/** + * Copyright (c) Mudita sp. z o.o. All rights reserved. + * For licensing, see https://github.com/mudita/mudita-center/blob/master/LICENSE.md + */ + +import React, { FunctionComponent, PropsWithChildren } from "react" +import { createGlobalStyle, ThemeProvider } from "styled-components" +import { Theme, theme } from "./theme" + +export const GenericThemeProvider: FunctionComponent = ({ + children, +}) => { + return ( + + + {children} + + ) +} + +const GlobalStyle = createGlobalStyle<{ theme: Theme }>` + * { + box-sizing: border-box; + } +` diff --git a/libs/generic-view/theme/src/lib/line-height.ts b/libs/generic-view/theme/src/lib/line-height.ts new file mode 100644 index 000000000..72f32c6fe --- /dev/null +++ b/libs/generic-view/theme/src/lib/line-height.ts @@ -0,0 +1,8 @@ +/** + * Copyright (c) Mudita sp. z o.o. All rights reserved. + * For licensing, see https://github.com/mudita/mudita-center/blob/master/LICENSE.md + */ + +export const lineHeight = { + headline3: "32px", +} as const diff --git a/libs/generic-view/theme/src/lib/radius.ts b/libs/generic-view/theme/src/lib/radius.ts new file mode 100644 index 000000000..a9fa4bb70 --- /dev/null +++ b/libs/generic-view/theme/src/lib/radius.ts @@ -0,0 +1,8 @@ +/** + * Copyright (c) Mudita sp. z o.o. All rights reserved. + * For licensing, see https://github.com/mudita/mudita-center/blob/master/LICENSE.md + */ + +export const radius = { + sm: "4px", +} as const diff --git a/libs/generic-view/theme/src/lib/space.ts b/libs/generic-view/theme/src/lib/space.ts new file mode 100644 index 000000000..5a251dba1 --- /dev/null +++ b/libs/generic-view/theme/src/lib/space.ts @@ -0,0 +1,12 @@ +/** + * Copyright (c) Mudita sp. z o.o. All rights reserved. + * For licensing, see https://github.com/mudita/mudita-center/blob/master/LICENSE.md + */ + +export const space = { + xs: "4px", + sm: "8px", + md: "12px", + lg: "16px", + xl: "24px", +} as const diff --git a/libs/generic-view/theme/src/lib/theme.ts b/libs/generic-view/theme/src/lib/theme.ts new file mode 100644 index 000000000..686e14bb9 --- /dev/null +++ b/libs/generic-view/theme/src/lib/theme.ts @@ -0,0 +1,20 @@ +/** + * Copyright (c) Mudita sp. z o.o. All rights reserved. + * For licensing, see https://github.com/mudita/mudita-center/blob/master/LICENSE.md + */ + +import { color } from "./color" +import { fontSize } from "./font-size" +import { radius } from "./radius" +import { space } from "./space" +import { lineHeight } from "./line-height" + +export const theme = { + color, + radius, + space, + fontSize, + lineHeight, +} as const + +export type Theme = typeof theme diff --git a/libs/generic-view/theme/tsconfig.json b/libs/generic-view/theme/tsconfig.json new file mode 100644 index 000000000..4daaf45cd --- /dev/null +++ b/libs/generic-view/theme/tsconfig.json @@ -0,0 +1,20 @@ +{ + "compilerOptions": { + "jsx": "react-jsx", + "allowJs": false, + "esModuleInterop": false, + "allowSyntheticDefaultImports": true, + "strict": true + }, + "files": [], + "include": [], + "references": [ + { + "path": "./tsconfig.lib.json" + }, + { + "path": "./tsconfig.spec.json" + } + ], + "extends": "../../../tsconfig.base.json" +} diff --git a/libs/generic-view/theme/tsconfig.lib.json b/libs/generic-view/theme/tsconfig.lib.json new file mode 100644 index 000000000..c2168aa8d --- /dev/null +++ b/libs/generic-view/theme/tsconfig.lib.json @@ -0,0 +1,23 @@ +{ + "extends": "./tsconfig.json", + "compilerOptions": { + "outDir": "../../../dist/out-tsc", + "types": [ + "node", + "@nx/react/typings/cssmodule.d.ts", + "@nx/react/typings/image.d.ts", + ] + }, + "exclude": [ + "jest.config.ts", + "src/**/*.spec.ts", + "src/**/*.test.ts", + "src/**/*.spec.tsx", + "src/**/*.test.tsx", + "src/**/*.spec.js", + "src/**/*.test.js", + "src/**/*.spec.jsx", + "src/**/*.test.jsx" + ], + "include": ["src/**/*.js", "src/**/*.jsx", "src/**/*.ts", "src/**/*.tsx"] +} diff --git a/libs/generic-view/theme/tsconfig.spec.json b/libs/generic-view/theme/tsconfig.spec.json new file mode 100644 index 000000000..25b7af8f6 --- /dev/null +++ b/libs/generic-view/theme/tsconfig.spec.json @@ -0,0 +1,20 @@ +{ + "extends": "./tsconfig.json", + "compilerOptions": { + "outDir": "../../../dist/out-tsc", + "module": "commonjs", + "types": ["jest", "node"] + }, + "include": [ + "jest.config.ts", + "src/**/*.test.ts", + "src/**/*.spec.ts", + "src/**/*.test.tsx", + "src/**/*.spec.tsx", + "src/**/*.test.js", + "src/**/*.spec.js", + "src/**/*.test.jsx", + "src/**/*.spec.jsx", + "src/**/*.d.ts" + ] +} diff --git a/libs/generic-view/ui/.eslintrc.json b/libs/generic-view/ui/.eslintrc.json index cacbe2621..70bef232a 100644 --- a/libs/generic-view/ui/.eslintrc.json +++ b/libs/generic-view/ui/.eslintrc.json @@ -1,6 +1,6 @@ { "extends": ["../../../.eslintrc.js"], - "ignorePatterns": ["!**/*"], + "ignorePatterns": ["!**/*", "styled.d.ts"], "overrides": [ { "files": ["*.ts", "*.tsx", "*.js", "*.jsx"], @@ -8,7 +8,9 @@ }, { "files": ["*.ts", "*.tsx"], - "rules": {} + "rules": { + "@typescript-eslint/no-unsafe-return": "off" + } }, { "files": ["*.js", "*.jsx"], diff --git a/libs/generic-view/ui/src/lib/blocks/block-box.tsx b/libs/generic-view/ui/src/lib/blocks/block-box.tsx index ae1e81614..e2690adc2 100644 --- a/libs/generic-view/ui/src/lib/blocks/block-box.tsx +++ b/libs/generic-view/ui/src/lib/blocks/block-box.tsx @@ -19,19 +19,24 @@ const BlockBox: APIFC = ({ ...props }) => { return ( - - {config?.title &&

{config.title}

} + + {config?.title && {config.title}} {children} - + ) } export default withConfig(BlockBox) -const BoxWrapper = styled.div` - &.custom { - height: 90%; - } - - background-color: #ccc; +const Block = styled.div` + background-color: ${({ theme }) => theme.color.white}; + border-radius: ${({ theme }) => theme.radius.sm}; + padding: ${({ theme }) => theme.space.xl}; + box-sizing: border-box; +` + +const Headline = styled.h3` + margin: 0; + font-size: ${({ theme }) => theme.fontSize.headline3}; + line-height: ${({ theme }) => theme.lineHeight.headline3}; ` diff --git a/libs/generic-view/ui/src/lib/blocks/block-wrapper.tsx b/libs/generic-view/ui/src/lib/blocks/block-plain.tsx similarity index 56% rename from libs/generic-view/ui/src/lib/blocks/block-wrapper.tsx rename to libs/generic-view/ui/src/lib/blocks/block-plain.tsx index 5ce9c7636..65b680ea4 100644 --- a/libs/generic-view/ui/src/lib/blocks/block-wrapper.tsx +++ b/libs/generic-view/ui/src/lib/blocks/block-plain.tsx @@ -4,11 +4,9 @@ */ import React from "react" -import styled from "styled-components" import { APIFC } from "generic-view/utils" -export const BlockWrapper: APIFC = ({ config, data, ...props }) => { - return +export const BlockPlain: APIFC = ({ config, data, ...props }) => { + return
} -const Wrapper = styled.div`` diff --git a/libs/generic-view/ui/src/lib/blocks/block-vanilla.tsx b/libs/generic-view/ui/src/lib/blocks/block-vanilla.tsx deleted file mode 100644 index 5f48e1c35..000000000 --- a/libs/generic-view/ui/src/lib/blocks/block-vanilla.tsx +++ /dev/null @@ -1,17 +0,0 @@ -/** - * Copyright (c) Mudita sp. z o.o. All rights reserved. - * For licensing, see https://github.com/mudita/mudita-center/blob/master/LICENSE.md - */ - -import React from "react" -import styled from "styled-components" -import { APIFC } from "generic-view/utils" - -export const BlockVanilla: APIFC = ({ config, data, ...props }) => { - return -} - -const BoxWrapper = styled.div` - width: 100%; - height: 100%; -` diff --git a/libs/generic-view/ui/src/lib/blocks/blocks.ts b/libs/generic-view/ui/src/lib/blocks/blocks.ts index 200f83f99..5aa7d4cfb 100644 --- a/libs/generic-view/ui/src/lib/blocks/blocks.ts +++ b/libs/generic-view/ui/src/lib/blocks/blocks.ts @@ -4,11 +4,9 @@ */ import BlockBox from "./block-box" -import { BlockVanilla } from "./block-vanilla" -import { BlockWrapper } from "./block-wrapper" +import { BlockPlain } from "./block-plain" export const blocks = { + "block-plain": BlockPlain, "block-box": BlockBox, - "block-vanilla": BlockVanilla, - "block-wrapper": BlockWrapper, } diff --git a/libs/generic-view/ui/styled.d.ts b/libs/generic-view/ui/styled.d.ts new file mode 100644 index 000000000..495ddd47b --- /dev/null +++ b/libs/generic-view/ui/styled.d.ts @@ -0,0 +1,13 @@ +/** + * Copyright (c) Mudita sp. z o.o. All rights reserved. + * For licensing, see https://github.com/mudita/mudita-center/blob/master/LICENSE.md + */ + +import "styled-components" +import { Theme } from "../theme/src" + +type CustomTheme = Theme + +declare module "styled-components" { + export interface DefaultTheme extends CustomTheme {} +} diff --git a/libs/generic-view/ui/tsconfig.json b/libs/generic-view/ui/tsconfig.json index 4daaf45cd..0abdc3f07 100644 --- a/libs/generic-view/ui/tsconfig.json +++ b/libs/generic-view/ui/tsconfig.json @@ -7,7 +7,6 @@ "strict": true }, "files": [], - "include": [], "references": [ { "path": "./tsconfig.lib.json" diff --git a/libs/generic-view/ui/tsconfig.lib.json b/libs/generic-view/ui/tsconfig.lib.json index 21799b3e6..4818ba519 100644 --- a/libs/generic-view/ui/tsconfig.lib.json +++ b/libs/generic-view/ui/tsconfig.lib.json @@ -4,7 +4,6 @@ "outDir": "../../../dist/out-tsc", "types": [ "node", - "@nx/react/typings/cssmodule.d.ts", "@nx/react/typings/image.d.ts" ] @@ -20,5 +19,11 @@ "src/**/*.spec.jsx", "src/**/*.test.jsx" ], - "include": ["src/**/*.js", "src/**/*.jsx", "src/**/*.ts", "src/**/*.tsx"] + "include": [ + "src/**/*.js", + "src/**/*.jsx", + "src/**/*.ts", + "src/**/*.tsx", + "./styled.d.ts" + ] } diff --git a/libs/generic-view/views/src/lib/mc-calendar.ts b/libs/generic-view/views/src/lib/mc-calendar.ts index dde6cc863..49b9ac0a9 100644 --- a/libs/generic-view/views/src/lib/mc-calendar.ts +++ b/libs/generic-view/views/src/lib/mc-calendar.ts @@ -18,7 +18,7 @@ export const generateMcCalendarLayout: ViewGenerator = ( ) => { return { main: { - component: "block-vanilla", + component: "block-plain", parameters: { layout: { gridLayout: { diff --git a/libs/generic-view/views/src/lib/mc-overview.ts b/libs/generic-view/views/src/lib/mc-overview.ts index aa7abb3fe..e40804839 100644 --- a/libs/generic-view/views/src/lib/mc-overview.ts +++ b/libs/generic-view/views/src/lib/mc-overview.ts @@ -124,11 +124,11 @@ export const generateMcOverviewLayout: ViewGenerator = ( ) => { return { main: { - component: "block-wrapper", + component: "block-plain", layout: { - padding: "2rem", + padding: "32px", gridLayout: { - rows: [1, 1, 1], + rows: ["261px", "205px", 1], columns: [1, 2], columnGap: "2rem", rowGap: "2rem", @@ -137,11 +137,17 @@ export const generateMcOverviewLayout: ViewGenerator = ( grow: 1, }, }, - childrenKeys: ["summary", "status", "update"], + childrenKeys: [ + "summary", + ...config.sections.map((section) => section.key), + ], }, ...(config.summary.show && { summary: { component: "block-box", + config: { + title: "Summary", + }, layout: { gridPlacement: { row: 1, @@ -154,9 +160,7 @@ export const generateMcOverviewLayout: ViewGenerator = ( justifyContent: "space-between", }, }, - config: { - title: "Summary", - }, + childrenKeys: [ config.summary.showImg ? "summaryImg" : undefined, config.summary.showSerialNumber ? "serial-number" : undefined, @@ -164,7 +168,7 @@ export const generateMcOverviewLayout: ViewGenerator = ( ].filter(Boolean) as string[], }, summaryImg: { - component: "block-box", + component: "block-plain", layout: { flexPlacement: { alignSelf: "center", @@ -175,7 +179,7 @@ export const generateMcOverviewLayout: ViewGenerator = ( }, }, "serial-number": { - component: "block-box", + component: "block-plain", layout: { flexPlacement: { alignSelf: "center", @@ -186,7 +190,7 @@ export const generateMcOverviewLayout: ViewGenerator = ( }, }, about: { - component: "block-box", + component: "block-plain", layout: { flexPlacement: { alignSelf: "center", @@ -199,6 +203,9 @@ export const generateMcOverviewLayout: ViewGenerator = ( }), status: { component: "block-box", + config: { + title: "Status", + }, layout: { gridPlacement: { row: 1, @@ -210,9 +217,7 @@ export const generateMcOverviewLayout: ViewGenerator = ( direction: "column", }, }, - parameters: { - title: "Status", - }, + childrenKeys: ["battery", "connection"], }, battery: { @@ -228,6 +233,9 @@ export const generateMcOverviewLayout: ViewGenerator = ( }, update: { component: "block-box", + config: { + title: "MuditaOS", + }, layout: { gridPlacement: { row: 2, diff --git a/tsconfig.base.json b/tsconfig.base.json index ab2a8d4d8..30c7ad63e 100644 --- a/tsconfig.base.json +++ b/tsconfig.base.json @@ -33,6 +33,7 @@ "device/models": ["libs/device/models/src/index.ts"], "generic-view/feature": ["libs/generic-view/feature/src/index.ts"], "generic-view/store": ["libs/generic-view/store/src/index.ts"], + "generic-view/theme": ["libs/generic-view/theme/src/index.ts"], "generic-view/ui": ["libs/generic-view/ui/src/index.ts"], "generic-view/utils": ["libs/generic-view/utils/src/index.ts"], "generic-view/views": ["libs/generic-view/views/src/index.ts"] @@ -42,6 +43,7 @@ "node_modules", "./apps/mudita-center/node_modules", "./apps/mudita-center/dist", - "./apps/mudita-center/__mocks__" + "./apps/mudita-center/__mocks__", + "./libs/generic-view/ui/styled.d.ts" ] }