@magmamath/students-features 1.3.26-rc.14 → 1.3.26-rc.15

package/dist/commonjs/features/fluency-teacher/components/matrix/DrawerMatrix.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.DrawerMatrix = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _reactNative = require("react-native");
+var _reactNativeUi = require("@magmamath/react-native-ui");
 var _MatrixHeaderRow = require("./MatrixHeaderRow.js");
 var _MatrixRow = require("./MatrixRow.js");
 var _jsxRuntime = require("react/jsx-runtime");
@@ -20,7 +21,10 @@ const DrawerMatrix = ({
 }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
   style: styles.container,
   onLayout: onLayout,
-  children: grid && cellSize > 0 && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+  children: !grid ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+    style: styles.emptyText,
+    children: "No facts practiced yet"
+  }) : cellSize > 0 && /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
     style: styles.grid,
     children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_MatrixHeaderRow.MatrixHeaderRow, {
       colLabels: grid.colLabels,
@@ -45,6 +49,12 @@ const styles = _reactNative.StyleSheet.create({
   },
   grid: {
     gap: 2
+  },
+  emptyText: {
+    fontFamily: _reactNativeUi.FONT_FAMILY.buenosAiresSemiBold,
+    fontSize: 13,
+    color: _reactNativeUi.COLORS.NEUTRAL_6,
+    textAlign: 'center'
   }
 });
 //# sourceMappingURL=DrawerMatrix.js.map

