react-native-elearn-ui 0.1.20 → 0.1.21

package/lib/module/screens/index.js

@@ -2,4 +2,5 @@
 
 export { HomeScreen } from "./HomeScreen.js";
 export { QBankTopicScreen } from "./qbank/QBankTopicScreen.js";
+export { QBankSubTopicScreen } from "./qbank/QBankSubTopicScreen.js";
 //# sourceMappingURL=index.js.map

package/lib/module/screens/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["HomeScreen","QBankTopicScreen"],"sourceRoot":"../../../src","sources":["screens/index.ts"],"mappings":";;AAAA,SAASA,UAAU,QAAQ,iBAAc;AACzC,SAASC,gBAAgB,QAAQ,6BAA0B","ignoreList":[]}
+{"version":3,"names":["HomeScreen","QBankTopicScreen","QBankSubTopicScreen"],"sourceRoot":"../../../src","sources":["screens/index.ts"],"mappings":";;AAAA,SAASA,UAAU,QAAQ,iBAAc;AACzC,SAASC,gBAAgB,QAAQ,6BAA0B;AAC3D,SAASC,mBAAmB,QAAQ,gCAA6B","ignoreList":[]}

package/lib/module/screens/qbank/QBankSubTopicScreen.js

@@ -0,0 +1,367 @@
+"use strict";
+
+import React, { useState } from 'react';
+import { View, ScrollView, StyleSheet, TouchableOpacity, StatusBar, FlatList } from 'react-native';
+import { SafeAreaView } from 'react-native-safe-area-context';
+import { useTheme } from "../../context/ThemeContext.js";
+import { Typography, Icon } from "../../components/index.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const QBankSubTopicScreen = ({
+  params,
+  hideHeader = false,
+  onBack,
+  onPressModule,
+  onPressFilter
+}) => {
+  const theme = useTheme();
+  const [activeFilter, setActiveFilter] = useState(params.activeFilter || params.filters[0]);
+  const handleFilterPress = filter => {
+    setActiveFilter(filter);
+    onPressFilter?.(filter);
+  };
+  const renderFilterChip = ({
+    item: filter
+  }) => {
+    const isActive = activeFilter === filter;
+    return /*#__PURE__*/_jsx(TouchableOpacity, {
+      style: [styles.filterChip, isActive ? {
+        backgroundColor: theme.primary,
+        borderColor: theme.primary
+      } : {
+        borderColor: '#E2E8F0'
+      }],
+      onPress: () => handleFilterPress(filter),
+      children: /*#__PURE__*/_jsx(Typography, {
+        variant: "body",
+        color: isActive ? '#FFFFFF' : theme.textSecondary,
+        style: styles.filterChipText,
+        children: filter
+      })
+    });
+  };
+  return /*#__PURE__*/_jsxs(SafeAreaView, {
+    style: [styles.container, {
+      backgroundColor: '#F8FAFC'
+    }],
+    edges: ['top'],
+    children: [/*#__PURE__*/_jsx(StatusBar, {
+      barStyle: "dark-content",
+      backgroundColor: "#FFFFFF"
+    }), !hideHeader && /*#__PURE__*/_jsxs(View, {
+      style: styles.header,
+      children: [/*#__PURE__*/_jsx(TouchableOpacity, {
+        onPress: onBack,
+        style: styles.headerIconBtnLeft,
+        children: /*#__PURE__*/_jsx(Icon, {
+          name: "chevron-left",
+          size: 24,
+          color: theme.textPrimary
+        })
+      }), /*#__PURE__*/_jsx(Typography, {
+        variant: "h3",
+        color: theme.textPrimary,
+        style: styles.headerTitle,
+        children: params.header.title
+      }), /*#__PURE__*/_jsx(View, {
+        style: styles.headerIconBtnRight
+      })]
+    }), /*#__PURE__*/_jsx(View, {
+      style: styles.filtersContainer,
+      children: /*#__PURE__*/_jsx(FlatList, {
+        horizontal: true,
+        showsHorizontalScrollIndicator: false,
+        data: params.filters,
+        keyExtractor: item => item,
+        renderItem: renderFilterChip,
+        contentContainerStyle: styles.filtersContent
+      })
+    }), /*#__PURE__*/_jsxs(ScrollView, {
+      contentContainerStyle: styles.scrollContent,
+      showsVerticalScrollIndicator: false,
+      children: [/*#__PURE__*/_jsxs(View, {
+        style: styles.overviewRow,
+        children: [/*#__PURE__*/_jsx(Typography, {
+          variant: "h3",
+          bold: true,
+          color: theme.textPrimary,
+          children: params.overview.title.toUpperCase()
+        }), /*#__PURE__*/_jsxs(Typography, {
+          variant: "body",
+          color: theme.textSecondary,
+          style: styles.overviewSub,
+          children: [' ', "\u2022 ", params.overview.totalModules, " Modules"]
+        })]
+      }), params.sections.map(section => {
+        return /*#__PURE__*/_jsxs(View, {
+          style: styles.sectionContainer,
+          children: [/*#__PURE__*/_jsxs(View, {
+            style: styles.sectionTitleRow,
+            children: [/*#__PURE__*/_jsx(View, {
+              style: [styles.sectionTitleDot, {
+                backgroundColor: theme.primary
+              }]
+            }), /*#__PURE__*/_jsx(Typography, {
+              variant: "caption",
+              color: theme.textSecondary,
+              style: styles.sectionTitleText,
+              children: section.title.toUpperCase()
+            })]
+          }), section.modules.map((moduleItem, mIdx) => {
+            const isLast = mIdx === section.modules.length - 1;
+            return /*#__PURE__*/_jsxs(View, {
+              style: styles.timelineRow,
+              children: [/*#__PURE__*/_jsxs(View, {
+                style: styles.timelineCol,
+                children: [!isLast && /*#__PURE__*/_jsx(View, {
+                  style: styles.timelineLine
+                }), /*#__PURE__*/_jsx(View, {
+                  style: styles.timelineNode,
+                  children: /*#__PURE__*/_jsx(Typography, {
+                    variant: "caption",
+                    bold: true,
+                    color: "#FFFFFF",
+                    style: styles.timelineNodeText,
+                    children: moduleItem.number
+                  })
+                })]
+              }), /*#__PURE__*/_jsxs(TouchableOpacity, {
+                style: styles.moduleCard,
+                onPress: () => onPressModule?.(moduleItem.id),
+                activeOpacity: 0.7,
+                children: [/*#__PURE__*/_jsxs(View, {
+                  style: styles.moduleInfo,
+                  children: [/*#__PURE__*/_jsx(Typography, {
+                    variant: "body",
+                    bold: true,
+                    color: theme.textPrimary,
+                    style: styles.moduleTitle,
+                    children: moduleItem.title
+                  }), /*#__PURE__*/_jsxs(View, {
+                    style: styles.moduleStats,
+                    children: [/*#__PURE__*/_jsx(Icon, {
+                      name: "star",
+                      size: 12,
+                      color: "#FBBF24"
+                    }), /*#__PURE__*/_jsx(Typography, {
+                      variant: "caption",
+                      color: theme.textPrimary,
+                      style: styles.moduleStatText,
+                      children: moduleItem.rating
+                    }), /*#__PURE__*/_jsxs(Typography, {
+                      variant: "caption",
+                      color: theme.textSecondary,
+                      style: styles.moduleStatSubtext,
+                      children: [moduleItem.questionCount, " Questions"]
+                    })]
+                  })]
+                }), /*#__PURE__*/_jsxs(View, {
+                  style: styles.moduleStatus,
+                  children: [moduleItem.status === 'free' && /*#__PURE__*/_jsx(View, {
+                    style: styles.freeBadge,
+                    children: /*#__PURE__*/_jsx(Typography, {
+                      variant: "caption",
+                      bold: true,
+                      color: theme.success,
+                      style: {
+                        fontSize: 10
+                      },
+                      children: "FREE"
+                    })
+                  }), moduleItem.status === 'locked' && /*#__PURE__*/_jsx(View, {
+                    style: styles.lockedBadge,
+                    children: /*#__PURE__*/_jsx(Icon, {
+                      name: "lock",
+                      size: 14,
+                      color: "#64748B"
+                    })
+                  })]
+                })]
+              })]
+            }, moduleItem.id);
+          })]
+        }, section.id);
+      })]
+    })]
+  });
+};
+const styles = StyleSheet.create({
+  container: {
+    flex: 1
+  },
+  header: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    paddingHorizontal: 16,
+    paddingVertical: 12,
+    backgroundColor: '#FFFFFF',
+    borderBottomWidth: 1,
+    borderBottomColor: '#F1F5F9'
+  },
+  headerIconBtnLeft: {
+    width: 40,
+    height: 40,
+    justifyContent: 'center',
+    alignItems: 'flex-start'
+  },
+  headerIconBtnRight: {
+    width: 40,
+    height: 40,
+    justifyContent: 'center',
+    alignItems: 'flex-end'
+  },
+  headerTitle: {
+    fontSize: 18,
+    fontWeight: '600',
+    flex: 1,
+    textAlign: 'center'
+  },
+  filtersContainer: {
+    backgroundColor: '#FFFFFF',
+    paddingVertical: 12,
+    borderBottomWidth: 1,
+    borderBottomColor: '#F1F5F9'
+  },
+  filtersContent: {
+    paddingHorizontal: 16,
+    gap: 8
+  },
+  filterChip: {
+    paddingHorizontal: 20,
+    paddingVertical: 8,
+    borderRadius: 20,
+    borderWidth: 1,
+    backgroundColor: '#FFFFFF',
+    marginRight: 8
+  },
+  filterChipText: {
+    fontSize: 14,
+    fontWeight: '500'
+  },
+  scrollContent: {
+    paddingVertical: 20,
+    paddingHorizontal: 16,
+    paddingBottom: 40
+  },
+  overviewRow: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    marginBottom: 24
+  },
+  overviewSub: {
+    fontSize: 14
+  },
+  sectionContainer: {
+    marginBottom: 24
+  },
+  sectionTitleRow: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    marginBottom: 16
+  },
+  sectionTitleDot: {
+    width: 6,
+    height: 6,
+    borderRadius: 3,
+    marginRight: 8
+  },
+  sectionTitleText: {
+    fontSize: 13,
+    fontWeight: '600',
+    letterSpacing: 0.5
+  },
+  timelineRow: {
+    flexDirection: 'row',
+    marginBottom: 12
+  },
+  timelineCol: {
+    width: 40,
+    alignItems: 'center',
+    marginRight: 12
+  },
+  timelineLine: {
+    position: 'absolute',
+    top: 24,
+    // starts from middle of circle
+    bottom: -36,
+    // reaches down to next node roughly
+    width: 1,
+    backgroundColor: '#E2E8F0',
+    zIndex: 0
+  },
+  timelineNode: {
+    width: 28,
+    height: 28,
+    borderRadius: 14,
+    backgroundColor: '#8E918E',
+    // Based on screenshot grey color
+    justifyContent: 'center',
+    alignItems: 'center',
+    marginTop: 16,
+    // to align with card title slightly
+    zIndex: 1,
+    borderWidth: 2,
+    borderColor: '#F8FAFC' // match background to cut line
+  },
+  timelineNodeText: {
+    fontSize: 12
+  },
+  moduleCard: {
+    flex: 1,
+    flexDirection: 'row',
+    alignItems: 'center',
+    backgroundColor: '#FFFFFF',
+    padding: 16,
+    borderRadius: 12,
+    shadowColor: '#000',
+    shadowOffset: {
+      width: 0,
+      height: 1
+    },
+    shadowOpacity: 0.05,
+    shadowRadius: 2,
+    elevation: 1
+  },
+  moduleInfo: {
+    flex: 1,
+    marginRight: 12
+  },
+  moduleTitle: {
+    fontSize: 14,
+    lineHeight: 20,
+    marginBottom: 8
+  },
+  moduleStats: {
+    flexDirection: 'row',
+    alignItems: 'center'
+  },
+  moduleStatText: {
+    fontSize: 12,
+    fontWeight: '600',
+    marginLeft: 4,
+    marginRight: 8
+  },
+  moduleStatSubtext: {
+    fontSize: 12
+  },
+  moduleStatus: {
+    justifyContent: 'center',
+    alignItems: 'center'
+  },
+  freeBadge: {
+    paddingHorizontal: 10,
+    paddingVertical: 4,
+    borderRadius: 4,
+    borderWidth: 1,
+    borderColor: '#10B981',
+    backgroundColor: '#FFFFFF'
+  },
+  lockedBadge: {
+    width: 32,
+    height: 32,
+    borderRadius: 16,
+    backgroundColor: '#F1F5F9',
+    justifyContent: 'center',
+    alignItems: 'center'
+  }
+});
+//# sourceMappingURL=QBankSubTopicScreen.js.map

