react-native-elearn-ui 0.1.23 → 0.1.28

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

@@ -0,0 +1,415 @@
+"use strict";
+
+import React, { useState, useEffect } from 'react';
+import { View, ScrollView, StyleSheet, TouchableOpacity, StatusBar } from 'react-native';
+import { SafeAreaView } from 'react-native-safe-area-context';
+import { useTheme } from "../../context/ThemeContext.js";
+import { Typography, Icon, Button } from "../../components/index.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const formatTime = totalSeconds => {
+  const minutes = Math.floor(totalSeconds / 60);
+  const seconds = totalSeconds % 60;
+  return `${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;
+};
+export const QBankQuestionScreen = ({
+  params,
+  initialTimeSeconds = 60,
+  onTimeUp,
+  onBack,
+  onNext,
+  onPrev,
+  onPressOption,
+  onPressReport,
+  onPressUsers
+}) => {
+  const theme = useTheme();
+  const [timeLeft, setTimeLeft] = useState(initialTimeSeconds);
+  useEffect(() => {
+    if (timeLeft <= 0) {
+      onTimeUp?.();
+      return;
+    }
+    const timer = setInterval(() => {
+      setTimeLeft(prev => prev - 1);
+    }, 1000);
+    return () => clearInterval(timer);
+  }, [timeLeft, onTimeUp]);
+  const progressPercentage = params.questionNumber / params.totalQuestions * 100;
+  const renderOption = (option, index) => {
+    const letters = ['A', 'B', 'C', 'D', 'E', 'F'];
+    const letter = letters[index] || '';
+    let borderColor = '#E5E7EB'; // Default grey
+    let backgroundColor = '#FFFFFF';
+    let iconName;
+    let iconColor = theme.textSecondary;
+    let statusText = '';
+    let statusColor = '';
+    if (option.status === 'correct') {
+      borderColor = theme.success;
+      backgroundColor = '#F0FDF4'; // light green bg
+      iconName = 'check-circle';
+      iconColor = theme.success;
+      statusText = 'Correct';
+      statusColor = theme.success;
+    } else if (option.status === 'incorrect') {
+      borderColor = '#EF4444';
+      backgroundColor = '#FEF2F2'; // light red bg
+      iconName = 'x-circle';
+      iconColor = '#EF4444';
+      statusText = 'InCorrect'; // matching user image
+      statusColor = '#EF4444';
+    }
+    return /*#__PURE__*/_jsx(TouchableOpacity, {
+      style: [styles.optionContainer, {
+        borderColor,
+        backgroundColor
+      }],
+      onPress: () => onPressOption?.(option.id),
+      activeOpacity: 0.7,
+      children: /*#__PURE__*/_jsxs(View, {
+        style: styles.optionContent,
+        children: [iconName ? /*#__PURE__*/_jsx(Icon, {
+          name: iconName,
+          size: 20,
+          color: iconColor
+        }) : /*#__PURE__*/_jsx(View, {
+          style: styles.emptyCircle
+        }), /*#__PURE__*/_jsxs(View, {
+          style: styles.optionTextWrapper,
+          children: [/*#__PURE__*/_jsxs(Typography, {
+            variant: "body",
+            color: theme.textPrimary,
+            style: styles.optionText,
+            children: [letter, ". ", option.text]
+          }), (option.status === 'correct' || option.status === 'incorrect') && /*#__PURE__*/_jsxs(Typography, {
+            variant: "caption",
+            color: statusColor,
+            style: styles.optionStatusText,
+            children: [statusText, " ", /*#__PURE__*/_jsxs(Typography, {
+              variant: "caption",
+              color: theme.textSecondary,
+              children: ["[", option.percentage, "%]"]
+            })]
+          }), option.status === 'default' && option.percentage !== undefined && /*#__PURE__*/_jsxs(Typography, {
+            variant: "caption",
+            color: theme.textSecondary,
+            style: styles.optionStatusText,
+            children: ["[", option.percentage, "%]"]
+          })]
+        })]
+      })
+    }, option.id);
+  };
+  return /*#__PURE__*/_jsxs(SafeAreaView, {
+    style: [styles.container, {
+      backgroundColor: '#E5E7EB'
+    }],
+    edges: ['top', 'bottom'],
+    children: [/*#__PURE__*/_jsx(StatusBar, {
+      barStyle: "dark-content",
+      backgroundColor: "#FFFFFF"
+    }), /*#__PURE__*/_jsxs(View, {
+      style: styles.card,
+      children: [/*#__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.headerTitle
+        }), /*#__PURE__*/_jsx(View, {
+          style: styles.headerIconBtnRight
+        })]
+      }), /*#__PURE__*/_jsx(View, {
+        style: styles.progressTrack,
+        children: /*#__PURE__*/_jsx(View, {
+          style: [styles.progressFill, {
+            width: `${progressPercentage}%`,
+            backgroundColor: theme.success
+          }]
+        })
+      }), /*#__PURE__*/_jsxs(ScrollView, {
+        contentContainerStyle: styles.scrollContent,
+        showsVerticalScrollIndicator: false,
+        children: [/*#__PURE__*/_jsxs(View, {
+          style: styles.topBar,
+          children: [/*#__PURE__*/_jsxs(Typography, {
+            variant: "caption",
+            bold: true,
+            color: theme.textSecondary,
+            style: styles.questionNumber,
+            children: ["QUESTION ", params.questionNumber, "/", params.totalQuestions]
+          }), /*#__PURE__*/_jsxs(View, {
+            style: styles.timerWrapper,
+            children: [/*#__PURE__*/_jsx(Icon, {
+              name: "clock",
+              size: 14,
+              color: theme.textSecondary
+            }), /*#__PURE__*/_jsx(Typography, {
+              variant: "caption",
+              color: theme.textSecondary,
+              style: styles.timerText,
+              children: formatTime(timeLeft)
+            })]
+          })]
+        }), /*#__PURE__*/_jsx(Typography, {
+          variant: "h3",
+          bold: true,
+          color: theme.textPrimary,
+          style: styles.questionText,
+          children: params.questionText
+        }), /*#__PURE__*/_jsx(View, {
+          style: styles.optionsList,
+          children: params.options.map((option, index) => renderOption(option, index))
+        }), params.explanation && /*#__PURE__*/_jsxs(View, {
+          style: styles.explanationContainer,
+          children: [/*#__PURE__*/_jsx(Typography, {
+            variant: "caption",
+            bold: true,
+            color: theme.textPrimary,
+            style: styles.explanationTitle,
+            children: "EXPLANATION"
+          }), /*#__PURE__*/_jsx(Typography, {
+            variant: "body",
+            color: theme.textSecondary,
+            style: styles.explanationText,
+            children: params.explanation
+          }), params.referenceId && /*#__PURE__*/_jsx(View, {
+            style: styles.referenceContainer,
+            children: /*#__PURE__*/_jsx(Typography, {
+              variant: "caption",
+              color: theme.textSecondary,
+              style: styles.referenceText,
+              children: params.referenceId
+            })
+          })]
+        })]
+      }), /*#__PURE__*/_jsxs(View, {
+        style: styles.bottomActions,
+        children: [/*#__PURE__*/_jsxs(View, {
+          style: styles.leftActions,
+          children: [/*#__PURE__*/_jsx(TouchableOpacity, {
+            style: styles.iconAction,
+            onPress: onPressReport,
+            children: /*#__PURE__*/_jsx(Icon, {
+              name: "alert-circle",
+              size: 20,
+              color: theme.textSecondary
+            })
+          }), /*#__PURE__*/_jsx(TouchableOpacity, {
+            style: styles.iconAction,
+            onPress: onPressUsers,
+            children: /*#__PURE__*/_jsx(Icon, {
+              name: "users",
+              size: 20,
+              color: theme.textSecondary
+            })
+          })]
+        }), /*#__PURE__*/_jsxs(View, {
+          style: styles.rightActions,
+          children: [/*#__PURE__*/_jsx(TouchableOpacity, {
+            style: styles.prevBtn,
+            onPress: onPrev,
+            children: /*#__PURE__*/_jsx(Typography, {
+              variant: "body",
+              bold: true,
+              color: theme.textPrimary,
+              children: "Prev"
+            })
+          }), /*#__PURE__*/_jsx(Button, {
+            title: "Next",
+            onPress: onNext || (() => {}),
+            style: styles.nextBtn,
+            textStyle: styles.nextBtnText
+          })]
+        })]
+      })]
+    })]
+  });
+};
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    padding: 16 // Gray margin around the card
+  },
+  card: {
+    flex: 1,
+    backgroundColor: '#FFFFFF',
+    borderRadius: 8,
+    overflow: 'hidden',
+    shadowColor: '#000',
+    shadowOffset: {
+      width: 0,
+      height: 2
+    },
+    shadowOpacity: 0.1,
+    shadowRadius: 4,
+    elevation: 4
+  },
+  header: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    paddingHorizontal: 16,
+    paddingVertical: 12
+  },
+  headerIconBtnLeft: {
+    width: 40,
+    height: 40,
+    justifyContent: 'center',
+    alignItems: 'flex-start'
+  },
+  headerRightActions: {
+    flexDirection: 'row',
+    alignItems: 'center'
+  },
+  headerIconBtnRight: {
+    width: 40,
+    height: 40,
+    justifyContent: 'center',
+    alignItems: 'flex-end'
+  },
+  headerTitle: {
+    fontSize: 16,
+    fontWeight: '600',
+    flex: 1,
+    textAlign: 'center'
+  },
+  progressTrack: {
+    height: 4,
+    backgroundColor: '#E5E7EB',
+    width: '100%'
+  },
+  progressFill: {
+    height: '100%'
+  },
+  scrollContent: {
+    padding: 20,
+    paddingBottom: 40
+  },
+  topBar: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    alignItems: 'center',
+    marginBottom: 20
+  },
+  questionNumber: {
+    fontSize: 12,
+    letterSpacing: 0.5
+  },
+  timerWrapper: {
+    flexDirection: 'row',
+    alignItems: 'center'
+  },
+  timerText: {
+    fontSize: 12,
+    marginLeft: 6
+  },
+  questionText: {
+    fontSize: 16,
+    lineHeight: 24,
+    marginBottom: 24
+  },
+  optionsList: {
+    marginBottom: 32
+  },
+  optionContainer: {
+    borderWidth: 1,
+    borderRadius: 8,
+    padding: 16,
+    marginBottom: 12
+  },
+  optionContent: {
+    flexDirection: 'row',
+    alignItems: 'flex-start'
+  },
+  emptyCircle: {
+    width: 20,
+    height: 20,
+    borderRadius: 10,
+    borderWidth: 1,
+    borderColor: '#D1D5DB'
+  },
+  optionTextWrapper: {
+    flex: 1,
+    marginLeft: 12
+  },
+  optionText: {
+    fontSize: 14,
+    lineHeight: 20
+  },
+  optionStatusText: {
+    marginTop: 6,
+    fontSize: 12
+  },
+  explanationContainer: {
+    marginTop: 16
+  },
+  explanationTitle: {
+    fontSize: 12,
+    marginBottom: 12
+  },
+  explanationText: {
+    fontSize: 14,
+    lineHeight: 22
+  },
+  referenceContainer: {
+    marginTop: 24,
+    paddingTop: 16,
+    borderTopWidth: 1,
+    borderTopColor: '#F3F4F6',
+    alignItems: 'center'
+  },
+  referenceText: {
+    fontSize: 12
+  },
+  bottomActions: {
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    alignItems: 'center',
+    padding: 16,
+    borderTopWidth: 1,
+    borderTopColor: '#F3F4F6',
+    backgroundColor: '#FFFFFF'
+  },
+  leftActions: {
+    flexDirection: 'row',
+    alignItems: 'center'
+  },
+  iconAction: {
+    width: 36,
+    height: 36,
+    justifyContent: 'center',
+    alignItems: 'center',
+    marginRight: 8,
+    borderRadius: 18,
+    borderWidth: 1,
+    borderColor: '#E5E7EB'
+  },
+  rightActions: {
+    flexDirection: 'row',
+    alignItems: 'center'
+  },
+  prevBtn: {
+    marginRight: 20
+  },
+  nextBtn: {
+    backgroundColor: '#10B981',
+    paddingHorizontal: 24,
+    paddingVertical: 10,
+    height: 'auto',
+    minWidth: 80
+  },
+  nextBtnText: {
+    fontSize: 14,
+    fontWeight: '600'
+  }
+});
+//# sourceMappingURL=QBankQuestionScreen.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["React","useState","useEffect","View","ScrollView","StyleSheet","TouchableOpacity","StatusBar","SafeAreaView","useTheme","Typography","Icon","Button","jsx","_jsx","jsxs","_jsxs","formatTime","totalSeconds","minutes","Math","floor","seconds","toString","padStart","QBankQuestionScreen","params","initialTimeSeconds","onTimeUp","onBack","onNext","onPrev","onPressOption","onPressReport","onPressUsers","theme","timeLeft","setTimeLeft","timer","setInterval","prev","clearInterval","progressPercentage","questionNumber","totalQuestions","renderOption","option","index","letters","letter","borderColor","backgroundColor","iconName","iconColor","textSecondary","statusText","statusColor","status","success","style","styles","optionContainer","onPress","id","activeOpacity","children","optionContent","name","size","color","emptyCircle","optionTextWrapper","variant","textPrimary","optionText","text","optionStatusText","percentage","undefined","container","edges","barStyle","card","header","headerIconBtnLeft","headerTitle","headerIconBtnRight","progressTrack","progressFill","width","contentContainerStyle","scrollContent","showsVerticalScrollIndicator","topBar","bold","timerWrapper","timerText","questionText","optionsList","options","map","explanation","explanationContainer","explanationTitle","explanationText","referenceId","referenceContainer","referenceText","bottomActions","leftActions","iconAction","rightActions","prevBtn","title","nextBtn","textStyle","nextBtnText","create","flex","padding","borderRadius","overflow","shadowColor","shadowOffset","height","shadowOpacity","shadowRadius","elevation","flexDirection","alignItems","paddingHorizontal","paddingVertical","justifyContent","headerRightActions","fontSize","fontWeight","textAlign","paddingBottom","marginBottom","letterSpacing","marginLeft","lineHeight","borderWidth","marginTop","paddingTop","borderTopWidth","borderTopColor","marginRight","minWidth"],"sourceRoot":"../../../../src","sources":["screens/qbank/QBankQuestionScreen.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,QAAQ,EAAEC,SAAS,QAAQ,OAAO;AAClD,SACEC,IAAI,EACJC,UAAU,EACVC,UAAU,EACVC,gBAAgB,EAChBC,SAAS,QACJ,cAAc;AACrB,SAASC,YAAY,QAAQ,gCAAgC;AAC7D,SAASC,QAAQ,QAAQ,+BAA4B;AACrD,SAASC,UAAU,EAAEC,IAAI,EAAEC,MAAM,QAAQ,2BAAkB;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAe5D,MAAMC,UAAU,GAAIC,YAAoB,IAAK;EAC3C,MAAMC,OAAO,GAAGC,IAAI,CAACC,KAAK,CAACH,YAAY,GAAG,EAAE,CAAC;EAC7C,MAAMI,OAAO,GAAGJ,YAAY,GAAG,EAAE;EACjC,OAAO,GAAGC,OAAO,CAACI,QAAQ,CAAC,CAAC,CAACC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,IAAIF,OAAO,CAACC,QAAQ,CAAC,CAAC,CAACC,QAAQ,CAAC,CAAC,EAAE,GAAG,CAAC,EAAE;AACxF,CAAC;AAED,OAAO,MAAMC,mBAAuD,GAAGA,CAAC;EACtEC,MAAM;EACNC,kBAAkB,GAAG,EAAE;EACvBC,QAAQ;EACRC,MAAM;EACNC,MAAM;EACNC,MAAM;EACNC,aAAa;EACbC,aAAa;EACbC;AACF,CAAC,KAAK;EACJ,MAAMC,KAAK,GAAG1B,QAAQ,CAAC,CAAC;EACxB,MAAM,CAAC2B,QAAQ,EAAEC,WAAW,CAAC,GAAGpC,QAAQ,CAAC0B,kBAAkB,CAAC;EAE5DzB,SAAS,CAAC,MAAM;IACd,IAAIkC,QAAQ,IAAI,CAAC,EAAE;MACjBR,QAAQ,GAAG,CAAC;MACZ;IACF;IAEA,MAAMU,KAAK,GAAGC,WAAW,CAAC,MAAM;MAC9BF,WAAW,CAAEG,IAAI,IAAKA,IAAI,GAAG,CAAC,CAAC;IACjC,CAAC,EAAE,IAAI,CAAC;IAER,OAAO,MAAMC,aAAa,CAACH,KAAK,CAAC;EACnC,CAAC,EAAE,CAACF,QAAQ,EAAER,QAAQ,CAAC,CAAC;EAExB,MAAMc,kBAAkB,GAAIhB,MAAM,CAACiB,cAAc,GAAGjB,MAAM,CAACkB,cAAc,GAAI,GAAG;EAEhF,MAAMC,YAAY,GAAGA,CAACC,MAAmB,EAAEC,KAAa,KAAK;IAC3D,MAAMC,OAAO,GAAG,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAC9C,MAAMC,MAAM,GAAGD,OAAO,CAACD,KAAK,CAAC,IAAI,EAAE;IAEnC,IAAIG,WAAW,GAAG,SAAS,CAAC,CAAC;IAC7B,IAAIC,eAAe,GAAG,SAAS;IAC/B,IAAIC,QAAiD;IACrD,IAAIC,SAAS,GAAGlB,KAAK,CAACmB,aAAa;IACnC,IAAIC,UAAU,GAAG,EAAE;IACnB,IAAIC,WAAW,GAAG,EAAE;IAEpB,IAAIV,MAAM,CAACW,MAAM,KAAK,SAAS,EAAE;MAC/BP,WAAW,GAAGf,KAAK,CAACuB,OAAO;MAC3BP,eAAe,GAAG,SAAS,CAAC,CAAC;MAC7BC,QAAQ,GAAG,cAAc;MACzBC,SAAS,GAAGlB,KAAK,CAACuB,OAAO;MACzBH,UAAU,GAAG,SAAS;MACtBC,WAAW,GAAGrB,KAAK,CAACuB,OAAO;IAC7B,CAAC,MAAM,IAAIZ,MAAM,CAACW,MAAM,KAAK,WAAW,EAAE;MACxCP,WAAW,GAAG,SAAS;MACvBC,eAAe,GAAG,SAAS,CAAC,CAAC;MAC7BC,QAAQ,GAAG,UAAU;MACrBC,SAAS,GAAG,SAAS;MACrBE,UAAU,GAAG,WAAW,CAAC,CAAC;MAC1BC,WAAW,GAAG,SAAS;IACzB;IAEA,oBACE1C,IAAA,CAACR,gBAAgB;MAEfqD,KAAK,EAAE,CAACC,MAAM,CAACC,eAAe,EAAE;QAAEX,WAAW;QAAEC;MAAgB,CAAC,CAAE;MAClEW,OAAO,EAAEA,CAAA,KAAM9B,aAAa,GAAGc,MAAM,CAACiB,EAAE,CAAE;MAC1CC,aAAa,EAAE,GAAI;MAAAC,QAAA,eAEnBjD,KAAA,CAACb,IAAI;QAACwD,KAAK,EAAEC,MAAM,CAACM,aAAc;QAAAD,QAAA,GAC/Bb,QAAQ,gBACPtC,IAAA,CAACH,IAAI;UAACwD,IAAI,EAAEf,QAAS;UAACgB,IAAI,EAAE,EAAG;UAACC,KAAK,EAAEhB;QAAU,CAAE,CAAC,gBAEpDvC,IAAA,CAACX,IAAI;UAACwD,KAAK,EAAEC,MAAM,CAACU;QAAY,CAAE,CACnC,eACDtD,KAAA,CAACb,IAAI;UAACwD,KAAK,EAAEC,MAAM,CAACW,iBAAkB;UAAAN,QAAA,gBACpCjD,KAAA,CAACN,UAAU;YAAC8D,OAAO,EAAC,MAAM;YAACH,KAAK,EAAElC,KAAK,CAACsC,WAAY;YAACd,KAAK,EAAEC,MAAM,CAACc,UAAW;YAAAT,QAAA,GAC3EhB,MAAM,EAAC,IAAE,EAACH,MAAM,CAAC6B,IAAI;UAAA,CACZ,CAAC,EACZ,CAAC7B,MAAM,CAACW,MAAM,KAAK,SAAS,IAAIX,MAAM,CAACW,MAAM,KAAK,WAAW,kBAC5DzC,KAAA,CAACN,UAAU;YAAC8D,OAAO,EAAC,SAAS;YAACH,KAAK,EAAEb,WAAY;YAACG,KAAK,EAAEC,MAAM,CAACgB,gBAAiB;YAAAX,QAAA,GAC9EV,UAAU,EAAC,GAAC,eAAAvC,KAAA,CAACN,UAAU;cAAC8D,OAAO,EAAC,SAAS;cAACH,KAAK,EAAElC,KAAK,CAACmB,aAAc;cAAAW,QAAA,GAAC,GAAC,EAACnB,MAAM,CAAC+B,UAAU,EAAC,IAAE;YAAA,CAAY,CAAC;UAAA,CAChG,CACb,EACA/B,MAAM,CAACW,MAAM,KAAK,SAAS,IAAIX,MAAM,CAAC+B,UAAU,KAAKC,SAAS,iBAC7D9D,KAAA,CAACN,UAAU;YAAC8D,OAAO,EAAC,SAAS;YAACH,KAAK,EAAElC,KAAK,CAACmB,aAAc;YAACK,KAAK,EAAEC,MAAM,CAACgB,gBAAiB;YAAAX,QAAA,GAAC,GACvF,EAACnB,MAAM,CAAC+B,UAAU,EAAC,IACtB;UAAA,CAAY,CACb;QAAA,CACG,CAAC;MAAA,CACH;IAAC,GA1BF/B,MAAM,CAACiB,EA2BI,CAAC;EAEvB,CAAC;EAED,oBACE/C,KAAA,CAACR,YAAY;IAACmD,KAAK,EAAE,CAACC,MAAM,CAACmB,SAAS,EAAE;MAAE5B,eAAe,EAAE;IAAU,CAAC,CAAE;IAAC6B,KAAK,EAAE,CAAC,KAAK,EAAE,QAAQ,CAAE;IAAAf,QAAA,gBAChGnD,IAAA,CAACP,SAAS;MAAC0E,QAAQ,EAAC,cAAc;MAAC9B,eAAe,EAAC;IAAS,CAAE,CAAC,eAE/DnC,KAAA,CAACb,IAAI;MAACwD,KAAK,EAAEC,MAAM,CAACsB,IAAK;MAAAjB,QAAA,gBAEvBjD,KAAA,CAACb,IAAI;QAACwD,KAAK,EAAEC,MAAM,CAACuB,MAAO;QAAAlB,QAAA,gBACzBnD,IAAA,CAACR,gBAAgB;UAACwD,OAAO,EAAEjC,MAAO;UAAC8B,KAAK,EAAEC,MAAM,CAACwB,iBAAkB;UAAAnB,QAAA,eACjEnD,IAAA,CAACH,IAAI;YAACwD,IAAI,EAAC,cAAc;YAACC,IAAI,EAAE,EAAG;YAACC,KAAK,EAAElC,KAAK,CAACsC;UAAY,CAAE;QAAC,CAChD,CAAC,eACnB3D,IAAA,CAACJ,UAAU;UAAC8D,OAAO,EAAC,IAAI;UAACH,KAAK,EAAElC,KAAK,CAACsC,WAAY;UAACd,KAAK,EAAEC,MAAM,CAACyB,WAAY;UAAApB,QAAA,EAC1EvC,MAAM,CAAC2D;QAAW,CACT,CAAC,eACbvE,IAAA,CAACX,IAAI;UAACwD,KAAK,EAAEC,MAAM,CAAC0B;QAAmB,CAAE,CAAC;MAAA,CACtC,CAAC,eAGPxE,IAAA,CAACX,IAAI;QAACwD,KAAK,EAAEC,MAAM,CAAC2B,aAAc;QAAAtB,QAAA,eAChCnD,IAAA,CAACX,IAAI;UAACwD,KAAK,EAAE,CAACC,MAAM,CAAC4B,YAAY,EAAE;YAAEC,KAAK,EAAE,GAAG/C,kBAAkB,GAAG;YAAES,eAAe,EAAEhB,KAAK,CAACuB;UAAQ,CAAC;QAAE,CAAE;MAAC,CACvG,CAAC,eAEP1C,KAAA,CAACZ,UAAU;QACTsF,qBAAqB,EAAE9B,MAAM,CAAC+B,aAAc;QAC5CC,4BAA4B,EAAE,KAAM;QAAA3B,QAAA,gBAGpCjD,KAAA,CAACb,IAAI;UAACwD,KAAK,EAAEC,MAAM,CAACiC,MAAO;UAAA5B,QAAA,gBACzBjD,KAAA,CAACN,UAAU;YAAC8D,OAAO,EAAC,SAAS;YAACsB,IAAI;YAACzB,KAAK,EAAElC,KAAK,CAACmB,aAAc;YAACK,KAAK,EAAEC,MAAM,CAACjB,cAAe;YAAAsB,QAAA,GAAC,WAClF,EAACvC,MAAM,CAACiB,cAAc,EAAC,GAAC,EAACjB,MAAM,CAACkB,cAAc;UAAA,CAC7C,CAAC,eACb5B,KAAA,CAACb,IAAI;YAACwD,KAAK,EAAEC,MAAM,CAACmC,YAAa;YAAA9B,QAAA,gBAC/BnD,IAAA,CAACH,IAAI;cAACwD,IAAI,EAAC,OAAO;cAACC,IAAI,EAAE,EAAG;cAACC,KAAK,EAAElC,KAAK,CAACmB;YAAc,CAAE,CAAC,eAC3DxC,IAAA,CAACJ,UAAU;cAAC8D,OAAO,EAAC,SAAS;cAACH,KAAK,EAAElC,KAAK,CAACmB,aAAc;cAACK,KAAK,EAAEC,MAAM,CAACoC,SAAU;cAAA/B,QAAA,EAC/EhD,UAAU,CAACmB,QAAQ;YAAC,CACX,CAAC;UAAA,CACT,CAAC;QAAA,CACH,CAAC,eAGPtB,IAAA,CAACJ,UAAU;UAAC8D,OAAO,EAAC,IAAI;UAACsB,IAAI;UAACzB,KAAK,EAAElC,KAAK,CAACsC,WAAY;UAACd,KAAK,EAAEC,MAAM,CAACqC,YAAa;UAAAhC,QAAA,EAChFvC,MAAM,CAACuE;QAAY,CACV,CAAC,eAGbnF,IAAA,CAACX,IAAI;UAACwD,KAAK,EAAEC,MAAM,CAACsC,WAAY;UAAAjC,QAAA,EAC7BvC,MAAM,CAACyE,OAAO,CAACC,GAAG,CAAC,CAACtD,MAAM,EAAEC,KAAK,KAAKF,YAAY,CAACC,MAAM,EAAEC,KAAK,CAAC;QAAC,CAC/D,CAAC,EAGNrB,MAAM,CAAC2E,WAAW,iBACjBrF,KAAA,CAACb,IAAI;UAACwD,KAAK,EAAEC,MAAM,CAAC0C,oBAAqB;UAAArC,QAAA,gBACvCnD,IAAA,CAACJ,UAAU;YAAC8D,OAAO,EAAC,SAAS;YAACsB,IAAI;YAACzB,KAAK,EAAElC,KAAK,CAACsC,WAAY;YAACd,KAAK,EAAEC,MAAM,CAAC2C,gBAAiB;YAAAtC,QAAA,EAAC;UAE7F,CAAY,CAAC,eACbnD,IAAA,CAACJ,UAAU;YAAC8D,OAAO,EAAC,MAAM;YAACH,KAAK,EAAElC,KAAK,CAACmB,aAAc;YAACK,KAAK,EAAEC,MAAM,CAAC4C,eAAgB;YAAAvC,QAAA,EAClFvC,MAAM,CAAC2E;UAAW,CACT,CAAC,EAEZ3E,MAAM,CAAC+E,WAAW,iBACjB3F,IAAA,CAACX,IAAI;YAACwD,KAAK,EAAEC,MAAM,CAAC8C,kBAAmB;YAAAzC,QAAA,eACrCnD,IAAA,CAACJ,UAAU;cAAC8D,OAAO,EAAC,SAAS;cAACH,KAAK,EAAElC,KAAK,CAACmB,aAAc;cAACK,KAAK,EAAEC,MAAM,CAAC+C,aAAc;cAAA1C,QAAA,EACnFvC,MAAM,CAAC+E;YAAW,CACT;UAAC,CACT,CACP;QAAA,CACG,CACP;MAAA,CACS,CAAC,eAGbzF,KAAA,CAACb,IAAI;QAACwD,KAAK,EAAEC,MAAM,CAACgD,aAAc;QAAA3C,QAAA,gBAChCjD,KAAA,CAACb,IAAI;UAACwD,KAAK,EAAEC,MAAM,CAACiD,WAAY;UAAA5C,QAAA,gBAC9BnD,IAAA,CAACR,gBAAgB;YAACqD,KAAK,EAAEC,MAAM,CAACkD,UAAW;YAAChD,OAAO,EAAE7B,aAAc;YAAAgC,QAAA,eACjEnD,IAAA,CAACH,IAAI;cAACwD,IAAI,EAAC,cAAc;cAACC,IAAI,EAAE,EAAG;cAACC,KAAK,EAAElC,KAAK,CAACmB;YAAc,CAAE;UAAC,CAClD,CAAC,eACnBxC,IAAA,CAACR,gBAAgB;YAACqD,KAAK,EAAEC,MAAM,CAACkD,UAAW;YAAChD,OAAO,EAAE5B,YAAa;YAAA+B,QAAA,eAChEnD,IAAA,CAACH,IAAI;cAACwD,IAAI,EAAC,OAAO;cAACC,IAAI,EAAE,EAAG;cAACC,KAAK,EAAElC,KAAK,CAACmB;YAAc,CAAE;UAAC,CAC3C,CAAC;QAAA,CACf,CAAC,eACPtC,KAAA,CAACb,IAAI;UAACwD,KAAK,EAAEC,MAAM,CAACmD,YAAa;UAAA9C,QAAA,gBAC/BnD,IAAA,CAACR,gBAAgB;YAACqD,KAAK,EAAEC,MAAM,CAACoD,OAAQ;YAAClD,OAAO,EAAE/B,MAAO;YAAAkC,QAAA,eACvDnD,IAAA,CAACJ,UAAU;cAAC8D,OAAO,EAAC,MAAM;cAACsB,IAAI;cAACzB,KAAK,EAAElC,KAAK,CAACsC,WAAY;cAAAR,QAAA,EAAC;YAE1D,CAAY;UAAC,CACG,CAAC,eACnBnD,IAAA,CAACF,MAAM;YACLqG,KAAK,EAAC,MAAM;YACZnD,OAAO,EAAEhC,MAAM,KAAK,MAAM,CAAC,CAAC,CAAE;YAC9B6B,KAAK,EAAEC,MAAM,CAACsD,OAAQ;YACtBC,SAAS,EAAEvD,MAAM,CAACwD;UAAY,CAC/B,CAAC;QAAA,CACE,CAAC;MAAA,CACH,CAAC;IAAA,CAEH,CAAC;EAAA,CACK,CAAC;AAEnB,CAAC;AAED,MAAMxD,MAAM,GAAGvD,UAAU,CAACgH,MAAM,CAAC;EAC/BtC,SAAS,EAAE;IACTuC,IAAI,EAAE,CAAC;IACPC,OAAO,EAAE,EAAE,CAAE;EACf,CAAC;EACDrC,IAAI,EAAE;IACJoC,IAAI,EAAE,CAAC;IACPnE,eAAe,EAAE,SAAS;IAC1BqE,YAAY,EAAE,CAAC;IACfC,QAAQ,EAAE,QAAQ;IAClBC,WAAW,EAAE,MAAM;IACnBC,YAAY,EAAE;MAAElC,KAAK,EAAE,CAAC;MAAEmC,MAAM,EAAE;IAAE,CAAC;IACrCC,aAAa,EAAE,GAAG;IAClBC,YAAY,EAAE,CAAC;IACfC,SAAS,EAAE;EACb,CAAC;EACD5C,MAAM,EAAE;IACN6C,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE,QAAQ;IACpBC,iBAAiB,EAAE,EAAE;IACrBC,eAAe,EAAE;EACnB,CAAC;EACD/C,iBAAiB,EAAE;IACjBK,KAAK,EAAE,EAAE;IACTmC,MAAM,EAAE,EAAE;IACVQ,cAAc,EAAE,QAAQ;IACxBH,UAAU,EAAE;EACd,CAAC;EACDI,kBAAkB,EAAE;IAClBL,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE;EACd,CAAC;EACD3C,kBAAkB,EAAE;IAClBG,KAAK,EAAE,EAAE;IACTmC,MAAM,EAAE,EAAE;IACVQ,cAAc,EAAE,QAAQ;IACxBH,UAAU,EAAE;EACd,CAAC;EACD5C,WAAW,EAAE;IACXiD,QAAQ,EAAE,EAAE;IACZC,UAAU,EAAE,KAAK;IACjBjB,IAAI,EAAE,CAAC;IACPkB,SAAS,EAAE;EACb,CAAC;EACDjD,aAAa,EAAE;IACbqC,MAAM,EAAE,CAAC;IACTzE,eAAe,EAAE,SAAS;IAC1BsC,KAAK,EAAE;EACT,CAAC;EACDD,YAAY,EAAE;IACZoC,MAAM,EAAE;EACV,CAAC;EACDjC,aAAa,EAAE;IACb4B,OAAO,EAAE,EAAE;IACXkB,aAAa,EAAE;EACjB,CAAC;EACD5C,MAAM,EAAE;IACNmC,aAAa,EAAE,KAAK;IACpBI,cAAc,EAAE,eAAe;IAC/BH,UAAU,EAAE,QAAQ;IACpBS,YAAY,EAAE;EAChB,CAAC;EACD/F,cAAc,EAAE;IACd2F,QAAQ,EAAE,EAAE;IACZK,aAAa,EAAE;EACjB,CAAC;EACD5C,YAAY,EAAE;IACZiC,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE;EACd,CAAC;EACDjC,SAAS,EAAE;IACTsC,QAAQ,EAAE,EAAE;IACZM,UAAU,EAAE;EACd,CAAC;EACD3C,YAAY,EAAE;IACZqC,QAAQ,EAAE,EAAE;IACZO,UAAU,EAAE,EAAE;IACdH,YAAY,EAAE;EAChB,CAAC;EACDxC,WAAW,EAAE;IACXwC,YAAY,EAAE;EAChB,CAAC;EACD7E,eAAe,EAAE;IACfiF,WAAW,EAAE,CAAC;IACdtB,YAAY,EAAE,CAAC;IACfD,OAAO,EAAE,EAAE;IACXmB,YAAY,EAAE;EAChB,CAAC;EACDxE,aAAa,EAAE;IACb8D,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE;EACd,CAAC;EACD3D,WAAW,EAAE;IACXmB,KAAK,EAAE,EAAE;IACTmC,MAAM,EAAE,EAAE;IACVJ,YAAY,EAAE,EAAE;IAChBsB,WAAW,EAAE,CAAC;IACd5F,WAAW,EAAE;EACf,CAAC;EACDqB,iBAAiB,EAAE;IACjB+C,IAAI,EAAE,CAAC;IACPsB,UAAU,EAAE;EACd,CAAC;EACDlE,UAAU,EAAE;IACV4D,QAAQ,EAAE,EAAE;IACZO,UAAU,EAAE;EACd,CAAC;EACDjE,gBAAgB,EAAE;IAChBmE,SAAS,EAAE,CAAC;IACZT,QAAQ,EAAE;EACZ,CAAC;EACDhC,oBAAoB,EAAE;IACpByC,SAAS,EAAE;EACb,CAAC;EACDxC,gBAAgB,EAAE;IAChB+B,QAAQ,EAAE,EAAE;IACZI,YAAY,EAAE;EAChB,CAAC;EACDlC,eAAe,EAAE;IACf8B,QAAQ,EAAE,EAAE;IACZO,UAAU,EAAE;EACd,CAAC;EACDnC,kBAAkB,EAAE;IAClBqC,SAAS,EAAE,EAAE;IACbC,UAAU,EAAE,EAAE;IACdC,cAAc,EAAE,CAAC;IACjBC,cAAc,EAAE,SAAS;IACzBjB,UAAU,EAAE;EACd,CAAC;EACDtB,aAAa,EAAE;IACb2B,QAAQ,EAAE;EACZ,CAAC;EACD1B,aAAa,EAAE;IACboB,aAAa,EAAE,KAAK;IACpBI,cAAc,EAAE,eAAe;IAC/BH,UAAU,EAAE,QAAQ;IACpBV,OAAO,EAAE,EAAE;IACX0B,cAAc,EAAE,CAAC;IACjBC,cAAc,EAAE,SAAS;IACzB/F,eAAe,EAAE;EACnB,CAAC;EACD0D,WAAW,EAAE;IACXmB,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE;EACd,CAAC;EACDnB,UAAU,EAAE;IACVrB,KAAK,EAAE,EAAE;IACTmC,MAAM,EAAE,EAAE;IACVQ,cAAc,EAAE,QAAQ;IACxBH,UAAU,EAAE,QAAQ;IACpBkB,WAAW,EAAE,CAAC;IACd3B,YAAY,EAAE,EAAE;IAChBsB,WAAW,EAAE,CAAC;IACd5F,WAAW,EAAE;EACf,CAAC;EACD6D,YAAY,EAAE;IACZiB,aAAa,EAAE,KAAK;IACpBC,UAAU,EAAE;EACd,CAAC;EACDjB,OAAO,EAAE;IACPmC,WAAW,EAAE;EACf,CAAC;EACDjC,OAAO,EAAE;IACP/D,eAAe,EAAE,SAAS;IAC1B+E,iBAAiB,EAAE,EAAE;IACrBC,eAAe,EAAE,EAAE;IACnBP,MAAM,EAAE,MAAM;IACdwB,QAAQ,EAAE;EACZ,CAAC;EACDhC,WAAW,EAAE;IACXkB,QAAQ,EAAE,EAAE;IACZC,UAAU,EAAE;EACd;AACF,CAAC,CAAC","ignoreList":[]}

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

@@ -1,10 +1,10 @@
 "use strict";
 
 import React, { useState, useRef } from 'react';
-import { View, ScrollView, StyleSheet, TouchableOpacity, StatusBar, FlatList, Modal, TouchableWithoutFeedback } from 'react-native';
+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 { Typography, Icon, BottomSheet } from "../../components/index.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 export const QBankSubTopicScreen = ({
   params,
@@ -12,7 +12,8 @@ export const QBankSubTopicScreen = ({
   onBack,
   onPressModule,
   onPressFilter,
-  onPressSearch
+  onPressSearch,
+  isProUser = false
 }) => {
   const theme = useTheme();
   const [activeFilter, setActiveFilter] = useState(params.activeFilter || params.filters[0]);
@@ -203,19 +204,23 @@ export const QBankSubTopicScreen = ({
                       },
                       children: "FREE"
                     })
-                  }), moduleItem.status === 'locked' && /*#__PURE__*/_jsx(View, {
-                    style: styles.lockedBadge,
-                    children: /*#__PURE__*/_jsx(Icon, {
-                      name: "lock",
-                      size: 12,
-                      color: "#64748B"
+                  }), moduleItem.status === 'locked' && !isProUser && /*#__PURE__*/_jsx(View, {
+                    style: styles.proBadge,
+                    children: /*#__PURE__*/_jsx(Typography, {
+                      variant: "caption",
+                      bold: true,
+                      color: "#FFFFFF",
+                      style: {
+                        fontSize: 7
+                      },
+                      children: "PRO"
                     })
                   }), moduleItem.attemptStatus === 'resume' && /*#__PURE__*/_jsx(Typography, {
                     variant: "caption",
                     bold: true,
                     color: "#F59E0B",
                     style: {
-                      fontSize: 11
+                      fontSize: 9
                     },
                     children: "RESUME"
                   }), moduleItem.attemptStatus === 'completed' && /*#__PURE__*/_jsxs(View, {
@@ -229,7 +234,7 @@ export const QBankSubTopicScreen = ({
                         bold: true,
                         color: "#FFFFFF",
                         style: {
-                          fontSize: 8
+                          fontSize: 7
                         },
                         children: "COMPLETED"
                       })
@@ -238,7 +243,7 @@ export const QBankSubTopicScreen = ({
                       bold: true,
                       color: theme.success,
                       style: {
-                        fontSize: 12,
+                        fontSize: 10,
                         marginTop: 4
                       },
                       children: [moduleItem.correctPercentage, "% Correct"]
@@ -250,52 +255,41 @@ export const QBankSubTopicScreen = ({
           })]
         }, section.id);
       })]
-    }), /*#__PURE__*/_jsx(Modal, {
+    }), /*#__PURE__*/_jsxs(BottomSheet, {
       visible: showTOC,
-      transparent: true,
-      animationType: "slide",
-      onRequestClose: () => setShowTOC(false),
-      children: /*#__PURE__*/_jsx(TouchableOpacity, {
-        style: styles.modalOverlay,
-        activeOpacity: 1,
-        onPress: () => setShowTOC(false),
-        children: /*#__PURE__*/_jsx(TouchableWithoutFeedback, {
-          children: /*#__PURE__*/_jsxs(View, {
-            style: styles.bottomSheet,
-            children: [/*#__PURE__*/_jsxs(View, {
-              style: styles.sheetHeader,
-              children: [/*#__PURE__*/_jsx(Typography, {
-                variant: "h3",
-                bold: true,
-                color: theme.textPrimary,
-                children: "Table of Contents"
-              }), /*#__PURE__*/_jsx(TouchableOpacity, {
-                onPress: () => setShowTOC(false),
-                children: /*#__PURE__*/_jsx(Icon, {
-                  name: "x",
-                  size: 24,
-                  color: theme.textSecondary
-                })
-              })]
-            }), /*#__PURE__*/_jsx(ScrollView, {
-              style: styles.sheetScroll,
-              children: params.sections.map(section => /*#__PURE__*/_jsxs(TouchableOpacity, {
-                style: styles.sheetItem,
-                onPress: () => scrollToSection(section.id),
-                children: [/*#__PURE__*/_jsx(Typography, {
-                  variant: "body",
-                  color: theme.textPrimary,
-                  children: section.title
-                }), /*#__PURE__*/_jsx(Icon, {
-                  name: "chevron-right",
-                  size: 20,
-                  color: theme.textSecondary
-                })]
-              }, section.id))
-            })]
+      onClose: () => setShowTOC(false),
+      height: 400,
+      children: [/*#__PURE__*/_jsxs(View, {
+        style: styles.sheetHeader,
+        children: [/*#__PURE__*/_jsx(Typography, {
+          variant: "h3",
+          bold: true,
+          color: theme.textPrimary,
+          children: "Table of Contents"
+        }), /*#__PURE__*/_jsx(TouchableOpacity, {
+          onPress: () => setShowTOC(false),
+          children: /*#__PURE__*/_jsx(Icon, {
+            name: "x",
+            size: 24,
+            color: theme.textSecondary
           })
-        })
-      })
+        })]
+      }), /*#__PURE__*/_jsx(ScrollView, {
+        style: styles.sheetScroll,
+        children: params.sections.map(section => /*#__PURE__*/_jsxs(TouchableOpacity, {
+          style: styles.sheetItem,
+          onPress: () => scrollToSection(section.id),
+          children: [/*#__PURE__*/_jsx(Typography, {
+            variant: "body",
+            color: theme.textPrimary,
+            children: section.title
+          }), /*#__PURE__*/_jsx(Icon, {
+            name: "chevron-right",
+            size: 20,
+            color: theme.textSecondary
+          })]
+        }, section.id))
+      })]
     })]
   });
 };
@@ -474,13 +468,11 @@ const styles = StyleSheet.create({
     borderColor: '#10B981',
     backgroundColor: '#FFFFFF'
   },
-  lockedBadge: {
-    width: 24,
-    height: 24,
-    borderRadius: 12,
-    backgroundColor: '#F1F5F9',
-    justifyContent: 'center',
-    alignItems: 'center'
+  proBadge: {
+    paddingHorizontal: 6,
+    paddingVertical: 2,
+    borderRadius: 4,
+    backgroundColor: '#F59E0B'
   },
   completedBadge: {
     paddingHorizontal: 6,
@@ -488,18 +480,6 @@ const styles = StyleSheet.create({
     borderRadius: 4,
     backgroundColor: '#10B981'
   },
-  modalOverlay: {
-    flex: 1,
-    backgroundColor: 'rgba(0,0,0,0.4)',
-    justifyContent: 'flex-end'
-  },
-  bottomSheet: {
-    backgroundColor: '#FFFFFF',
-    borderTopLeftRadius: 20,
-    borderTopRightRadius: 20,
-    paddingBottom: 40,
-    maxHeight: '70%'
-  },
   sheetHeader: {
     flexDirection: 'row',
     justifyContent: 'space-between',