Piteball
/
skolplattformen-backup
mirror of https://github.com/kolplattformen/skolplattformen.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

WIP

This commit is contained in:
Jonathan Edenström 2021-12-02 22:22:04 +01:00
parent fde9d95149
commit 2829f2da40
21 changed files with 312 additions and 91 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

69
apps/skolplattformen-app/App.tsx
View File

@ -1,5 +1,10 @@
import * as eva from '@eva-design/eva'
import AsyncStorage from '@react-native-async-storage/async-storage'
import { ThemeProvider } from '@shopify/restyle'
import {
defaultThemeDark,
defaultThemeLight,
} from '@skolplattformen/design-system'
import { ApiProvider, Reporter } from '@skolplattformen/hooks'
import { ApplicationProvider, IconRegistry, Text } from '@ui-kitten/components'
import { EvaIconsPack } from '@ui-kitten/eva-icons'
@ -74,35 +79,39 @@ export default () => {
)
return (
<FeatureProvider features={platform.features}>
<SchoolPlatformProvider>
<ApiProvider
api={platform.api}
storage={AsyncStorage}
reporter={reporter}
>
<SafeAreaProvider>
<StatusBar
backgroundColor={colorScheme === 'dark' ? '#2E3137' : '#FFF'}
barStyle={
colorScheme === 'dark' ? 'light-content' : 'dark-content'
}
translucent
/>
<IconRegistry icons={EvaIconsPack} />
<ApplicationProvider
{...eva}
// @ts-expect-error Unknown error
customMapping={customMapping}
theme={colorScheme === 'dark' ? darkTheme : lightTheme}
>
<LanguageProvider cache={true} data={translations}>
<AppNavigator />
</LanguageProvider>
</ApplicationProvider>
</SafeAreaProvider>
</ApiProvider>
</SchoolPlatformProvider>
</FeatureProvider>
<ThemeProvider
theme={colorScheme === 'dark' ? defaultThemeDark : defaultThemeLight}
>
<FeatureProvider features={platform.features}>
<SchoolPlatformProvider>
<ApiProvider
api={platform.api}
storage={AsyncStorage}
reporter={reporter}
>
<SafeAreaProvider>
<StatusBar
backgroundColor={colorScheme === 'dark' ? '#2E3137' : '#FFF'}
barStyle={
colorScheme === 'dark' ? 'light-content' : 'dark-content'
}
translucent
/>
<IconRegistry icons={EvaIconsPack} />
<ApplicationProvider
{...eva}
// @ts-expect-error Unknown error
customMapping={customMapping}
theme={colorScheme === 'dark' ? darkTheme : lightTheme}
>
<LanguageProvider cache={true} data={translations}>
<AppNavigator />
</LanguageProvider>
</ApplicationProvider>
</SafeAreaProvider>
</ApiProvider>
</SchoolPlatformProvider>
</FeatureProvider>
</ThemeProvider>
)
}

49
apps/skolplattformen-app/components/notification.component.tsx
View File