package/lib/module/screens/qbank/QBankSubTopicScreen.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useState","View","ScrollView","StyleSheet","TouchableOpacity","StatusBar","FlatList","SafeAreaView","useTheme","Typography","Icon","jsx","_jsx","jsxs","_jsxs","QBankSubTopicScreen","params","hideHeader","onBack","onPressModule","onPressFilter","theme","activeFilter","setActiveFilter","filters","handleFilterPress","filter","renderFilterChip","item","isActive","style","styles","filterChip","backgroundColor","primary","borderColor","onPress","children","variant","color","textSecondary","filterChipText","container","edges","barStyle","header","headerIconBtnLeft","name","size","textPrimary","headerTitle","title","headerIconBtnRight","filtersContainer","horizontal","showsHorizontalScrollIndicator","data","keyExtractor","renderItem","contentContainerStyle","filtersContent","scrollContent","showsVerticalScrollIndicator","overviewRow","bold","overview","toUpperCase","overviewSub","totalModules","sections","map","section","sectionContainer","sectionTitleRow","sectionTitleDot","sectionTitleText","modules","moduleItem","mIdx","isLast","length","timelineRow","timelineCol","timelineLine","timelineNode","timelineNodeText","number","moduleCard","id","activeOpacity","moduleInfo","moduleTitle","moduleStats","moduleStatText","rating","moduleStatSubtext","questionCount","moduleStatus","status","freeBadge","success","fontSize","lockedBadge","create","flex","flexDirection","alignItems","paddingHorizontal","paddingVertical","borderBottomWidth","borderBottomColor","width","height","justifyContent","fontWeight","textAlign","gap","borderRadius","borderWidth","marginRight","paddingBottom","marginBottom","letterSpacing","position","top","bottom","zIndex","marginTop","padding","shadowColor","shadowOffset","shadowOpacity","shadowRadius","elevation","lineHeight","marginLeft"],"sourceRoot":"../../../../src","sources":["screens/qbank/QBankSubTopicScreen.tsx"],"mappings":"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","ignoreList":[]}

