feat: news on welcome screen

.github/workflows/distribute-android.yml

@@ -7,14 +7,23 @@ on:
         type: choice
         description: IS_DEVELOPMENT
         options:
-          - 0
-          - 1
+          - false
+          - true
+
       IS_SSS_ENABLED:
         type: choice
         description: IS_SSS_ENABLED
         options:
           - false
           - true
+
+      IS_WELCOME_NEWS_ENABLED:
+        type: choice
+        description: IS_WELCOME_NEWS_ENABLED
+        options:
+          - false
+          - true
+
   workflow_call:
     inputs:
       IS_DEVELOPMENT:
@@ -23,6 +32,9 @@ on:
       IS_SSS_ENABLED:
         required: true
         type: string
+      IS_WELCOME_NEWS_ENABLED:
+        required: true
+        type: string
 
 jobs:
   build:
@@ -79,6 +91,7 @@ jobs:
           echo "ADJUST_TOKEN=${{secrets.ADJUST_TOKEN}}" >> .env
           echo "ADJUST_ENVIRONMENT=${{secrets.ADJUST_ENVIRONMENT}}" >> .env
           echo "IS_SSS_ENABLED=${{github.event.inputs.IS_SSS_ENABLED}}" >> .env
+          echo "IS_WELCOME_NEWS_ENABLED=${{github.event.inputs.IS_WELCOME_NEWS_ENABLED}}" >> .env
 
       - name: Install Fastlane
         run: |

.github/workflows/distribute-ios.yml

@@ -7,14 +7,23 @@ on:
         type: choice
         description: IS_DEVELOPMENT
         options:
-          - 0
-          - 1
+          - false
+          - true
+
       IS_SSS_ENABLED:
         type: choice
         description: IS_SSS_ENABLED
         options:
           - false
           - true
+
+      IS_WELCOME_NEWS_ENABLED:
+        type: choice
+        description: IS_WELCOME_NEWS_ENABLED
+        options:
+          - false
+          - true
+
   workflow_call:
     inputs:
       IS_DEVELOPMENT:
@@ -23,6 +32,9 @@ on:
       IS_SSS_ENABLED:
         required: true
         type: string
+      IS_WELCOME_NEWS_ENABLED:
+        required: true
+        type: string
 
 jobs:
   build:
@@ -95,6 +107,7 @@ jobs:
           echo "ADJUST_TOKEN=${{secrets.ADJUST_TOKEN}}" >> .env
           echo "ADJUST_ENVIRONMENT=${{secrets.ADJUST_ENVIRONMENT}}" >> .env
           echo "IS_SSS_ENABLED=${{github.event.inputs.IS_SSS_ENABLED}}" >> .env
+          echo "IS_WELCOME_NEWS_ENABLED=${{github.event.inputs.IS_WELCOME_NEWS_ENABLED}}" >> .env
 
       - name: Execute build
         run: |

.github/workflows/distribute.yml

@@ -3,6 +3,13 @@ name: Distribute apps
 on:
   workflow_dispatch:
     inputs:
+      IS_WELCOME_NEWS_ENABLED:
+        type: choice
+        description: IS_WELCOME_NEWS_ENABLED
+        options:
+          - false
+          - true
+
       IS_SSS_ENABLED:
         type: choice
         description: IS_SSS_ENABLED
@@ -32,8 +39,9 @@ jobs:
     uses: ./.github/workflows/distribute-android.yml
     secrets: inherit
     with:
-      IS_DEVELOPMENT: 0
+      IS_DEVELOPMENT: false
       IS_SSS_ENABLED: ${{github.event.inputs.IS_SSS_ENABLED}}
+      IS_WELCOME_NEWS_ENABLED: ${{github.event.inputs.IS_WELCOME_NEWS_ENABLED}}
     needs:
       - test
 
@@ -43,8 +51,9 @@ jobs:
     uses: ./.github/workflows/distribute-ios.yml
     secrets: inherit
     with:
-      IS_DEVELOPMENT: 0
+      IS_DEVELOPMENT: false
       IS_SSS_ENABLED: ${{github.event.inputs.IS_SSS_ENABLED}}
+      IS_WELCOME_NEWS_ENABLED: ${{github.event.inputs.IS_WELCOME_NEWS_ENABLED}}
     needs:
       - test
 

src/app.tsx