@ -1,17 +1,14 @@
import { Notification as NotificationType } from '@skolplattformen/api'
import { StyleService, Text, useStyleSheet } from '@ui-kitten/components'
import { Box, Card, Text } from '@skolplattformen/design-system'
import moment from 'moment'
import React from 'react'
import { TouchableOpacity, View } from 'react-native'
import { Layout, Sizing, Typography } from '../styles'
import { TouchableOpacity } from 'react-native'
import { ModalWebView } from './modalWebView.component'
interface NotificationProps {
item: NotificationType
}
export const Notification = ({ item }: NotificationProps) => {
const styles = useStyleSheet(themedStyles)
const [isOpen, setIsOpen] = React.useState(false)
const open = () => setIsOpen(true)
const close = () => setIsOpen(false)
@ -27,19 +24,19 @@ export const Notification = ({ item }: NotificationProps) => {
return (
<>
<TouchableOpacity onPress={open}>
<View style={styles.card}>
<View>
<Text style={styles.title}>{item.sender}</Text>
<Text style={styles.subtitle}>
{item.category ? item.category : ''}
<Box mb="m">
<TouchableOpacity onPress={open}>
<Card>
<Text variant="listItemTitle">{item.sender}</Text>
<Text variant="listItemSubTitle">
{item.category ?? ''}
{item.category && displayDate ? ' • ' : ''}
{displayDate ? displayDate : ''}
{displayDate ?? ''}
</Text>
</View>
<Text>{item.message}</Text>
</View>
</TouchableOpacity>
<Text>{item.message}</Text>
</Card>
</TouchableOpacity>
</Box>
{isOpen && (
<ModalWebView
url={item.url}
@ -50,23 +47,3 @@ export const Notification = ({ item }: NotificationProps) => {
</>
)
}
const themedStyles = StyleService.create({
card: {
...Layout.flex.full,
borderRadius: 15,
paddingVertical: Sizing.t4,
paddingHorizontal: Sizing.t4,
marginBottom: Sizing.t3,
backgroundColor: 'background-basic-color-1',
},
title: {
...Typography.header,
marginBottom: Sizing.t1,
},
subtitle: {
...Typography.fontSize.xs,
color: 'text-hint-color',
marginBottom: Sizing.t2,
},
})

3
libs/design-system/.babelrc Normal file
View File

@ -0,0 +1,3 @@
{
"presets": ["module:metro-react-native-babel-preset"]
}

22
libs/design-system/.eslintrc.json Normal file
View File

@ -0,0 +1,22 @@
{
"extends": ["plugin:@nrwl/nx/react", "../../.eslintrc.json"],
"ignorePatterns": ["!**/*", "public", ".cache", "node_modules"],
"overrides": [
{
"files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
"rules": {}
},
{
"files": ["*.ts", "*.tsx"],
"rules": {
"@typescript-eslint/ban-ts-comment": "off"
}
},
{
"files": ["*.js", "*.jsx"],
"rules": {
"@typescript-eslint/no-var-requires": "off"
}
}
]
}

7
libs/design-system/README.md Normal file
View File

@ -0,0 +1,7 @@
# design-system
This library was generated with [Nx](https://nx.dev).
## Running unit tests
Run `nx test design-system` to execute the unit tests via [Jest](https://jestjs.io).

17
libs/design-system/jest.config.js Normal file
View File

@ -0,0 +1,17 @@
module.exports = {
displayName: 'design-system',
preset: 'react-native',
testRunner: 'jest-jasmine2',
resolver: '@nrwl/jest/plugins/resolver',
moduleFileExtensions: ['ts', 'js', 'html', 'tsx', 'jsx'],
setupFilesAfterEnv: ['<rootDir>/test-setup.ts'],
moduleNameMapper: {
'.svg': '@nrwl/react-native/plugins/jest/svg-mock',
},
transform: {
'\\.(js|ts|tsx)$': require.resolve('react-native/jest/preprocessor.js'),
'^.+\\.(bmp|gif|jpg|jpeg|mp4|png|psd|svg|webp)$': require.resolve(
'react-native/jest/assetFileTransformer.js'
),
},
}

8
libs/design-system/package.json Normal file
View File

@ -0,0 +1,8 @@
{
"name": "@skolplattformen/design-system",
"description": "",
"main": "src/index.ts",
"license": "Apache-2.0",
"private": false,
"scripts": {}
}

4
libs/design-system/src/components/Box.tsx Normal file
View File

@ -0,0 +1,4 @@
import { createBox } from '@shopify/restyle'
import { Theme } from '../themes/default'
export const Box = createBox<Theme>()

12
libs/design-system/src/components/Card.tsx Normal file
View File

@ -0,0 +1,12 @@
import {
createRestyleComponent,
createVariant,
VariantProps,
} from '@shopify/restyle'
import { Theme } from '../themes/default'
import { Box } from './Box'
export const Card = createRestyleComponent<
VariantProps<Theme, 'cardVariants'> & React.ComponentProps<typeof Box>,
Theme
>([createVariant({ themeKey: 'cardVariants' })], Box)

4
libs/design-system/src/components/Text.tsx Normal file
View File

@ -0,0 +1,4 @@
import { createText } from '@shopify/restyle'
import { Theme } from '../themes/default'
export const Text = createText<Theme>()

4
libs/design-system/src/index.ts Normal file
View File

@ -0,0 +1,4 @@
export * from './components/Box'
export * from './components/Card'
export * from './components/Text'
export * from './themes/default'

77
libs/design-system/src/themes/default.ts Normal file
View File

@ -0,0 +1,77 @@
import { createTheme } from '@shopify/restyle'
const palette = {
purpleLight: '#8C6FF7',
purplePrimary: '#5A31F4',
purpleDark: '#3F22AB',
greenLight: '#56DCBA',
greenPrimary: '#0ECD9D',
greenDark: '#0A906E',
black: '#0B0B0B',
white: '#fff',
hint: '#B3BBCB',
hint2: '#4B5466',
basic2: '#F2F1F6',
basic1d: '#0F1117',
basic2d: '#030200',
}
export const defaultThemeLight = createTheme({
colors: {
mainBackground: palette.white,
cardPrimaryBackground: palette.basic2,
text: palette.black,
textHint: palette.hint2,
},
spacing: {
s: 8,
m: 16,
l: 24,
xl: 40,
},
breakpoints: {
phone: 0,
tablet: 768,
},
cardVariants: {
defaults: {
borderRadius: 15,
paddingVertical: 'm',
paddingHorizontal: 'm',
backgroundColor: 'cardPrimaryBackground',
},
large: {},
},
textVariants: {
defaults: {
fontFamily: 'Poppins-Regular',
fontSize: 16,
lineHeight: 24,
color: 'text',
},
listItemTitle: {
fontFamily: 'Poppins-Bold',
fontWeight: 'bold',
color: 'text',
},
listItemSubTitle: {
fontFamily: 'Poppins-Regular',
fontSize: 12,
color: 'textHint',
},
},
})
export const defaultThemeDark = createTheme<typeof defaultThemeLight>({
...defaultThemeLight,
colors: {
mainBackground: palette.basic2d,
cardPrimaryBackground: palette.basic1d,
text: palette.white,
textHint: palette.hint,
},
})
export type Theme = typeof defaultThemeLight

1
libs/design-system/test-setup.ts Normal file
View File

@ -0,0 +1 @@
import '@testing-library/jest-native/extend-expect'

23
libs/design-system/tsconfig.json Normal file
View File

@ -0,0 +1,23 @@
{
"extends": "../../tsconfig.base.json",
"compilerOptions": {
"jsx": "react-jsx",
"allowJs": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"forceConsistentCasingInFileNames": true,
"strict": true,
"noImplicitReturns": true,
"noFallthroughCasesInSwitch": true
},
"files": [],
"include": [],
"references": [
{
"path": "./tsconfig.lib.json"
},
{
"path": "./tsconfig.spec.json"
}
]
}

9
libs/design-system/tsconfig.lib.json Normal file
View File

@ -0,0 +1,9 @@
{
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "../../dist/out-tsc",
"types": ["node"]
},
"exclude": ["**/*.spec.ts", "**/*.spec.tsx"],
"include": ["**/*.js", "**/*.jsx", "**/*.ts", "**/*.tsx"]
}

15
libs/design-system/tsconfig.spec.json Normal file
View File

@ -0,0 +1,15 @@
{
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "../../dist/out-tsc",
"module": "commonjs",
"types": ["jest", "node"]
},
"include": [
"**/*.spec.ts",
"**/*.spec.tsx",
"**/*.spec.js",
"**/*.spec.jsx",
"**/*.d.ts"
]
}

15
nx.json
View File

@ -27,13 +27,13 @@
]
},
"projects": {
"api-skolplattformen": {
"api": {
"tags": []
},
"api-hjarntorget": {
"tags": []
},
"api": {
"api-skolplattformen": {
"tags": []
},
"api-test-app": {
@ -42,12 +42,21 @@
"curriculum": {
"tags": []
},
"design-system": {
"tags": []
},
"hooks": {
"tags": []
},
"skolplattformen-app": {
"tags": [],
"implicitDependencies": ["api-skolplattformen", "api-hjarntorget", "api", "hooks", "curriculum"]
"implicitDependencies": [
"api-skolplattformen",
"api-hjarntorget",
"api",
"hooks",
"curriculum"
]
}
}
}

1
package.json
View File

@ -25,6 +25,7 @@
"@react-navigation/bottom-tabs": "5.11.9",
"@react-navigation/native": "5.9.8",
"@react-navigation/stack": "5.14.4",
"@shopify/restyle": "^1.6.0",
"@ui-kitten/components": "5.0.0",
"@ui-kitten/eva-icons": "5.0.0",
"buffer": "6.0.3",

9
tsconfig.base.json
View File

@ -14,16 +14,13 @@
"skipDefaultLibCheck": true,
"baseUrl": ".",
"paths": {
"@skolplattformen/api": [
"libs/api/lib/index.ts"
],
"@skolplattformen/api": ["libs/api/lib/index.ts"],
"@skolplattformen/api-hjarntorget": ["libs/api-hjarntorget/lib/index.ts"],
"@skolplattformen/api-skolplattformen": [
"libs/api-skolplattformen/lib/index.ts"
],
"@skolplattformen/api-hjarntorget": [
"libs/api-hjarntorget/lib/index.ts"
],
"@skolplattformen/curriculum": ["libs/curriculum/src/index.ts"],
"@skolplattformen/design-system": ["libs/design-system/src/index.ts"],
"@skolplattformen/hooks": ["libs/hooks/src/index.ts"]
}
}

49
workspace.json
View File

@ -1,25 +1,23 @@
{
"version": 2,
"projects": {
"api-skolplattformen": {
"root": "libs/api-skolplattformen",
"sourceRoot": "libs/api-skolplattformen/src",
"api": {
"root": "libs/api",
"sourceRoot": "libs/api",
"projectType": "library",
"targets": {
"lint": {
"executor": "@nrwl/linter:eslint",
"outputs": ["{options.outputFile}"],
"options": {
"lintFilePatterns": [
"libs/api-skolplattformen/**/*.{ts,tsx,js,jsx}"
]
"lintFilePatterns": ["libs/api/**/*.{ts,tsx,js,jsx}"]
}
},
"test": {
"executor": "@nrwl/jest:jest",
"outputs": ["coverage/libs/api-skolplattformen"],
"options": {
"jestConfig": "libs/api-skolplattformen/jest.config.js",
"jestConfig": "libs/api/jest.config.js",
"passWithNoTests": true
}
}
@ -34,9 +32,7 @@
"executor": "@nrwl/linter:eslint",
"outputs": ["{options.outputFile}"],
"options": {
"lintFilePatterns": [
"libs/api-hjarntorget/**/*.{ts,tsx,js,jsx}"
]
"lintFilePatterns": ["libs/api-hjarntorget/**/*.{ts,tsx,js,jsx}"]
}
},
"test": {
@ -94,9 +90,9 @@
}
}
},
"api": {
"root": "libs/api",
"sourceRoot": "libs/api",
"api-skolplattformen": {
"root": "libs/api-skolplattformen",
"sourceRoot": "libs/api-skolplattformen/src",
"projectType": "library",
"targets": {
"lint": {
@ -104,7 +100,7 @@
"outputs": ["{options.outputFile}"],
"options": {
"lintFilePatterns": [
"libs/api/**/*.{ts,tsx,js,jsx}"
"libs/api-skolplattformen/**/*.{ts,tsx,js,jsx}"
]
}
},
@ -112,7 +108,7 @@
"executor": "@nrwl/jest:jest",
"outputs": ["coverage/libs/api-skolplattformen"],
"options": {
"jestConfig": "libs/api/jest.config.js",
"jestConfig": "libs/api-skolplattformen/jest.config.js",
"passWithNoTests": true
}
}
@ -140,6 +136,28 @@
}
}
},
"design-system": {
"root": "libs/design-system",
"sourceRoot": "libs/design-system/src",
"projectType": "library",
"targets": {
"lint": {
"executor": "@nrwl/linter:eslint",
"outputs": ["{options.outputFile}"],
"options": {
"lintFilePatterns": ["libs/design-system/**/*.{ts,tsx,js,jsx}"]
}
},
"test": {
"executor": "@nrwl/jest:jest",
"outputs": ["coverage/libs/design-system"],
"options": {
"jestConfig": "libs/design-system/jest.config.js",
"passWithNoTests": true
}
}
}
},
"hooks": {
"root": "libs/hooks",
"sourceRoot": "libs/hooks/src",
@ -167,7 +185,6 @@
"sourceRoot": "apps/skolplattformen-app/src",
"projectType": "application",
"targets": {
"build": {
"executor": "@nrwl/react-native:bundle",
"outputs": ["apps/skolplattformen-app/build"],

5
yarn.lock
View File

@ -2397,6 +2397,11 @@
estree-walker "^2.0.1"
picomatch "^2.2.2"
"@shopify/restyle@^1.6.0":
version "1.6.0"
resolved "https://registry.yarnpkg.com/@shopify/restyle/-/restyle-1.6.0.tgz#aa33e9c0f207264be486e1bd098fe069dd49a96d"
integrity sha512-Zj+xrKtN22YRP3RBk6mNdd7YPK0fbe7D/wz6ITOtqNwEheSJQ1EJ37pYds9WRNaDXyc3k9uupe1hHJ1nmahikA==
"@sideway/address@^4.1.0":
version "4.1.2"
resolved "https://registry.npmjs.org/@sideway/address/-/address-4.1.2.tgz"