package/dist/commonjs/features/fluency-teacher/components/matrix/DrawerMatrix.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_MatrixHeaderRow","_MatrixRow","_jsxRuntime","e","__esModule","default","DrawerMatrix","grid","cellSize","fontSize","borderRadius","cellColorMap","onLayout","jsx","View","style","styles","container","children","jsxs","MatrixHeaderRow","colLabels","rows","map","row","MatrixRow","label","cells","colorMap","exports","StyleSheet","create","flex","alignItems","justifyContent","gap"],"sourceRoot":"../../../../../../src","sources":["features/fluency-teacher/components/matrix/DrawerMatrix.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAEA,IAAAE,gBAAA,GAAAF,OAAA;AACA,IAAAG,UAAA,GAAAH,OAAA;AAAuC,IAAAI,WAAA,GAAAJ,OAAA;AAAA,SAAAD,uBAAAM,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAYhC,MAAMG,YAAY,GAAGA,CAAC;EAC3BC,IAAI;EACJC,QAAQ;EACRC,QAAQ;EACRC,YAAY;EACZC,YAAY;EACZC;AACiB,CAAC,kBAClB,IAAAV,WAAA,CAAAW,GAAA,EAACd,YAAA,CAAAe,IAAI;EAACC,KAAK,EAAEC,MAAM,CAACC,SAAU;EAACL,QAAQ,EAAEA,QAAS;EAAAM,QAAA,EAC/CX,IAAI,IAAIC,QAAQ,GAAG,CAAC,iBACnB,IAAAN,WAAA,CAAAiB,IAAA,EAACpB,YAAA,CAAAe,IAAI;IAACC,KAAK,EAAEC,MAAM,CAACT,IAAK;IAAAW,QAAA,gBACvB,IAAAhB,WAAA,CAAAW,GAAA,EAACb,gBAAA,CAAAoB,eAAe;MAACC,SAAS,EAAEd,IAAI,CAACc,SAAU;MAACb,QAAQ,EAAEA,QAAS;MAACC,QAAQ,EAAEA;IAAS,CAAE,CAAC,EACrFF,IAAI,CAACe,IAAI,CAACC,GAAG,CAAEC,GAAG,iBACjB,IAAAtB,WAAA,CAAAW,GAAA,EAACZ,UAAA,CAAAwB,SAAS;MAERC,KAAK,EAAEF,GAAG,CAACE,KAAM;MACjBC,KAAK,EAAEH,GAAG,CAACG,KAAM;MACjBnB,QAAQ,EAAEA,QAAS;MACnBE,YAAY,EAAEA,YAAa;MAC3BkB,QAAQ,EAAEjB,YAAa;MACvBF,QAAQ,EAAEA;IAAS,GANde,GAAG,CAACE,KAOV,CACF,CAAC;EAAA,CACE;AACP,CACG,CACP;AAAAG,OAAA,CAAAvB,YAAA,GAAAA,YAAA;AAED,MAAMU,MAAM,GAAGc,uBAAU,CAACC,MAAM,CAAC;EAC/Bd,SAAS,EAAE;IACTe,IAAI,EAAE,CAAC;IACPC,UAAU,EAAE,QAAQ;IACpBC,cAAc,EAAE;EAClB,CAAC;EACD3B,IAAI,EAAE;IACJ4B,GAAG,EAAE;EACP;AACF,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_reactNativeUi","_MatrixHeaderRow","_MatrixRow","_jsxRuntime","e","__esModule","default","DrawerMatrix","grid","cellSize","fontSize","borderRadius","cellColorMap","onLayout","jsx","View","style","styles","container","children","Text","emptyText","jsxs","MatrixHeaderRow","colLabels","rows","map","row","MatrixRow","label","cells","colorMap","exports","StyleSheet","create","flex","alignItems","justifyContent","gap","fontFamily","FONT_FAMILY","buenosAiresSemiBold","color","COLORS","NEUTRAL_6","textAlign"],"sourceRoot":"../../../../../../src","sources":["features/fluency-teacher/components/matrix/DrawerMatrix.tsx"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,YAAA,GAAAD,OAAA;AAEA,IAAAE,cAAA,GAAAF,OAAA;AACA,IAAAG,gBAAA,GAAAH,OAAA;AACA,IAAAI,UAAA,GAAAJ,OAAA;AAAuC,IAAAK,WAAA,GAAAL,OAAA;AAAA,SAAAD,uBAAAO,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAYhC,MAAMG,YAAY,GAAGA,CAAC;EAC3BC,IAAI;EACJC,QAAQ;EACRC,QAAQ;EACRC,YAAY;EACZC,YAAY;EACZC;AACiB,CAAC,kBAClB,IAAAV,WAAA,CAAAW,GAAA,EAACf,YAAA,CAAAgB,IAAI;EAACC,KAAK,EAAEC,MAAM,CAACC,SAAU;EAACL,QAAQ,EAAEA,QAAS;EAAAM,QAAA,EAC/C,CAACX,IAAI,gBACJ,IAAAL,WAAA,CAAAW,GAAA,EAACf,YAAA,CAAAqB,IAAI;IAACJ,KAAK,EAAEC,MAAM,CAACI,SAAU;IAAAF,QAAA,EAAC;EAAsB,CAAM,CAAC,GAE5DV,QAAQ,GAAG,CAAC,iBACV,IAAAN,WAAA,CAAAmB,IAAA,EAACvB,YAAA,CAAAgB,IAAI;IAACC,KAAK,EAAEC,MAAM,CAACT,IAAK;IAAAW,QAAA,gBACvB,IAAAhB,WAAA,CAAAW,GAAA,EAACb,gBAAA,CAAAsB,eAAe;MAACC,SAAS,EAAEhB,IAAI,CAACgB,SAAU;MAACf,QAAQ,EAAEA,QAAS;MAACC,QAAQ,EAAEA;IAAS,CAAE,CAAC,EACrFF,IAAI,CAACiB,IAAI,CAACC,GAAG,CAAEC,GAAG,iBACjB,IAAAxB,WAAA,CAAAW,GAAA,EAACZ,UAAA,CAAA0B,SAAS;MAERC,KAAK,EAAEF,GAAG,CAACE,KAAM;MACjBC,KAAK,EAAEH,GAAG,CAACG,KAAM;MACjBrB,QAAQ,EAAEA,QAAS;MACnBE,YAAY,EAAEA,YAAa;MAC3BoB,QAAQ,EAAEnB,YAAa;MACvBF,QAAQ,EAAEA;IAAS,GANdiB,GAAG,CAACE,KAOV,CACF,CAAC;EAAA,CACE;AAET,CACG,CACP;AAAAG,OAAA,CAAAzB,YAAA,GAAAA,YAAA;AAED,MAAMU,MAAM,GAAGgB,uBAAU,CAACC,MAAM,CAAC;EAC/BhB,SAAS,EAAE;IACTiB,IAAI,EAAE,CAAC;IACPC,UAAU,EAAE,QAAQ;IACpBC,cAAc,EAAE;EAClB,CAAC;EACD7B,IAAI,EAAE;IACJ8B,GAAG,EAAE;EACP,CAAC;EACDjB,SAAS,EAAE;IACTkB,UAAU,EAAEC,0BAAW,CAACC,mBAAmB;IAC3C/B,QAAQ,EAAE,EAAE;IACZgC,KAAK,EAAEC,qBAAM,CAACC,SAAS;IACvBC,SAAS,EAAE;EACb;AACF,CAAC,CAAC","ignoreList":[]}