@@ -57,6 +57,7 @@ import {StakingDelegateScreen} from '@app/screens/staking-delegate';
 import {StakingInfoScreen} from '@app/screens/staking-info';
 import {StakingUnDelegateScreen} from '@app/screens/staking-undelegate';
 import {StakingValidatorsScreen} from '@app/screens/staking-validators';
+import {WelcomeNewsScreen} from '@app/screens/welcome-news';
 import {
   ActionSheetType,
   AppTheme,
@@ -295,6 +296,17 @@ export const App = () => {
     });
   }, []);
 
+  const initialRoute = useMemo(() => {
+    if (app.onboarded) {
+      return 'home';
+    }
+    if (app.isWelcomeNewsEnabled) {
+      return 'welcomeNews';
+    }
+
+    return 'welcome';
+  }, []);
+
   // @ts-ignore
   return (
     <GestureHandlerRootView style={styles.rootView}>
@@ -307,9 +319,10 @@ export const App = () => {
             <Stack.Navigator
               screenOptions={basicScreenOptions}
               key={theme}
-              initialRouteName={app.onboarded ? 'home' : 'welcome'}>
+              initialRouteName={initialRoute}>
               <Stack.Screen name="home" component={HomeScreen} />
               <Stack.Screen name="welcome" component={WelcomeScreen} />
+              <Stack.Screen name="welcomeNews" component={WelcomeNewsScreen} />
               {/* Modals group */}
               <Stack.Group screenOptions={stackScreenOptions}>
                 <Stack.Screen

src/components/welcome-news.tsx

@@ -0,0 +1,79 @@
+import React from 'react';
+
+import {FlatList, View} from 'react-native';
+import {useSafeAreaInsets} from 'react-native-safe-area-context';
+import {Results} from 'realm';
+
+import {Color} from '@app/colors';
+import {NewsRow} from '@app/components/news/news-row';
+import {Button, ButtonSize, ButtonVariant} from '@app/components/ui';
+import {createTheme} from '@app/helpers';
+import {I18N} from '@app/i18n';
+import {News as NewsModel} from '@app/models/news';
+
+type WelcomeProps = {
+  news: Results<NewsModel>;
+  onPress: (id: string) => void;
+  onPressSignup: () => void;
+  onPressLedger: () => void;
+  onPressSignIn: () => void;
+};
+
+export const WelcomeNews = ({
+  onPressSignup,
+  onPressLedger,
+  onPressSignIn,
+  news,
+  onPress,
+}: WelcomeProps) => {
+  const insets = useSafeAreaInsets();
+
+  return (
+    <View
+      style={[
+        styles.container,
+        {paddingTop: insets.top, paddingBottom: insets.bottom},
+      ]}>
+      <FlatList
+        data={news}
+        renderItem={({item}) => <NewsRow item={item} onPress={onPress} />}
+      />
+
+      <Button
+        i18n={I18N.welcomeCreateWallet}
+        testID="welcome_signup"
+        style={styles.button}
+        variant={ButtonVariant.contained}
+        onPress={onPressSignup}
+        size={ButtonSize.large}
+      />
+      <Button
+        testID="welcome_ledger"
+        i18n={I18N.welcomeLedgerWallet}
+        iconRight="ledger"
+        iconRightColor={Color.graphicGreen1}
+        style={styles.button}
+        variant={ButtonVariant.second}
+        onPress={onPressLedger}
+        size={ButtonSize.large}
+      />
+      <Button
+        testID="welcome_signin"
+        i18n={I18N.welcomeRestoreWallet}
+        style={styles.button}
+        onPress={onPressSignIn}
+        size={ButtonSize.large}
+      />
+    </View>
+  );
+};
+
+const styles = createTheme({
+  container: {
+    flex: 1,
+    marginHorizontal: 20,
+  },
+  button: {
+    marginBottom: 16,
+  },
+});

src/contexts/app.ts

@@ -1,6 +1,6 @@
 import {EventEmitter} from 'events';
 
-import {ENVIRONMENT} from '@env';
+import {ENVIRONMENT, IS_DEVELOPMENT, IS_WELCOME_NEWS_ENABLED} from '@env';
 import {appleAuth} from '@invertase/react-native-apple-authentication';
 import dynamicLinks from '@react-native-firebase/dynamic-links';
 import {GoogleSignin} from '@react-native-google-signin/google-signin';
@@ -110,6 +110,17 @@ class App extends EventEmitter {
 
     Appearance.addChangeListener(this.listenTheme);
     AppState.addEventListener('change', this.listenTheme);
+
+    if (!VariablesBool.exists('isDeveloper')) {
+      VariablesBool.set('isDeveloper', IS_DEVELOPMENT === 'true');
+    }
+
+    if (!VariablesBool.exists('isWelcomeNewsEnabled')) {
+      VariablesBool.set(
+        'isWelcomeNewsEnabled',
+        IS_WELCOME_NEWS_ENABLED === 'true',
+      );
+    }
   }
 
   private _biometryType: BiometryType | null = null;
@@ -241,6 +252,14 @@ class App extends EventEmitter {
     VariablesBool.set('isDeveloper', value);
   }
 
+  get isWelcomeNewsEnabled() {
+    return VariablesBool.get('isWelcomeNewsEnabled') ?? false;
+  }
+
+  set isWelcomeNewsEnabled(value) {
+    VariablesBool.set('isWelcomeNewsEnabled', value);
+  }
+
   get currentTheme() {
     return this.theme === AppTheme.system
       ? this._systemTheme ?? AppTheme.light

src/env.d.ts

@@ -7,6 +7,7 @@ declare module '@env' {
   export const PATTERNS_SOURCE: string;
   export const ENVIRONMENT: string;
   export const IS_DEVELOPMENT: string;
+  export const IS_WELCOME_NEWS_ENABLED: string;
   export const PUSH_NOTIFICATIONS_URL: string;
   export const PROVIDER_BASE_PACKAGE: string;
   export const WALLET_CONNECT_PROJECT_ID: string;

src/helpers/is-feature-enabled.ts

@@ -7,6 +7,7 @@ export enum Feature {
   earn,
   governanceAndStaking,
   nft,
+  abnews,
 }
 
 export const isFeatureEnabled = (feature: Feature): boolean => {
@@ -19,6 +20,8 @@ export const isFeatureEnabled = (feature: Feature): boolean => {
       return app.isDeveloper;
     case Feature.nft:
       return app.isDeveloper;
+    case Feature.abnews:
+      return app.isWelcomeNewsEnabled;
     default:
       return false;
   }

src/screens/welcome-news.tsx

@@ -0,0 +1,60 @@
+import React, {useCallback, useEffect, useState} from 'react';
+
+import {WelcomeNews} from '@app/components/welcome-news';
+import {onNewsSync} from '@app/event-actions/on-news-sync';
+import {useTypedNavigation} from '@app/hooks';
+import {News} from '@app/models/news';
+import {VariablesBool} from '@app/models/variables-bool';
+import {PushNotifications} from '@app/services/push-notifications';
+
+export const WelcomeNewsScreen = () => {
+  const navigation = useTypedNavigation();
+
+  const [news, setNews] = useState(
+    News.getAll().filtered('status = "published"').sorted('publishedAt', true),
+  );
+
+  useEffect(() => {
+    if (!VariablesBool.exists('notifications')) {
+      PushNotifications.instance
+        .requestPermissions()
+        .then(() => {
+          VariablesBool.set('notifications', true);
+        })
+        .catch(() => {
+          VariablesBool.set('notifications', false);
+        });
+    }
+
+    onNewsSync().then(() => {
+      setNews(
+        News.getAll()
+          .filtered('status = "published"')
+          .sorted('publishedAt', true),
+      );
+    });
+  }, []);
+
+  const onPressSignup = () => navigation.navigate('signup', {next: 'create'});
+  const onPressLedger = () => navigation.navigate('ledger');
+  const onPressSignIn = () => navigation.navigate('signin', {next: 'restore'});
+
+  const onPressRow = useCallback(
+    (id: string) => {
+      navigation.navigate('newsDetail', {
+        id,
+      });
+    },
+    [navigation],
+  );
+
+  return (
+    <WelcomeNews
+      onPressSignup={onPressSignup}
+      onPressLedger={onPressLedger}
+      onPressSignIn={onPressSignIn}
+      news={news}
+      onPress={onPressRow}
+    />
+  );
+};

src/types.ts

@@ -155,6 +155,7 @@ export type RootStackParamList = {
     accountId: string;
   };
   welcome: undefined;
+  welcomeNews: undefined;
   create: undefined;
   scanQr: undefined;
   signin: {next: string};