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 AsyncStorage from '@react-native-async-storage/async-storage'
|
||||
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 { ApplicationProvider, IconRegistry } from '@ui-kitten/components'
|
||||
import { EvaIconsPack } from '@ui-kitten/eva-icons'
|
||||
import React, { useState } from 'react'
|
||||
import React, { useContext } from 'react'
|
||||
import { StatusBar, useColorScheme } from 'react-native'
|
||||
import { SafeAreaProvider } from 'react-native-safe-area-context'
|
||||
import { AppNavigator } from './components/navigation.component'
|
||||
import { LanguageProvider } from './context/language/languageContext'
|
||||
import {
|
||||
SchoolPlatformProvider,
|
||||
SchoolPlatformContext,
|
||||
} from './context/schoolPlatform/schoolPlatformContext'
|
||||
import { default as customMapping } from './design/mapping.json'
|
||||
import { darkTheme, lightTheme } from './design/themes'
|
||||
import useSettingsStorage from './hooks/useSettingsStorage'
|
||||
import { translations } from './utils/translation'
|
||||
const api = init(fetch, CookieManager)
|
||||
|
||||
const apiSkolplattformen = initSkolplattformen(fetch, CookieManager)
|
||||
const apiHjarntorget = initHjarntorget(fetch, CookieManager)
|
||||
|
||||
const reporter = __DEV__
|
||||
? {
|
||||
|
@ -59,26 +67,31 @@ export default () => {
|
|||
const systemTheme = useColorScheme()
|
||||
|
||||
const colorScheme = usingSystemTheme ? systemTheme : theme
|
||||
|
||||
return (
|
||||
<ApiProvider api={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}
|
||||
customMapping={customMapping}
|
||||
theme={colorScheme === 'dark' ? darkTheme : lightTheme}
|
||||
>
|
||||
<LanguageProvider cache={true} data={translations}>
|
||||
<AppNavigator />
|
||||
</LanguageProvider>
|
||||
</ApplicationProvider>
|
||||
</SafeAreaProvider>
|
||||
</ApiProvider>
|
||||
<SchoolPlatformProvider>
|
||||
<ApiProvider
|
||||
api={apiSkolplattformen}
|
||||
storage={AsyncStorage}
|
||||
reporter={reporter}
|
||||
>
|
||||
<SafeAreaProvider>
|
||||
<StatusBar
|
||||
backgroundColor={colorScheme === 'dark' ? '#2E3137' : '#FFF'}
|
||||
barStyle={colorScheme === 'dark' ? 'light-content' : 'dark-content'}
|
||||
translucent
|
||||
/>
|
||||
<IconRegistry icons={EvaIconsPack} />
|
||||
<ApplicationProvider
|
||||
{...eva}
|
||||
customMapping={customMapping}
|
||||
theme={colorScheme === 'dark' ? darkTheme : lightTheme}
|
||||
>
|
||||
<LanguageProvider cache={true} data={translations}>
|
||||
<AppNavigator />
|
||||
</LanguageProvider>
|
||||
</ApplicationProvider>
|
||||
</SafeAreaProvider>
|
||||
</ApiProvider>
|
||||
</SchoolPlatformProvider>
|
||||
)
|
||||
}
|
||||
|
|
|
@ -13,7 +13,7 @@ import {
|
|||
useStyleSheet,
|
||||
} from '@ui-kitten/components'
|
||||
import Personnummer from 'personnummer'
|
||||
import React, { useEffect, useState } from 'react'
|
||||
import React, { useContext, useEffect, useState } from 'react'
|
||||
import {
|
||||
Image,
|
||||
Linking,
|
||||
|
@ -22,6 +22,7 @@ import {
|
|||
View,
|
||||
} from 'react-native'
|
||||
import { schema } from '../app.json'
|
||||
import { SchoolPlatformContext } from '../context/schoolPlatform/schoolPlatformContext'
|
||||
import useSettingsStorage from '../hooks/useSettingsStorage'
|
||||
import { useTranslation } from '../hooks/useTranslation'
|
||||
import { Layout as LayoutStyle, Sizing, Typography } from '../styles'
|
||||
|
@ -56,8 +57,8 @@ export const Login = () => {
|
|||
const [loginMethodIndex, setLoginMethodIndex] =
|
||||
useSettingsStorage('loginMethodIndex')
|
||||
|
||||
const [schoolPlatform, setSchoolPlatform] = useSettingsStorage(
|
||||
'currentSchoolPlatform'
|
||||
const { currentSchoolPlatform, changeSchoolPlatform } = useContext(
|
||||
SchoolPlatformContext
|
||||
)
|
||||
|
||||
const { t } = useTranslation()
|
||||
|
@ -73,11 +74,11 @@ export const Login = () => {
|
|||
const schoolPlatforms = [
|
||||
{
|
||||
id: 'stockholm-skolplattformen',
|
||||
displayName: 'Stockholm stad',
|
||||
displayName: 'Stockholm stad (Skolplattformen)',
|
||||
},
|
||||
{
|
||||
id: 'goteborg-hjarnkontoret',
|
||||
displayName: 'Göteborg stad',
|
||||
displayName: 'Göteborg stad (Hjärntorget)',
|
||||
},
|
||||
]
|
||||
|
||||
|
@ -98,7 +99,7 @@ export const Login = () => {
|
|||
}
|
||||
|
||||
const getSchoolPlatformName = () => {
|
||||
return schoolPlatforms.find((item) => item.id === schoolPlatform)
|
||||
return schoolPlatforms.find((item) => item.id === currentSchoolPlatform)
|
||||
?.displayName
|
||||
}
|
||||
|
||||
|
@ -296,10 +297,10 @@ export const Login = () => {
|
|||
title={item.displayName}
|
||||
accessible={true}
|
||||
accessoryRight={
|
||||
schoolPlatform === item.id ? CheckIcon : undefined
|
||||
currentSchoolPlatform === item.id ? CheckIcon : undefined
|
||||
}
|
||||
onPress={() => {
|
||||
setSchoolPlatform(item.id)
|
||||
changeSchoolPlatform(item.id)
|
||||
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,
|
||||
theme: 'light',
|
||||
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'
|
||||
export { URLSearchParams } from './URLSearchParams'
|
||||
|
||||
export { wrap };
|
||||
export { wrap };
|
||||
export { Feature } from './features'
|
|
@ -2,8 +2,7 @@
|
|||
"name": "@skolplattformen/api",
|
||||
"version": "0.15.0",
|
||||
"description": "",
|
||||
"main": "dist/index.js",
|
||||
"types": "dist/index.d.ts",
|
||||
"main": "lib/index.ts",
|
||||
"files": [
|
||||
"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