package/dist/module/features/fluency-teacher/components/matrix/DrawerMatrix.js

@@ -1,7 +1,8 @@
 "use strict";
 
 import React from 'react';
-import { StyleSheet, View } from 'react-native';
+import { StyleSheet, Text, View } from 'react-native';
+import { COLORS, FONT_FAMILY } from '@magmamath/react-native-ui';
 import { MatrixHeaderRow } from "./MatrixHeaderRow.js";
 import { MatrixRow } from "./MatrixRow.js";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
@@ -15,7 +16,10 @@ export const DrawerMatrix = ({
 }) => /*#__PURE__*/_jsx(View, {
   style: styles.container,
   onLayout: onLayout,
-  children: grid && cellSize > 0 && /*#__PURE__*/_jsxs(View, {
+  children: !grid ? /*#__PURE__*/_jsx(Text, {
+    style: styles.emptyText,
+    children: "No facts practiced yet"
+  }) : cellSize > 0 && /*#__PURE__*/_jsxs(View, {
     style: styles.grid,
     children: [/*#__PURE__*/_jsx(MatrixHeaderRow, {
       colLabels: grid.colLabels,
@@ -39,6 +43,12 @@ const styles = StyleSheet.create({
   },
   grid: {
     gap: 2
+  },
+  emptyText: {
+    fontFamily: FONT_FAMILY.buenosAiresSemiBold,
+    fontSize: 13,
+    color: COLORS.NEUTRAL_6,
+    textAlign: 'center'
   }
 });
 //# sourceMappingURL=DrawerMatrix.js.map

package/dist/module/features/fluency-teacher/components/matrix/DrawerMatrix.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","StyleSheet","View","MatrixHeaderRow","MatrixRow","jsx","_jsx","jsxs","_jsxs","DrawerMatrix","grid","cellSize","fontSize","borderRadius","cellColorMap","onLayout","style","styles","container","children","colLabels","rows","map","row","label","cells","colorMap","create","flex","alignItems","justifyContent","gap"],"sourceRoot":"../../../../../../src","sources":["features/fluency-teacher/components/matrix/DrawerMatrix.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,UAAU,EAAEC,IAAI,QAAQ,cAAc;AAE/C,SAASC,eAAe,QAAQ,sBAAmB;AACnD,SAASC,SAAS,QAAQ,gBAAa;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAYvC,OAAO,MAAMC,YAAY,GAAGA,CAAC;EAC3BC,IAAI;EACJC,QAAQ;EACRC,QAAQ;EACRC,YAAY;EACZC,YAAY;EACZC;AACiB,CAAC,kBAClBT,IAAA,CAACJ,IAAI;EAACc,KAAK,EAAEC,MAAM,CAACC,SAAU;EAACH,QAAQ,EAAEA,QAAS;EAAAI,QAAA,EAC/CT,IAAI,IAAIC,QAAQ,GAAG,CAAC,iBACnBH,KAAA,CAACN,IAAI;IAACc,KAAK,EAAEC,MAAM,CAACP,IAAK;IAAAS,QAAA,gBACvBb,IAAA,CAACH,eAAe;MAACiB,SAAS,EAAEV,IAAI,CAACU,SAAU;MAACT,QAAQ,EAAEA,QAAS;MAACC,QAAQ,EAAEA;IAAS,CAAE,CAAC,EACrFF,IAAI,CAACW,IAAI,CAACC,GAAG,CAAEC,GAAG,iBACjBjB,IAAA,CAACF,SAAS;MAERoB,KAAK,EAAED,GAAG,CAACC,KAAM;MACjBC,KAAK,EAAEF,GAAG,CAACE,KAAM;MACjBd,QAAQ,EAAEA,QAAS;MACnBE,YAAY,EAAEA,YAAa;MAC3Ba,QAAQ,EAAEZ,YAAa;MACvBF,QAAQ,EAAEA;IAAS,GANdW,GAAG,CAACC,KAOV,CACF,CAAC;EAAA,CACE;AACP,CACG,CACP;AAED,MAAMP,MAAM,GAAGhB,UAAU,CAAC0B,MAAM,CAAC;EAC/BT,SAAS,EAAE;IACTU,IAAI,EAAE,CAAC;IACPC,UAAU,EAAE,QAAQ;IACpBC,cAAc,EAAE;EAClB,CAAC;EACDpB,IAAI,EAAE;IACJqB,GAAG,EAAE;EACP;AACF,CAAC,CAAC","ignoreList":[]}
+{"version":3,"names":["React","StyleSheet","Text","View","COLORS","FONT_FAMILY","MatrixHeaderRow","MatrixRow","jsx","_jsx","jsxs","_jsxs","DrawerMatrix","grid","cellSize","fontSize","borderRadius","cellColorMap","onLayout","style","styles","container","children","emptyText","colLabels","rows","map","row","label","cells","colorMap","create","flex","alignItems","justifyContent","gap","fontFamily","buenosAiresSemiBold","color","NEUTRAL_6","textAlign"],"sourceRoot":"../../../../../../src","sources":["features/fluency-teacher/components/matrix/DrawerMatrix.tsx"],"mappings":";;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,UAAU,EAAEC,IAAI,EAAEC,IAAI,QAAQ,cAAc;AAErD,SAASC,MAAM,EAAEC,WAAW,QAAQ,4BAA4B;AAChE,SAASC,eAAe,QAAQ,sBAAmB;AACnD,SAASC,SAAS,QAAQ,gBAAa;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAYvC,OAAO,MAAMC,YAAY,GAAGA,CAAC;EAC3BC,IAAI;EACJC,QAAQ;EACRC,QAAQ;EACRC,YAAY;EACZC,YAAY;EACZC;AACiB,CAAC,kBAClBT,IAAA,CAACN,IAAI;EAACgB,KAAK,EAAEC,MAAM,CAACC,SAAU;EAACH,QAAQ,EAAEA,QAAS;EAAAI,QAAA,EAC/C,CAACT,IAAI,gBACJJ,IAAA,CAACP,IAAI;IAACiB,KAAK,EAAEC,MAAM,CAACG,SAAU;IAAAD,QAAA,EAAC;EAAsB,CAAM,CAAC,GAE5DR,QAAQ,GAAG,CAAC,iBACVH,KAAA,CAACR,IAAI;IAACgB,KAAK,EAAEC,MAAM,CAACP,IAAK;IAAAS,QAAA,gBACvBb,IAAA,CAACH,eAAe;MAACkB,SAAS,EAAEX,IAAI,CAACW,SAAU;MAACV,QAAQ,EAAEA,QAAS;MAACC,QAAQ,EAAEA;IAAS,CAAE,CAAC,EACrFF,IAAI,CAACY,IAAI,CAACC,GAAG,CAAEC,GAAG,iBACjBlB,IAAA,CAACF,SAAS;MAERqB,KAAK,EAAED,GAAG,CAACC,KAAM;MACjBC,KAAK,EAAEF,GAAG,CAACE,KAAM;MACjBf,QAAQ,EAAEA,QAAS;MACnBE,YAAY,EAAEA,YAAa;MAC3Bc,QAAQ,EAAEb,YAAa;MACvBF,QAAQ,EAAEA;IAAS,GANdY,GAAG,CAACC,KAOV,CACF,CAAC;EAAA,CACE;AAET,CACG,CACP;AAED,MAAMR,MAAM,GAAGnB,UAAU,CAAC8B,MAAM,CAAC;EAC/BV,SAAS,EAAE;IACTW,IAAI,EAAE,CAAC;IACPC,UAAU,EAAE,QAAQ;IACpBC,cAAc,EAAE;EAClB,CAAC;EACDrB,IAAI,EAAE;IACJsB,GAAG,EAAE;EACP,CAAC;EACDZ,SAAS,EAAE;IACTa,UAAU,EAAE/B,WAAW,CAACgC,mBAAmB;IAC3CtB,QAAQ,EAAE,EAAE;IACZuB,KAAK,EAAElC,MAAM,CAACmC,SAAS;IACvBC,SAAS,EAAE;EACb;AACF,CAAC,CAAC","ignoreList":[]}

package/dist/typescript/commonjs/features/fluency-teacher/components/matrix/DrawerMatrix.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DrawerMatrix.d.ts","sourceRoot":"","sources":["../../../../../../../src/features/fluency-teacher/components/matrix/DrawerMatrix.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAA;AAGrD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAA;AAE3D,KAAK,iBAAiB,GAAG;IACvB,IAAI,EAAE,UAAU,GAAG,IAAI,CAAA;IACvB,QAAQ,EAAE,MAAM,CAAA;IAChB,QAAQ,EAAE,MAAM,CAAA;IAChB,YAAY,EAAE,MAAM,CAAA;IACpB,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACpC,QAAQ,EAAE,CAAC,CAAC,EAAE,iBAAiB,KAAK,IAAI,CAAA;CACzC,CAAA;AAED,eAAO,MAAM,YAAY,wEAOtB,iBAAiB,sBAmBnB,CAAA"}
+{"version":3,"file":"DrawerMatrix.d.ts","sourceRoot":"","sources":["../../../../../../../src/features/fluency-teacher/components/matrix/DrawerMatrix.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAA;AAIrD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAA;AAE3D,KAAK,iBAAiB,GAAG;IACvB,IAAI,EAAE,UAAU,GAAG,IAAI,CAAA;IACvB,QAAQ,EAAE,MAAM,CAAA;IAChB,QAAQ,EAAE,MAAM,CAAA;IAChB,YAAY,EAAE,MAAM,CAAA;IACpB,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACpC,QAAQ,EAAE,CAAC,CAAC,EAAE,iBAAiB,KAAK,IAAI,CAAA;CACzC,CAAA;AAED,eAAO,MAAM,YAAY,wEAOtB,iBAAiB,sBAuBnB,CAAA"}

package/dist/typescript/module/features/fluency-teacher/components/matrix/DrawerMatrix.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DrawerMatrix.d.ts","sourceRoot":"","sources":["../../../../../../../src/features/fluency-teacher/components/matrix/DrawerMatrix.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAA;AAGrD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAA;AAE3D,KAAK,iBAAiB,GAAG;IACvB,IAAI,EAAE,UAAU,GAAG,IAAI,CAAA;IACvB,QAAQ,EAAE,MAAM,CAAA;IAChB,QAAQ,EAAE,MAAM,CAAA;IAChB,YAAY,EAAE,MAAM,CAAA;IACpB,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACpC,QAAQ,EAAE,CAAC,CAAC,EAAE,iBAAiB,KAAK,IAAI,CAAA;CACzC,CAAA;AAED,eAAO,MAAM,YAAY,wEAOtB,iBAAiB,sBAmBnB,CAAA"}
+{"version":3,"file":"DrawerMatrix.d.ts","sourceRoot":"","sources":["../../../../../../../src/features/fluency-teacher/components/matrix/DrawerMatrix.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAA;AAIrD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAA;AAE3D,KAAK,iBAAiB,GAAG;IACvB,IAAI,EAAE,UAAU,GAAG,IAAI,CAAA;IACvB,QAAQ,EAAE,MAAM,CAAA;IAChB,QAAQ,EAAE,MAAM,CAAA;IAChB,YAAY,EAAE,MAAM,CAAA;IACpB,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAA;IACpC,QAAQ,EAAE,CAAC,CAAC,EAAE,iBAAiB,KAAK,IAAI,CAAA;CACzC,CAAA;AAED,eAAO,MAAM,YAAY,wEAOtB,iBAAiB,sBAuBnB,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@magmamath/students-features",
-  "version": "1.3.26-rc.14",
+  "version": "1.3.26-rc.15",
   "description": "Magmamath features library",
   "source": "src/index.ts",
   "main": "src/index.ts",

package/src/features/fluency-teacher/components/matrix/DrawerMatrix.tsx

@@ -1,6 +1,7 @@
 import React from 'react'
-import { StyleSheet, View } from 'react-native'
+import { StyleSheet, Text, View } from 'react-native'
 import type { LayoutChangeEvent } from 'react-native'
+import { COLORS, FONT_FAMILY } from '@magmamath/react-native-ui'
 import { MatrixHeaderRow } from './MatrixHeaderRow'
 import { MatrixRow } from './MatrixRow'
 import type { DrawerGrid } from '../../hooks/useDrawerGrid'
@@ -23,21 +24,25 @@ export const DrawerMatrix = ({
   onLayout,
 }: DrawerMatrixProps) => (
   <View style={styles.container} onLayout={onLayout}>
-    {grid && cellSize > 0 && (
-      <View style={styles.grid}>
-        <MatrixHeaderRow colLabels={grid.colLabels} cellSize={cellSize} fontSize={fontSize} />
-        {grid.rows.map((row) => (
-          <MatrixRow
-            key={row.label}
-            label={row.label}
-            cells={row.cells}
-            cellSize={cellSize}
-            borderRadius={borderRadius}
-            colorMap={cellColorMap}
-            fontSize={fontSize}
-          />
-        ))}
-      </View>
+    {!grid ? (
+      <Text style={styles.emptyText}>No facts practiced yet</Text>
+    ) : (
+      cellSize > 0 && (
+        <View style={styles.grid}>
+          <MatrixHeaderRow colLabels={grid.colLabels} cellSize={cellSize} fontSize={fontSize} />
+          {grid.rows.map((row) => (
+            <MatrixRow
+              key={row.label}
+              label={row.label}
+              cells={row.cells}
+              cellSize={cellSize}
+              borderRadius={borderRadius}
+              colorMap={cellColorMap}
+              fontSize={fontSize}
+            />
+          ))}
+        </View>
+      )
     )}
   </View>
 )
@@ -51,4 +56,10 @@ const styles = StyleSheet.create({
   grid: {
     gap: 2,
   },
+  emptyText: {
+    fontFamily: FONT_FAMILY.buenosAiresSemiBold,
+    fontSize: 13,
+    color: COLORS.NEUTRAL_6,
+    textAlign: 'center',
+  },
 })