package/lib/typescript/src/screens/index.d.ts

@@ -1,3 +1,4 @@
 export { HomeScreen } from './HomeScreen.js';
 export { QBankTopicScreen } from './qbank/QBankTopicScreen.js';
+export { QBankSubTopicScreen } from './qbank/QBankSubTopicScreen.js';
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/screens/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/screens/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAc,CAAC;AAC1C,OAAO,EAAE,gBAAgB,EAAE,MAAM,6BAA0B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/screens/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAc,CAAC;AAC1C,OAAO,EAAE,gBAAgB,EAAE,MAAM,6BAA0B,CAAC;AAC5D,OAAO,EAAE,mBAAmB,EAAE,MAAM,gCAA6B,CAAC"}

package/lib/typescript/src/screens/qbank/QBankSubTopicScreen.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import type { QBankSubTopicParams } from '../../types/index.js';
+interface QBankSubTopicScreenProps {
+    params: QBankSubTopicParams;
+    hideHeader?: boolean;
+    onBack?: () => void;
+    onPressModule?: (moduleId: string) => void;
+    onPressFilter?: (filter: string) => void;
+}
+export declare const QBankSubTopicScreen: React.FC<QBankSubTopicScreenProps>;
+export {};
+//# sourceMappingURL=QBankSubTopicScreen.d.ts.map

