@olea-bps/base 1.1.11 → 1.1.12

package/context/context-user/index.js

@@ -14,7 +14,14 @@
 
 import { createContext, useState, useEffect, useContext, useMemo, useReducer, useCallback } from 'react'
 
-import { useAutoDiscovery, makeRedirectUri, useAuthRequest, exchangeCodeAsync, refreshAsync } from 'expo-auth-session';
+import {
+    useAutoDiscovery,
+    makeRedirectUri,
+    useAuthRequest,
+    exchangeCodeAsync,
+    refreshAsync,
+    fetchUserInfoAsync,
+} from 'expo-auth-session';
 import * as WebBrowser from 'expo-web-browser';
 import * as SecureStore from 'expo-secure-store';
 
@@ -59,9 +66,16 @@ import { DateTime } from 'luxon';
  */
 
 class LoginError extends Error {
-    constructor(message) {
+
+    type;
+    error;
+
+    constructor(message, type, error) {
         super(message);
         this.name = this.constructor.name;
+
+        this.type = type;
+        this.error = error;
     }
 }
 
@@ -225,72 +239,38 @@ function UserContextProvider({ children }) {
     useEffect(
         () => {
             if (accessToken && discovery?.userInfoEndpoint) {
-                fetch(
-                    discovery.userInfoEndpoint,
-                    {
-                        headers: {
-                            'Authorization': 'Bearer ' + accessToken,
+                fetchUserInfoAsync({ accessToken }, discovery)
+                    .then(
+                        userInfo => {
+                            console.debug(componentName, ':', 'fetch user', ':', userInfo);
+
+                            const userInfos = {
+                                ...userInfo,
+                                organizational_units: userInfo?.ou?.map(
+                                    (organizational_unit_name, index) => ({
+                                        name: organizational_unit_name,
+                                        number: userInfo?.ounumber?.[index],
+                                        short_name: userInfo?.oushort?.[index],
+                                    })
+                                ) ?? [],
+                                member_types: [
+                                    ...(userInfo?.employeetype?.includes?.('Student') ? ['student'] : []),
+                                    ...(userInfo?.employeetype?.includes?.('Mitarbeiter') ? ['employee'] : []),
+                                ]
+                            };
+
+                            console.debug(componentName, ':', 'convert response to user', ':', userInfos);
+
+                            setUser(userInfos);
                         }
-                    }
-                ).then(
-                    response => response.json()
-                ).then(
-                    userInfoJsonResponse => {
-                        console.debug(componentName, ':', 'fetch user', ':', userInfoJsonResponse);
-
-                        const userInfos = {
-                            ...userInfoJsonResponse,
-                            organizational_units: userInfoJsonResponse?.ou?.map(
-                                (organizational_unit_name, index) => ({
-                                    name: organizational_unit_name,
-                                    number: userInfoJsonResponse?.ounumber?.[index],
-                                    short_name: userInfoJsonResponse?.oushort?.[index],
-                                })
-                            ) ?? [],
-                            member_types: [
-                                ...(userInfoJsonResponse?.employeetype?.includes?.('Student') ? ['student'] : null),
-                                ...(userInfoJsonResponse?.employeetype?.includes?.('Mitarbeiter') ? ['employee'] : null),
-                            ]
-                        };
-
-                        console.debug(componentName, ':', 'convert response to user', ':', userInfos);
-
-                        setUser(userInfos);
-                    }
-                ).catch(
-                    reason => console.warn(componentName, ':', 'can`t fetch user infos', ':', reason)
-                );
+                    ).catch(
+                        reason => console.warn(componentName, ':', 'can`t fetch user infos', ':', reason)
+                    );
             }
         },
         [accessToken, discovery]
     );
 
-    // Wenn das Format vom Server stimmt wird kann der oberer Hook mit diesem ersetzt werden
-    //useEffect(
-    //    () => {
-    //        if (accessToken && discovery) {
-    //            fetchUserInfoAsync(
-    //                {
-    //                    accessToken: accessToken
-    //                },
-    //                discovery,
-    //            ).then(
-    //                userInfo => console.warn(userInfo)
-    //            ).then(
-    //                response => response.json()
-    //            ).then(
-    //                jsonResponse => {
-    //                    console.debug(componentName, ':', 'fetch user ', jsonResponse);
-    //                    setUser(jsonResponse);
-    //                }
-    //            ).catch(
-    //                reason => console.warn(componentName, ':', 'can`t fetch user infos', ':', reason)
-    //            );
-    //        }
-    //    },
-    // [accessToken, discovery]
-    //);
-
     useEffect(
         () => {
             if (refreshToken && refreshTokenAt && discovery) {
@@ -300,7 +280,7 @@ function UserContextProvider({ children }) {
                     () =>
                         refreshAsync(
                             {
-                                clientId, clientId,
+                                clientId: clientId,
                                 refreshToken: refreshToken,
                             },
                             discovery,
@@ -339,8 +319,13 @@ function UserContextProvider({ children }) {
                             reason => console.log(componentName, ': tokenResponse: Fehler', ':', reason)
                         );
                     } else {
+                        console.debug(componentName, ':', 'login error', ':', codeResponse.type, '(', JSON.stringify(codeResponse.error), ')')
                         // TODO: Prüfen warum der Login nicht klappte und für die einzeilnen Gründe, genauere Fehlerinfos zurückgeben.
-                        throw new LoginError(`Login Failed: ${codeResponse?.type}`);
+                        throw new LoginError(
+                            `Login Failed: ${codeResponse?.type}`,
+                            codeResponse.type,
+                            codeResponse.error,
+                        );
                     }
                 }
             );

package/index.js

@@ -32,6 +32,7 @@ export { default as SettingsDialog } from './components/SettingsDialog';
 export { default as SettingsDialogRadio } from './components/SettingsDialogRadio';
 export { default as SettingsDialogSelect } from './components/SettingsDialogSelect';
 export { default as SettingSection } from './components/SettingSection';
+export { default as TabBarIcon } from './components/TabBarIcon';
 export { default as TimetableCodeInput } from './components/TimetableCodeInput';
 export { default as TimetableDay } from './components/TimetableDay';
 export { default as TimetableEvent } from './components/TimetableEvent';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@olea-bps/base",
-  "version": "1.1.11",
+  "version": "1.1.12",
   "description": "OLEA base library",
   "main": "index.js",
   "repository": {

package/views/PublicTransportTicket/index.js

@@ -174,7 +174,7 @@ export default function PublicTransportTicketView() {
                         </ScrollView>
                         : <>
                             <Text>
-                                Sie sind nicht eingeloogt
+                                {t('user:notLoggedIn')}
                             </Text>
                             <Button
                                 onPress={
@@ -183,10 +183,38 @@ export default function PublicTransportTicketView() {
                                             ? login()
                                                 .catch(
                                                     reason => {
-                                                        console.debug(componentName, ':', 'login failed', ':', reason);
+                                                        console.debug(componentName, ':', 'login failed', ':', reason, '(', JSON.stringify({ type: reason.type, error: reason.error }, ')'))
+
+                                                        let loginFailedInfoMessage = t('user:tryLoginAgain');
+                                                        switch (reason.type) {
+                                                            case 'dismiss': {
+                                                                loginFailedInfoMessage = [
+                                                                    t('user:tryLoginAgain'),
+                                                                ].join('\n');
+                                                                break;
+                                                            }
+                                                            case 'error': {
+                                                                const error_code = reason.error.code
+
+                                                                loginFailedInfoMessage = [
+                                                                    t('user:tryLoginAgain'),
+                                                                    t(`user:error:${error_code}`),
+                                                                    JSON.stringify({ error: reason.error }),
+                                                                ].join('\n');
+                                                                break;
+                                                            }
+                                                            default: {
+                                                                loginFailedInfoMessage = [
+                                                                    t('user:tryLoginAgain'),
+                                                                    `Errortype: ${reason.type}`,
+                                                                    JSON.stringify(reason.error),
+                                                                ].join('\n');
+                                                            }
+                                                        }
+
                                                         Alert.alert(
                                                             t('user:loginFailed'),
-                                                            t('user:tryLoginAgain'),
+                                                            loginFailedInfoMessage,
                                                         );
                                                     }
                                                 )

package/views/SettingsAppInfo/index.js

@@ -12,16 +12,16 @@
  * limitations under the License.
  */
 
-import React from 'react';
-import {SafeAreaView, View, Image, TouchableOpacity, Linking} from 'react-native';
+import React from 'react'
+import { SafeAreaView, View, ScrollView, Image, TouchableOpacity, Linking } from 'react-native'
 
-import {List, withTheme} from 'react-native-paper';
-import {withTranslation} from "react-i18next";
+import { List, Text, withTheme } from 'react-native-paper'
+import { withTranslation } from 'react-i18next'
 
-import * as Application from 'expo-application';
+import * as Application from 'expo-application'
 
-import AppbarComponent from '../../components/AppBar';
-import componentStyles from "./styles";
+import AppbarComponent from '../../components/AppBar'
+import componentStyles from './styles'
 
 /**
  * Settings app info
@@ -33,54 +33,73 @@ import componentStyles from "./styles";
  *  - none
  */
 class AppInfoSettingsView extends React.Component {
-    // Styles of this component
-    styles;
+  // Styles of this component
+  styles
 
-    constructor(props) {
-        super(props);
+  constructor (props) {
+    super(props)
 
-        const {theme} = this.props;
-        this.styles = componentStyles(theme);
-    }
+    const { theme } = this.props
+    this.styles = componentStyles(theme)
+  }
 
-    render() {
-        const { theme: { themeStyles, appSettings }, t } = this.props;
+  render () {
+    const { theme: { themeStyles, appSettings }, t } = this.props
+    const { legalNotices } = appSettings
 
-        return (
-            <SafeAreaView style={[this.styles.container, themeStyles.appSafeAreaContainer]}>
-                <AppbarComponent
-                    {...this.props}
-                    title={t('settings:version.title')}
-                />
-                <View style={themeStyles.container}>
-                    <List.Section>
-                        <List.Item
-                            key="version"
-                            title={t('settings:version.version')}
-                            description={Application.nativeApplicationVersion ?? t("settings:version.unknown")}
-                            titleNumberOfLines={2}
-                            titleStyle={this.styles.listItemTitle}
-                            descriptionStyle={this.styles.listItemDescription}
-                        >
-                        </List.Item>
-                    </List.Section>
+    return (
+      <SafeAreaView style={[this.styles.container, themeStyles.appSafeAreaContainer]}>
+        <AppbarComponent
+          {...this.props}
+          title={t('settings:version.title')}
+        />
+        <View style={themeStyles.container}>
+          <ScrollView>
+            <List.Section>
+              <List.Item
+                key='version'
+                title={t('settings:version.version')}
+                description={Application.nativeApplicationVersion ?? t('settings:version.unknown')}
+                titleNumberOfLines={2}
+                titleStyle={this.styles.listItemTitle}
+                descriptionStyle={this.styles.listItemDescription}
+              />
+              {legalNotices?.licenseText && (
+                <List.Accordion
+                  title={t('settings:version.licenses', { defaultValue: 'Licenses' })}
+                  titleStyle={this.styles.listItemTitle}
+                >
+                  <View style={this.styles.licenseContent}>
+                    {legalNotices.noticeText && (
+                      <Text selectable style={this.styles.licenseText}>
+                        {legalNotices.noticeText}
+                      </Text>
+                    )}
+                    <Text selectable style={this.styles.licenseText}>
+                      {legalNotices.licenseText}
+                    </Text>
+                  </View>
+                </List.Accordion>
+              )}
+            </List.Section>
 
-                  {
-                    appSettings.infoBanner &&
-                      <TouchableOpacity
-                        onPress={() => Linking.openURL(appSettings.infoBannerUrl)}
-                        activeOpacity={0.7}
-                      >
-                        <Image
-                          style={this.styles.infoBanner}
-                          source={appSettings.infoBanner}
-                          resizeMode="contain" />
-                      </TouchableOpacity>
-                  }
-                </View>
-            </SafeAreaView>
-        );
-    }
+            {appSettings.infoBanner && (
+              <TouchableOpacity
+                onPress={() => Linking.openURL(appSettings.infoBannerUrl)}
+                activeOpacity={0.7}
+              >
+                <Image
+                  style={this.styles.infoBanner}
+                  source={appSettings.infoBanner}
+                  resizeMode='contain'
+                />
+              </TouchableOpacity>
+            )}
+          </ScrollView>
+        </View>
+      </SafeAreaView>
+    )
+  }
 }
 
 export default (withTranslation()(withTheme(AppInfoSettingsView)))

package/views/SettingsAppInfo/styles.js

@@ -1,18 +1,27 @@
-export default function(theme) {
-    return {
-        selectOption: {
-            display: 'flex',
-            flexDirection: 'row',
-            justifyContent: 'space-between'
-        },
-        listItemTitle: {
-            fontSize: theme.fontSizes.l
-        },
-        listItemDescription: {
-            fontSize: theme.fontSizes.m
-        },
-        infoBanner: {
-            width: '100%'
-        }
+export default function (theme) {
+  return {
+    selectOption: {
+      display: 'flex',
+      flexDirection: 'row',
+      justifyContent: 'space-between'
+    },
+    listItemTitle: {
+      fontSize: theme.fontSizes.l
+    },
+    listItemDescription: {
+      fontSize: theme.fontSizes.m
+    },
+    licenseContent: {
+      paddingHorizontal: 16,
+      paddingBottom: 16
+    },
+    licenseText: {
+      fontSize: theme.fontSizes.m,
+      color: theme.colors.text,
+      marginBottom: 16
+    },
+    infoBanner: {
+      width: '100%'
     }
+  }
 }

package/views/SettingsUser/index.js

@@ -138,7 +138,7 @@ export default function UserSettingsView(props) {
                         </>
                         : <>
                             <Text>
-                                Sie sind nicht eingeloogt
+                                {t('user:notLoggedIn')}
                             </Text>
                             <Button
                                 onPress={