feat: 🎸 Started on provider for selecting platform + feature to
This commit is contained in:
parent
ba45cfd796
commit
1aaaeb64e3
|
@ -1,20 +1,28 @@
|
||||||
import * as eva from '@eva-design/eva'
|
import * as eva from '@eva-design/eva'
|
||||||
import AsyncStorage from '@react-native-async-storage/async-storage'
|
import AsyncStorage from '@react-native-async-storage/async-storage'
|
||||||
import CookieManager from '@react-native-cookies/cookies'
|
import CookieManager from '@react-native-cookies/cookies'
|
||||||
import init from '@skolplattformen/api-hjarntorget'
|
import initSkolplattformen from '@skolplattformen/api-skolplattformen'
|
||||||
|
import initHjarntorget from '@skolplattformen/api-hjarntorget'
|
||||||
|
|
||||||
import { ApiProvider } from '@skolplattformen/hooks'
|
import { ApiProvider } from '@skolplattformen/hooks'
|
||||||
import { ApplicationProvider, IconRegistry } from '@ui-kitten/components'
|
import { ApplicationProvider, IconRegistry } from '@ui-kitten/components'
|
||||||
import { EvaIconsPack } from '@ui-kitten/eva-icons'
|
import { EvaIconsPack } from '@ui-kitten/eva-icons'
|
||||||
import React, { useState } from 'react'
|
import React, { useContext } from 'react'
|
||||||
import { StatusBar, useColorScheme } from 'react-native'
|
import { StatusBar, useColorScheme } from 'react-native'
|
||||||
import { SafeAreaProvider } from 'react-native-safe-area-context'
|
import { SafeAreaProvider } from 'react-native-safe-area-context'
|
||||||
import { AppNavigator } from './components/navigation.component'
|
import { AppNavigator } from './components/navigation.component'
|
||||||
import { LanguageProvider } from './context/language/languageContext'
|
import { LanguageProvider } from './context/language/languageContext'
|
||||||
|
import {
|
||||||
|
SchoolPlatformProvider,
|
||||||
|
SchoolPlatformContext,
|
||||||
|
} from './context/schoolPlatform/schoolPlatformContext'
|
||||||
import { default as customMapping } from './design/mapping.json'
|
import { default as customMapping } from './design/mapping.json'
|
||||||
import { darkTheme, lightTheme } from './design/themes'
|
import { darkTheme, lightTheme } from './design/themes'
|
||||||
import useSettingsStorage from './hooks/useSettingsStorage'
|
import useSettingsStorage from './hooks/useSettingsStorage'
|
||||||
import { translations } from './utils/translation'
|
import { translations } from './utils/translation'
|
||||||
const api = init(fetch, CookieManager)
|
|
||||||
|
const apiSkolplattformen = initSkolplattformen(fetch, CookieManager)
|
||||||
|
const apiHjarntorget = initHjarntorget(fetch, CookieManager)
|
||||||
|
|
||||||
const reporter = __DEV__
|
const reporter = __DEV__
|
||||||
? {
|
? {
|
||||||
|
@ -59,26 +67,31 @@ export default () => {
|
||||||
const systemTheme = useColorScheme()
|
const systemTheme = useColorScheme()
|
||||||
|
|
||||||
const colorScheme = usingSystemTheme ? systemTheme : theme
|
const colorScheme = usingSystemTheme ? systemTheme : theme
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<ApiProvider api={api} storage={AsyncStorage} reporter={reporter}>
|
<SchoolPlatformProvider>
|
||||||
<SafeAreaProvider>
|
<ApiProvider
|
||||||
<StatusBar
|
api={apiSkolplattformen}
|
||||||
backgroundColor={colorScheme === 'dark' ? '#2E3137' : '#FFF'}
|
storage={AsyncStorage}
|
||||||
barStyle={colorScheme === 'dark' ? 'light-content' : 'dark-content'}
|
reporter={reporter}
|
||||||
translucent
|
>
|
||||||
/>
|
<SafeAreaProvider>
|
||||||
<IconRegistry icons={EvaIconsPack} />
|
<StatusBar
|
||||||
<ApplicationProvider
|
backgroundColor={colorScheme === 'dark' ? '#2E3137' : '#FFF'}
|
||||||
{...eva}
|
barStyle={colorScheme === 'dark' ? 'light-content' : 'dark-content'}
|
||||||
customMapping={customMapping}
|
translucent
|
||||||
theme={colorScheme === 'dark' ? darkTheme : lightTheme}
|
/>
|
||||||
>
|
<IconRegistry icons={EvaIconsPack} />
|
||||||
<LanguageProvider cache={true} data={translations}>
|
<ApplicationProvider
|
||||||
<AppNavigator />
|
{...eva}
|
||||||
</LanguageProvider>
|
customMapping={customMapping}
|
||||||
</ApplicationProvider>
|
theme={colorScheme === 'dark' ? darkTheme : lightTheme}
|
||||||
</SafeAreaProvider>
|
>
|
||||||
</ApiProvider>
|
<LanguageProvider cache={true} data={translations}>
|
||||||
|
<AppNavigator />
|
||||||
|
</LanguageProvider>
|
||||||
|
</ApplicationProvider>
|
||||||
|
</SafeAreaProvider>
|
||||||
|
</ApiProvider>
|
||||||
|
</SchoolPlatformProvider>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
@ -13,7 +13,7 @@ import {
|
||||||
useStyleSheet,
|
useStyleSheet,
|
||||||
} from '@ui-kitten/components'
|
} from '@ui-kitten/components'
|
||||||
import Personnummer from 'personnummer'
|
import Personnummer from 'personnummer'
|
||||||
import React, { useEffect, useState } from 'react'
|
import React, { useContext, useEffect, useState } from 'react'
|
||||||
import {
|
import {
|
||||||
Image,
|
Image,
|
||||||
Linking,
|
Linking,
|
||||||
|
@ -22,6 +22,7 @@ import {
|
||||||
View,
|
View,
|
||||||
} from 'react-native'
|
} from 'react-native'
|
||||||
import { schema } from '../app.json'
|
import { schema } from '../app.json'
|
||||||
|
import { SchoolPlatformContext } from '../context/schoolPlatform/schoolPlatformContext'
|
||||||
import useSettingsStorage from '../hooks/useSettingsStorage'
|
import useSettingsStorage from '../hooks/useSettingsStorage'
|
||||||
import { useTranslation } from '../hooks/useTranslation'
|
import { useTranslation } from '../hooks/useTranslation'
|
||||||
import { Layout as LayoutStyle, Sizing, Typography } from '../styles'
|
import { Layout as LayoutStyle, Sizing, Typography } from '../styles'
|
||||||
|
@ -56,8 +57,8 @@ export const Login = () => {
|
||||||
const [loginMethodIndex, setLoginMethodIndex] =
|
const [loginMethodIndex, setLoginMethodIndex] =
|
||||||
useSettingsStorage('loginMethodIndex')
|
useSettingsStorage('loginMethodIndex')
|
||||||
|
|
||||||
const [schoolPlatform, setSchoolPlatform] = useSettingsStorage(
|
const { currentSchoolPlatform, changeSchoolPlatform } = useContext(
|
||||||
'currentSchoolPlatform'
|
SchoolPlatformContext
|
||||||
)
|
)
|
||||||
|
|
||||||
const { t } = useTranslation()
|
const { t } = useTranslation()
|
||||||
|
@ -73,11 +74,11 @@ export const Login = () => {
|
||||||
const schoolPlatforms = [
|
const schoolPlatforms = [
|
||||||
{
|
{
|
||||||
id: 'stockholm-skolplattformen',
|
id: 'stockholm-skolplattformen',
|
||||||
displayName: 'Stockholm stad',
|
displayName: 'Stockholm stad (Skolplattformen)',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'goteborg-hjarnkontoret',
|
id: 'goteborg-hjarnkontoret',
|
||||||
displayName: 'Göteborg stad',
|
displayName: 'Göteborg stad (Hjärntorget)',
|
||||||
},
|
},
|
||||||
]
|
]
|
||||||
|
|
||||||
|
@ -98,7 +99,7 @@ export const Login = () => {
|
||||||
}
|
}
|
||||||
|
|
||||||
const getSchoolPlatformName = () => {
|
const getSchoolPlatformName = () => {
|
||||||
return schoolPlatforms.find((item) => item.id === schoolPlatform)
|
return schoolPlatforms.find((item) => item.id === currentSchoolPlatform)
|
||||||
?.displayName
|
?.displayName
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -296,10 +297,10 @@ export const Login = () => {
|
||||||
title={item.displayName}
|
title={item.displayName}
|
||||||
accessible={true}
|
accessible={true}
|
||||||
accessoryRight={
|
accessoryRight={
|
||||||
schoolPlatform === item.id ? CheckIcon : undefined
|
currentSchoolPlatform === item.id ? CheckIcon : undefined
|
||||||
}
|
}
|
||||||
onPress={() => {
|
onPress={() => {
|
||||||
setSchoolPlatform(item.id)
|
changeSchoolPlatform(item.id)
|
||||||
setShowSchoolPlatformPicker(false)
|
setShowSchoolPlatformPicker(false)
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
|
|
|
@ -0,0 +1,37 @@
|
||||||
|
import useSettingsStorage from '../../hooks/useSettingsStorage'
|
||||||
|
import React, { createContext } from 'react'
|
||||||
|
|
||||||
|
interface SchoolPlatformProps {
|
||||||
|
currentSchoolPlatform: string
|
||||||
|
changeSchoolPlatform: (platform: string) => void
|
||||||
|
}
|
||||||
|
|
||||||
|
const defaultState: SchoolPlatformProps = {
|
||||||
|
currentSchoolPlatform: 'stockholm-skolplattformen',
|
||||||
|
changeSchoolPlatform: (platform: string) =>
|
||||||
|
console.log('DEBUG ONLY: changing to', platform),
|
||||||
|
}
|
||||||
|
|
||||||
|
export const SchoolPlatformProvider: React.FC = ({ children }) => {
|
||||||
|
const [currentSchoolPlatform, setCurrentSchoolPlatform] = useSettingsStorage(
|
||||||
|
'currentSchoolPlatform'
|
||||||
|
)
|
||||||
|
|
||||||
|
const changeSchoolPlatform = (platform: string) => {
|
||||||
|
setCurrentSchoolPlatform(platform)
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<SchoolPlatformContext.Provider
|
||||||
|
value={{
|
||||||
|
currentSchoolPlatform,
|
||||||
|
changeSchoolPlatform,
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{children}
|
||||||
|
</SchoolPlatformContext.Provider>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export const SchoolPlatformContext =
|
||||||
|
createContext<SchoolPlatformProps>(defaultState)
|
|
@ -9,7 +9,7 @@ export const settingsState = proxy({
|
||||||
usingSystemTheme: true,
|
usingSystemTheme: true,
|
||||||
theme: 'light',
|
theme: 'light',
|
||||||
cachedPersonalIdentityNumber: '',
|
cachedPersonalIdentityNumber: '',
|
||||||
currentSchoolPlatform: 'stockholm-skolplattformen'
|
currentSchoolPlatform: 'stockholm-skolplattformen',
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|
|
@ -0,0 +1,5 @@
|
||||||
|
import { Feature } from '@skolplattformen/api'
|
||||||
|
|
||||||
|
export const features: Feature[] = [
|
||||||
|
{ name: 'login', enabled: true },
|
||||||
|
]
|
|
@ -0,0 +1,4 @@
|
||||||
|
export interface Feature {
|
||||||
|
name: string;
|
||||||
|
enabled: boolean;
|
||||||
|
}
|
|
@ -13,4 +13,5 @@ export {
|
||||||
} from './cookies'
|
} from './cookies'
|
||||||
export { URLSearchParams } from './URLSearchParams'
|
export { URLSearchParams } from './URLSearchParams'
|
||||||
|
|
||||||
export { wrap };
|
export { wrap };
|
||||||
|
export { Feature } from './features'
|
|
@ -2,8 +2,7 @@
|
||||||
"name": "@skolplattformen/api",
|
"name": "@skolplattformen/api",
|
||||||
"version": "0.15.0",
|
"version": "0.15.0",
|
||||||
"description": "",
|
"description": "",
|
||||||
"main": "dist/index.js",
|
"main": "lib/index.ts",
|
||||||
"types": "dist/index.d.ts",
|
|
||||||
"files": [
|
"files": [
|
||||||
"dist/**/*"
|
"dist/**/*"
|
||||||
],
|
],
|
||||||
|
|
|
@ -0,0 +1,27 @@
|
||||||
|
import { Feature } from '@skolplattformen/api'
|
||||||
|
import React from 'react'
|
||||||
|
|
||||||
|
const FeatureFlagsContext = React.createContext<Feature[]>([])
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
features: Feature[]
|
||||||
|
}
|
||||||
|
|
||||||
|
export const FeatureProvider: React.FC<Props> = (props) => {
|
||||||
|
return (
|
||||||
|
<FeatureFlagsContext.Provider value={props.features} {...props}>
|
||||||
|
{props.children}
|
||||||
|
</FeatureFlagsContext.Provider>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export const useFeature = (name: string) => {
|
||||||
|
const features = React.useContext<Feature[]>(FeatureFlagsContext)
|
||||||
|
if (features === null) {
|
||||||
|
throw new Error('You must wrap your components in a FeatureProvider.')
|
||||||
|
}
|
||||||
|
|
||||||
|
const feature = features.find((f) => f.name === name)
|
||||||
|
|
||||||
|
return feature && feature.enabled
|
||||||
|
}
|
Loading…
Reference in New Issue