package/lib/typescript/src/screens/qbank/QBankSubTopicScreen.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"QBankSubTopicScreen.d.ts","sourceRoot":"","sources":["../../../../../src/screens/qbank/QBankSubTopicScreen.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAYxC,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,sBAAa,CAAC;AAEvD,UAAU,wBAAwB;IAChC,MAAM,EAAE,mBAAmB,CAAC;IAC5B,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,aAAa,CAAC,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,aAAa,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;CAC1C;AAED,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CA2JlE,CAAC"}

package/lib/typescript/src/types/index.d.ts

@@ -212,4 +212,29 @@ export interface QBankTopicParams {
         icon: string;
     }>;
 }
+export interface QBankSubTopicModule {
+    id: string;
+    number: number;
+    title: string;
+    rating: number;
+    questionCount: number;
+    status: 'free' | 'locked' | 'completed';
+}
+export interface QBankSubTopicSection {
+    id: string;
+    title: string;
+    modules: QBankSubTopicModule[];
+}
+export interface QBankSubTopicParams {
+    header: {
+        title: string;
+    };
+    filters: string[];
+    activeFilter?: string;
+    overview: {
+        title: string;
+        totalModules: number;
+    };
+    sections: QBankSubTopicSection[];
+}
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/types/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/types/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/types/index.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-elearn-ui",
-  "version": "0.1.20",
+  "version": "0.1.21",
   "description": "Enterprise E-Learning UI library for React Native",
   "main": "./lib/module/index.js",
   "types": "./lib/typescript/src/index.d.ts",

