|
@@ -5,7 +5,7 @@ import {FlatList} from 'react-native';
|
5
|
5
|
import i18n from "i18n-js";
|
6
|
6
|
import DashboardItem from "../../components/Home/EventDashboardItem";
|
7
|
7
|
import WebSectionList from "../../components/Screens/WebSectionList";
|
8
|
|
-import {withTheme} from 'react-native-paper';
|
|
8
|
+import {Avatar, Banner, withTheme} from 'react-native-paper';
|
9
|
9
|
import FeedItem from "../../components/Home/FeedItem";
|
10
|
10
|
import SquareDashboardItem from "../../components/Home/SmallDashboardItem";
|
11
|
11
|
import PreviewEventDashboardItem from "../../components/Home/PreviewEventDashboardItem";
|
|
@@ -19,6 +19,9 @@ import type {CustomTheme} from "../../managers/ThemeManager";
|
19
|
19
|
import {View} from "react-native-animatable";
|
20
|
20
|
import ConnectionManager from "../../managers/ConnectionManager";
|
21
|
21
|
import LogoutDialog from "../../components/Amicale/LogoutDialog";
|
|
22
|
+import {withCollapsible} from "../../utils/withCollapsible";
|
|
23
|
+import {Collapsible} from "react-navigation-collapsible";
|
|
24
|
+import AsyncStorageManager from "../../managers/AsyncStorageManager";
|
22
|
25
|
// import DATA from "../dashboard_data.json";
|
23
|
26
|
|
24
|
27
|
|
|
@@ -95,10 +98,12 @@ type Props = {
|
95
|
98
|
navigation: StackNavigationProp,
|
96
|
99
|
route: { params: any, ... },
|
97
|
100
|
theme: CustomTheme,
|
|
101
|
+ collapsibleStack: Collapsible,
|
98
|
102
|
}
|
99
|
103
|
|
100
|
104
|
type State = {
|
101
|
105
|
dialogVisible: boolean,
|
|
106
|
+ bannerVisible: boolean,
|
102
|
107
|
}
|
103
|
108
|
|
104
|
109
|
/**
|
|
@@ -115,6 +120,7 @@ class HomeScreen extends React.Component<Props, State> {
|
115
|
120
|
|
116
|
121
|
state = {
|
117
|
122
|
dialogVisible: false,
|
|
123
|
+ bannerVisible: false,
|
118
|
124
|
}
|
119
|
125
|
|
120
|
126
|
constructor(props) {
|
|
@@ -140,6 +146,11 @@ class HomeScreen extends React.Component<Props, State> {
|
140
|
146
|
this.props.navigation.addListener('focus', this.onScreenFocus);
|
141
|
147
|
// Handle link open when home is focused
|
142
|
148
|
this.props.navigation.addListener('state', this.handleNavigationParams);
|
|
149
|
+ setTimeout(this.onBannerTimeout, 2000);
|
|
150
|
+ }
|
|
151
|
+
|
|
152
|
+ onBannerTimeout = () => {
|
|
153
|
+ this.setState({bannerVisible: AsyncStorageManager.getInstance().preferences.homeShowBanner.current === "1"})
|
143
|
154
|
}
|
144
|
155
|
|
145
|
156
|
onScreenFocus = () => {
|
|
@@ -535,22 +546,46 @@ class HomeScreen extends React.Component<Props, State> {
|
535
|
546
|
this.fabRef.current.onScroll(event);
|
536
|
547
|
};
|
537
|
548
|
|
|
549
|
+ /**
|
|
550
|
+ * Callback used when closing the banner.
|
|
551
|
+ * This hides the banner and saves to preferences to prevent it from reopening
|
|
552
|
+ */
|
|
553
|
+ onHideBanner = () => {
|
|
554
|
+ this.setState({bannerVisible: false});
|
|
555
|
+ AsyncStorageManager.getInstance().savePref(
|
|
556
|
+ AsyncStorageManager.getInstance().preferences.homeShowBanner.key,
|
|
557
|
+ '0'
|
|
558
|
+ );
|
|
559
|
+ };
|
|
560
|
+
|
|
561
|
+ onLoginBanner = () => {
|
|
562
|
+ this.onHideBanner();
|
|
563
|
+ this.props.navigation.navigate("login", {nextScreen: "profile"});
|
|
564
|
+ }
|
|
565
|
+
|
538
|
566
|
render() {
|
|
567
|
+ const {containerPaddingTop} = this.props.collapsibleStack;
|
539
|
568
|
return (
|
540
|
569
|
<View
|
541
|
570
|
style={{flex: 1}}
|
542
|
571
|
>
|
543
|
|
- <WebSectionList
|
544
|
|
- {...this.props}
|
545
|
|
- createDataset={this.createDataset}
|
546
|
|
- autoRefreshTime={REFRESH_TIME}
|
547
|
|
- refreshOnFocus={true}
|
548
|
|
- fetchUrl={DATA_URL}
|
549
|
|
- renderItem={this.getRenderItem}
|
550
|
|
- itemHeight={FEED_ITEM_HEIGHT}
|
551
|
|
- onScroll={this.onScroll}
|
552
|
|
- showError={false}
|
553
|
|
- />
|
|
572
|
+ <View style={{
|
|
573
|
+ position: "absolute",
|
|
574
|
+ width: "100%",
|
|
575
|
+ height: "100%",
|
|
576
|
+ }}>
|
|
577
|
+ <WebSectionList
|
|
578
|
+ {...this.props}
|
|
579
|
+ createDataset={this.createDataset}
|
|
580
|
+ autoRefreshTime={REFRESH_TIME}
|
|
581
|
+ refreshOnFocus={true}
|
|
582
|
+ fetchUrl={DATA_URL}
|
|
583
|
+ renderItem={this.getRenderItem}
|
|
584
|
+ itemHeight={FEED_ITEM_HEIGHT}
|
|
585
|
+ onScroll={this.onScroll}
|
|
586
|
+ showError={false}
|
|
587
|
+ />
|
|
588
|
+ </View>
|
554
|
589
|
<AnimatedFAB
|
555
|
590
|
{...this.props}
|
556
|
591
|
ref={this.fabRef}
|
|
@@ -562,9 +597,32 @@ class HomeScreen extends React.Component<Props, State> {
|
562
|
597
|
visible={this.state.dialogVisible}
|
563
|
598
|
onDismiss={this.hideDisconnectDialog}
|
564
|
599
|
/>
|
|
600
|
+ <Banner
|
|
601
|
+ style={{
|
|
602
|
+ marginTop: containerPaddingTop,
|
|
603
|
+ backgroundColor: this.props.theme.colors.surface
|
|
604
|
+ }}
|
|
605
|
+ visible={this.state.bannerVisible}
|
|
606
|
+ actions={[
|
|
607
|
+ {
|
|
608
|
+ label: i18n.t('homeScreen.loginBanner.login'),
|
|
609
|
+ onPress: this.onLoginBanner,
|
|
610
|
+ },
|
|
611
|
+ {
|
|
612
|
+ label: i18n.t('homeScreen.loginBanner.later'),
|
|
613
|
+ onPress: this.onHideBanner,
|
|
614
|
+ },
|
|
615
|
+ ]}
|
|
616
|
+ icon={() => <Avatar.Icon
|
|
617
|
+ icon={'login'}
|
|
618
|
+ size={50}
|
|
619
|
+ />}
|
|
620
|
+ >
|
|
621
|
+ {i18n.t('homeScreen.loginBanner.message')}
|
|
622
|
+ </Banner>
|
565
|
623
|
</View>
|
566
|
624
|
);
|
567
|
625
|
}
|
568
|
626
|
}
|
569
|
627
|
|
570
|
|
-export default withTheme(HomeScreen);
|
|
628
|
+export default withCollapsible(withTheme(HomeScreen));
|