Update CBS Mobile App codebase

src/modules/awareness/components/AwarenessCard.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { Pressable, StyleSheet, Text, View } from 'react-native';
 import Ionicons from '@react-native-vector-icons/ionicons';
 import { Card } from '../../../components';
-import { useTheme } from '../../../theme';
+import { useTheme, fontFamily } from '../../../theme';
 import { AwarenessArticle } from '../types';
 
 interface AwarenessCardProps {
@@ -102,7 +102,7 @@ const styles = StyleSheet.create({
   },
   category: {
     fontSize: 11,
-    fontWeight: '800',
+    fontFamily: fontFamily.bold,
     textTransform: 'uppercase',
     letterSpacing: 0.5,
   },
@@ -113,11 +113,11 @@ const styles = StyleSheet.create({
   },
   urgentText: {
     fontSize: 9,
-    fontWeight: '900',
+    fontFamily: fontFamily.bold,
   },
   title: {
     fontSize: 16,
-    fontWeight: '700',
+    fontFamily: fontFamily.bold,
   },
   bookmarkBtn: {
     padding: 4,
@@ -143,7 +143,7 @@ const styles = StyleSheet.create({
   },
   tagText: {
     fontSize: 10,
-    fontWeight: '600',
+    fontFamily: fontFamily.semibold,
   },
   readMore: {
     flexDirection: 'row',
@@ -152,6 +152,6 @@ const styles = StyleSheet.create({
   },
   readMoreText: {
     fontSize: 13,
-    fontWeight: '700',
+    fontFamily: fontFamily.bold,
   },
 });

src/modules/awareness/screens/AwarenessDetailScreen.tsx

@@ -5,7 +5,9 @@ import Ionicons from '@react-native-vector-icons/ionicons';
 
 import { Card, ScreenShell } from '../../../components';
 import { ServicesStackParamList } from '../../../navigation/types';
-import { useTheme } from '../../../theme';
+import { FeatureKey } from '../../../constants/featureKeys';
+import { FeatureGate } from '../../../features';
+import { useTheme, fontFamily } from '../../../theme';
 import { useAwareness } from '../hooks/useAwareness';
 
 type Props = NativeStackScreenProps<ServicesStackParamList, 'AwarenessDetail'>;
@@ -105,6 +107,9 @@ export default function AwarenessDetailScreen({ route, navigation }: Props) {
           </View>
         </View>
 
+        {/* The report button's only destination is the service-requests hub, so
+            it goes when the hub does rather than becoming a dead tap. */}
+        <FeatureGate feature={FeatureKey.SERVICES_REQUESTS_HUB}>
         <View style={styles.footerActions}>
           <Pressable
             onPress={() => navigation.navigate('ServiceRequestsHub')}
@@ -114,6 +119,7 @@ export default function AwarenessDetailScreen({ route, navigation }: Props) {
             <Text style={[styles.reportText, { color: theme.colors.error }]}>Report Fraudulent Activity</Text>
           </Pressable>
         </View>
+        </FeatureGate>
       </View>
       <View style={{ height: 20 }} />
     </ScreenShell>
@@ -149,17 +155,17 @@ const styles = StyleSheet.create({
   },
   categoryText: {
     fontSize: 11,
-    fontWeight: '800',
+    fontFamily: fontFamily.bold,
     textTransform: 'uppercase',
     letterSpacing: 0.5,
   },
   dateText: {
     fontSize: 12,
-    fontWeight: '600',
+    fontFamily: fontFamily.semibold,
   },
   title: {
     fontSize: 24,
-    fontWeight: '800',
+    fontFamily: fontFamily.bold,
     letterSpacing: -0.5,
     lineHeight: 30,
     marginBottom: 12,
@@ -177,7 +183,7 @@ const styles = StyleSheet.create({
   },
   tagText: {
     fontSize: 11,
-    fontWeight: '700',
+    fontFamily: fontFamily.bold,
   },
   introCard: {
     padding: 16,
@@ -186,7 +192,7 @@ const styles = StyleSheet.create({
   description: {
     fontSize: 15,
     lineHeight: 22,
-    fontWeight: '500',
+    fontFamily: fontFamily.medium,
   },
   contentSection: {
     marginBottom: 32,
@@ -216,7 +222,7 @@ const styles = StyleSheet.create({
   },
   ctaTitle: {
     fontSize: 16,
-    fontWeight: '800',
+    fontFamily: fontFamily.bold,
   },
   ctaSubtitle: {
     fontSize: 13,
@@ -237,7 +243,7 @@ const styles = StyleSheet.create({
   },
   reportText: {
     fontSize: 14,
-    fontWeight: '700',
+    fontFamily: fontFamily.bold,
   },
   errorContainer: {
     padding: 20,

src/modules/awareness/screens/AwarenessListScreen.tsx

@@ -5,7 +5,7 @@ import Ionicons from '@react-native-vector-icons/ionicons';
 
 import { Input, ScreenShell } from '../../../components';
 import { ServicesStackParamList } from '../../../navigation/types';
-import { useTheme } from '../../../theme';
+import { useTheme, fontFamily } from '../../../theme';
 import { AwarenessCard } from '../components/AwarenessCard';
 import { useAwareness } from '../hooks/useAwareness';
 import { AwarenessCategory } from '../types';
@@ -27,7 +27,10 @@ export default function AwarenessListScreen({ navigation }: Props) {
   };
 
   return (
-    <ScreenShell title="Security aware" subtitle="Learn to protect your digital banking">
+    <ScreenShell
+      // The body is a FlatList, so it owns the scrolling.
+      scrollable={false}
+      title="Security aware" subtitle="Learn to protect your digital banking">
       <View style={styles.searchContainer}>
         <Input
           placeholder="Search safety tips, fraud alerts..."
@@ -152,7 +155,7 @@ const styles = StyleSheet.create({
   },
   filterText: {
     fontSize: 13,
-    fontWeight: '700',
+    fontFamily: fontFamily.bold,
   },
   listContent: {
     paddingHorizontal: 16,
@@ -170,7 +173,7 @@ const styles = StyleSheet.create({
   },
   sectionTitle: {
     fontSize: 16,
-    fontWeight: '800',
+    fontFamily: fontFamily.bold,
     letterSpacing: -0.3,
   },
   urgentCarousel: {
@@ -192,7 +195,7 @@ const styles = StyleSheet.create({
   },
   urgentCardTitle: {
     fontSize: 15,
-    fontWeight: '700',
+    fontFamily: fontFamily.bold,
   },
   urgentCardDesc: {
     fontSize: 12,
@@ -205,7 +208,7 @@ const styles = StyleSheet.create({
   },
   emptyTitle: {
     fontSize: 18,
-    fontWeight: '800',
+    fontFamily: fontFamily.bold,
   },
   emptySubtitle: {
     fontSize: 14,