package/src/screens/index.ts

@@ -1,2 +1,3 @@
 export { HomeScreen } from './HomeScreen';
 export { QBankTopicScreen } from './qbank/QBankTopicScreen';
+export { QBankSubTopicScreen } from './qbank/QBankSubTopicScreen';

package/src/screens/qbank/QBankSubTopicScreen.tsx

@@ -0,0 +1,352 @@
+import React, { useState } from 'react';
+import {
+  View,
+  ScrollView,
+  StyleSheet,
+  TouchableOpacity,
+  StatusBar,
+  FlatList,
+} from 'react-native';
+import { SafeAreaView } from 'react-native-safe-area-context';
+import { useTheme } from '../../context/ThemeContext';
+import { Typography, Icon } from '../../components';
+import type { QBankSubTopicParams } from '../../types';
+
+interface QBankSubTopicScreenProps {
+  params: QBankSubTopicParams;
+  hideHeader?: boolean;
+  onBack?: () => void;
+  onPressModule?: (moduleId: string) => void;
+  onPressFilter?: (filter: string) => void;
+}
+
+export const QBankSubTopicScreen: React.FC<QBankSubTopicScreenProps> = ({
+  params,
+  hideHeader = false,
+  onBack,
+  onPressModule,
+  onPressFilter,
+}) => {
+  const theme = useTheme();
+  const [activeFilter, setActiveFilter] = useState(params.activeFilter || params.filters[0]);
+
+  const handleFilterPress = (filter: string) => {
+    setActiveFilter(filter);
+    onPressFilter?.(filter);
+  };
+
+  const renderFilterChip = ({ item: filter }: { item: string }) => {
+    const isActive = activeFilter === filter;
+    return (
+      <TouchableOpacity
+        style={[
+          styles.filterChip,
+          isActive ? { backgroundColor: theme.primary, borderColor: theme.primary } : { borderColor: '#E2E8F0' }
+        ]}
+        onPress={() => handleFilterPress(filter)}
+      >
+        <Typography 
+          variant="body" 
+          color={isActive ? '#FFFFFF' : theme.textSecondary}
+          style={styles.filterChipText}
+        >
+          {filter}
+        </Typography>
+      </TouchableOpacity>
+    );
+  };
+
+  return (
+    <SafeAreaView style={[styles.container, { backgroundColor: '#F8FAFC' }]} edges={['top']}>
+      <StatusBar barStyle="dark-content" backgroundColor="#FFFFFF" />
+
+      {/* Header */}
+      {!hideHeader && (
+        <View style={styles.header}>
+          <TouchableOpacity onPress={onBack} style={styles.headerIconBtnLeft}>
+            <Icon name="chevron-left" size={24} color={theme.textPrimary} />
+          </TouchableOpacity>
+          <Typography variant="h3" color={theme.textPrimary} style={styles.headerTitle}>
+            {params.header.title}
+          </Typography>
+          <View style={styles.headerIconBtnRight} />
+        </View>
+      )}
+
+      {/* Filter Chips */}
+      <View style={styles.filtersContainer}>
+        <FlatList
+          horizontal
+          showsHorizontalScrollIndicator={false}
+          data={params.filters}
+          keyExtractor={(item) => item}
+          renderItem={renderFilterChip}
+          contentContainerStyle={styles.filtersContent}
+        />
+      </View>
+
+      <ScrollView contentContainerStyle={styles.scrollContent} showsVerticalScrollIndicator={false}>
+        {/* Overview Title */}
+        <View style={styles.overviewRow}>
+          <Typography variant="h3" bold color={theme.textPrimary}>
+            {params.overview.title.toUpperCase()}
+          </Typography>
+          <Typography variant="body" color={theme.textSecondary} style={styles.overviewSub}>
+            {' '}• {params.overview.totalModules} Modules
+          </Typography>
+        </View>
+
+        {/* Sections & Timeline */}
+        {params.sections.map((section) => {
+          return (
+            <View key={section.id} style={styles.sectionContainer}>
+              {/* Section Title */}
+              <View style={styles.sectionTitleRow}>
+                <View style={[styles.sectionTitleDot, { backgroundColor: theme.primary }]} />
+                <Typography variant="caption" color={theme.textSecondary} style={styles.sectionTitleText}>
+                  {section.title.toUpperCase()}
+                </Typography>
+              </View>
+
+              {/* Modules in this section */}
+              {section.modules.map((moduleItem, mIdx) => {
+                const isLast = mIdx === section.modules.length - 1;
+
+                return (
+                  <View key={moduleItem.id} style={styles.timelineRow}>
+                    
+                    {/* Timeline Column */}
+                    <View style={styles.timelineCol}>
+                      {/* Vertical line connecting nodes (dont show below last item) */}
+                      {!isLast && <View style={styles.timelineLine} />}
+                      
+                      {/* Number Node */}
+                      <View style={styles.timelineNode}>
+                        <Typography variant="caption" bold color="#FFFFFF" style={styles.timelineNodeText}>
+                          {moduleItem.number}
+                        </Typography>
+                      </View>
+                    </View>
+
+                    {/* Module Card */}
+                    <TouchableOpacity 
+                      style={styles.moduleCard}
+                      onPress={() => onPressModule?.(moduleItem.id)}
+                      activeOpacity={0.7}
+                    >
+                      <View style={styles.moduleInfo}>
+                        <Typography variant="body" bold color={theme.textPrimary} style={styles.moduleTitle}>
+                          {moduleItem.title}
+                        </Typography>
+                        
+                        <View style={styles.moduleStats}>
+                          <Icon name="star" size={12} color="#FBBF24" />
+                          <Typography variant="caption" color={theme.textPrimary} style={styles.moduleStatText}>
+                            {moduleItem.rating}
+                          </Typography>
+                          <Typography variant="caption" color={theme.textSecondary} style={styles.moduleStatSubtext}>
+                             {moduleItem.questionCount} Questions
+                          </Typography>
+                        </View>
+                      </View>
+
+                      {/* Trailing Status Badge */}
+                      <View style={styles.moduleStatus}>
+                        {moduleItem.status === 'free' && (
+                          <View style={styles.freeBadge}>
+                            <Typography variant="caption" bold color={theme.success} style={{fontSize: 10}}>
+                              FREE
+                            </Typography>
+                          </View>
+                        )}
+                        {moduleItem.status === 'locked' && (
+                          <View style={styles.lockedBadge}>
+                            <Icon name="lock" size={14} color="#64748B" />
+                          </View>
+                        )}
+                      </View>
+                    </TouchableOpacity>
+                  </View>
+                );
+              })}
+            </View>
+          );
+        })}
+      </ScrollView>
+    </SafeAreaView>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+  },
+  header: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    paddingHorizontal: 16,
+    paddingVertical: 12,
+    backgroundColor: '#FFFFFF',
+    borderBottomWidth: 1,
+    borderBottomColor: '#F1F5F9',
+  },
+  headerIconBtnLeft: {
+    width: 40,
+    height: 40,
+    justifyContent: 'center',
+    alignItems: 'flex-start',
+  },
+  headerIconBtnRight: {
+    width: 40,
+    height: 40,
+    justifyContent: 'center',
+    alignItems: 'flex-end',
+  },
+  headerTitle: {
+    fontSize: 18,
+    fontWeight: '600',
+    flex: 1,
+    textAlign: 'center',
+  },
+  filtersContainer: {
+    backgroundColor: '#FFFFFF',
+    paddingVertical: 12,
+    borderBottomWidth: 1,
+    borderBottomColor: '#F1F5F9',
+  },
+  filtersContent: {
+    paddingHorizontal: 16,
+    gap: 8,
+  },
+  filterChip: {
+    paddingHorizontal: 20,
+    paddingVertical: 8,
+    borderRadius: 20,
+    borderWidth: 1,
+    backgroundColor: '#FFFFFF',
+    marginRight: 8,
+  },
+  filterChipText: {
+    fontSize: 14,
+    fontWeight: '500',
+  },
+  scrollContent: {
+    paddingVertical: 20,
+    paddingHorizontal: 16,
+    paddingBottom: 40,
+  },
+  overviewRow: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    marginBottom: 24,
+  },
+  overviewSub: {
+    fontSize: 14,
+  },
+  sectionContainer: {
+    marginBottom: 24,
+  },
+  sectionTitleRow: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    marginBottom: 16,
+  },
+  sectionTitleDot: {
+    width: 6,
+    height: 6,
+    borderRadius: 3,
+    marginRight: 8,
+  },
+  sectionTitleText: {
+    fontSize: 13,
+    fontWeight: '600',
+    letterSpacing: 0.5,
+  },
+  timelineRow: {
+    flexDirection: 'row',
+    marginBottom: 12,
+  },
+  timelineCol: {
+    width: 40,
+    alignItems: 'center',
+    marginRight: 12,
+  },
+  timelineLine: {
+    position: 'absolute',
+    top: 24, // starts from middle of circle
+    bottom: -36, // reaches down to next node roughly
+    width: 1,
+    backgroundColor: '#E2E8F0',
+    zIndex: 0,
+  },
+  timelineNode: {
+    width: 28,
+    height: 28,
+    borderRadius: 14,
+    backgroundColor: '#8E918E', // Based on screenshot grey color
+    justifyContent: 'center',
+    alignItems: 'center',
+    marginTop: 16, // to align with card title slightly
+    zIndex: 1,
+    borderWidth: 2,
+    borderColor: '#F8FAFC', // match background to cut line
+  },
+  timelineNodeText: {
+    fontSize: 12,
+  },
+  moduleCard: {
+    flex: 1,
+    flexDirection: 'row',
+    alignItems: 'center',
+    backgroundColor: '#FFFFFF',
+    padding: 16,
+    borderRadius: 12,
+    shadowColor: '#000',
+    shadowOffset: { width: 0, height: 1 },
+    shadowOpacity: 0.05,
+    shadowRadius: 2,
+    elevation: 1,
+  },
+  moduleInfo: {
+    flex: 1,
+    marginRight: 12,
+  },
+  moduleTitle: {
+    fontSize: 14,
+    lineHeight: 20,
+    marginBottom: 8,
+  },
+  moduleStats: {
+    flexDirection: 'row',
+    alignItems: 'center',
+  },
+  moduleStatText: {
+    fontSize: 12,
+    fontWeight: '600',
+    marginLeft: 4,
+    marginRight: 8,
+  },
+  moduleStatSubtext: {
+    fontSize: 12,
+  },
+  moduleStatus: {
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+  freeBadge: {
+    paddingHorizontal: 10,
+    paddingVertical: 4,
+    borderRadius: 4,
+    borderWidth: 1,
+    borderColor: '#10B981',
+    backgroundColor: '#FFFFFF',
+  },
+  lockedBadge: {
+    width: 32,
+    height: 32,
+    borderRadius: 16,
+    backgroundColor: '#F1F5F9',
+    justifyContent: 'center',
+    alignItems: 'center',
+  },
+});

package/src/types/index.ts

@@ -221,3 +221,31 @@ export interface QBankTopicParams {
     icon: string;
   }>;
 }
+
+export interface QBankSubTopicModule {
+  id: string;
+  number: number;
+  title: string;
+  rating: number;
+  questionCount: number;
+  status: 'free' | 'locked' | 'completed';
+}
+
+export interface QBankSubTopicSection {
+  id: string;
+  title: string;
+  modules: QBankSubTopicModule[];
+}
+
+export interface QBankSubTopicParams {
+  header: {
+    title: string;
+  };
+  filters: string[];
+  activeFilter?: string;
+  overview: {
+    title: string;
+    totalModules: number;
+  };
+  sections: QBankSubTopicSection[];
+}