@magmamath/students-features 0.9.0-rc20 → 0.9.0-rc22

package/src/features/endOfAssignment/types.ts

@@ -1,4 +1,5 @@
 import { EOAModel } from './model/model'
+import { ButtonColor } from '@magmamath/react-native-ui'
 
 export enum EOAEventType {
   SUBMIT = 'SUBMIT',
@@ -33,6 +34,7 @@ export type EOAModalContentProps = {
   textContent: EOAModalText
   model: EOAModel
   onPracticePress?: () => void
+  buttonColor?: ButtonColor
 }
 
 export type EOAModalData = {

package/src/features/exampleSolution/components/SolutionSection.tsx

@@ -108,5 +108,6 @@ const styles = StyleSheet.create({
     fontSize: 28,
     marginHorizontal: SPACING[800],
     marginVertical: SPACING[400],
+    lineHeight: 36,
   },
 })

package/src/features/feedback/components/TeacherFeedback.tsx

@@ -1,17 +1,18 @@
 import React from 'react'
 import { useStoreMap, useUnit } from 'effector-react'
 import { StyleSheet, View } from 'react-native'
-import { TeacherFeedbackButton } from './TeacherFeedbackButton/TeacherFeedbackButton'
+import { TeacherFeedbackButton } from './TeacherFeedbackButton'
 import { TeacherFeedbackComments } from './TeacherFeedbackComments/TeacherFeedbackComments'
-import { FeedbackButtonColors, FeedbackButtonSize, FeedbackMode } from '../constants'
+import { FeedbackButtonSize, FeedbackMode } from '../constants'
 import { TeacherFeedbackModel } from '../model/model'
+import { ButtonColor } from '@magmamath/react-native-ui'
 
 type TeacherFeedbackProps = {
   model: TeacherFeedbackModel
   mode: FeedbackMode
   assignmentId: string
   problemId: string
-  color?: FeedbackButtonColors
+  buttonColor?: ButtonColor
   size?: FeedbackButtonSize
   heightOffset?: number
 }
@@ -21,7 +22,7 @@ export const TeacherFeedback = ({
   mode,
   assignmentId,
   problemId,
-  color = FeedbackButtonColors.BLUE,
+  buttonColor = ButtonColor.BLUE,
   size = FeedbackButtonSize.SMALL,
   heightOffset = 0,
 }: TeacherFeedbackProps) => {
@@ -50,7 +51,7 @@ export const TeacherFeedback = ({
         isOpen={isOpen}
         isLoading={isLoading}
         size={size}
-        color={color}
+        buttonColor={buttonColor}
       />
     </View>
   )

package/src/features/feedback/components/{TeacherFeedbackButton/TeacherFeedbackButton.tsx → TeacherFeedbackButton.tsx}

@@ -1,48 +1,23 @@
 import React from 'react'
 import { StyleSheet, View } from 'react-native'
-import { Button, COLORS } from '@magmamath/react-native-ui'
-import { UnreadMessagesBadge } from '../UnreadMessagesBadge'
-import { MessageBubbleIcon } from '../../../../shared/icons/MessageBubbleIcon'
-import { XCloseIcon } from '../../../../shared/icons/XCloseIcon'
-import { COLOR_SCHEMES } from './colorSchemes'
-import {
-  FeedbackButtonColors,
-  FeedbackButtonSize,
-  TEACHER_FEEDBACK_BUTTON_ID,
-} from '../../constants'
+import { Button, ButtonColor, COLORS } from '@magmamath/react-native-ui'
+import { UnreadMessagesBadge } from './UnreadMessagesBadge'
+import { MessageBubbleIcon } from '../../../shared/icons/MessageBubbleIcon'
+import { XCloseIcon } from '../../../shared/icons/XCloseIcon'
+import { FeedbackButtonSize, TEACHER_FEEDBACK_BUTTON_ID } from '../constants'
 
 const ICON_SIZES = {
   [FeedbackButtonSize.LARGE]: 37,
   [FeedbackButtonSize.SMALL]: 26,
 }
 
-const COLOR_PRESETS = {
-  [FeedbackButtonColors.PURPLE]: {
-    borderColor: COLORS.PURPLE_6,
-    schemeColor: COLOR_SCHEMES.PURPLE,
-  },
-  [FeedbackButtonColors.BLUE]: {
-    borderColor: COLORS.BLUE_6,
-    schemeColor: COLOR_SCHEMES.BLUE,
-  },
-}
-
-const getVariantStyles = (isUnread: boolean, color: FeedbackButtonColors) => {
-  const { borderColor, schemeColor } = COLOR_PRESETS[color]
-  return {
-    iconColor: isUnread ? COLORS.NEUTRAL_1 : COLORS.NEUTRAL_9,
-    customColorScheme: isUnread ? schemeColor : COLOR_SCHEMES.GREY,
-    borderColor: isUnread ? borderColor : COLORS.NEUTRAL_5,
-  }
-}
-
 type TeacherFeedbackButtonProps = {
   isOpen: boolean
   isLoading: boolean
   onPress?: () => void
   unreadCommentsCount?: number
   size?: FeedbackButtonSize
-  color?: FeedbackButtonColors
+  buttonColor?: ButtonColor
 }
 
 export const TeacherFeedbackButton = ({
@@ -51,13 +26,11 @@ export const TeacherFeedbackButton = ({
   unreadCommentsCount,
   isLoading,
   size = FeedbackButtonSize.LARGE,
-  color = FeedbackButtonColors.BLUE,
+  buttonColor = ButtonColor.BLUE,
 }: TeacherFeedbackButtonProps) => {
   const isLarge = size === FeedbackButtonSize.LARGE
-  const { borderColor, iconColor, customColorScheme } = getVariantStyles(
-    !!unreadCommentsCount,
-    color,
-  )
+  const isUnread = !unreadCommentsCount
+  const iconColor = !isUnread ? COLORS.NEUTRAL_1 : COLORS.NEUTRAL_9
 
   if (isOpen) {
     return (
@@ -68,11 +41,11 @@ export const TeacherFeedbackButton = ({
         variant="primary"
         disabled={isLoading}
         isLoading={isLoading}
+        colorScheme={isUnread ? ButtonColor.WHITE : buttonColor}
         style={{
           container: isLarge ? styles.containerLarge : styles.container,
           button: [styles.button, { borderColor: COLORS.NEUTRAL_5 }, styles[size]],
         }}
-        customColorScheme={COLOR_SCHEMES.GREY}
         icon={<XCloseIcon size={ICON_SIZES[size]} />}
       />
     )
@@ -86,11 +59,11 @@ export const TeacherFeedbackButton = ({
       variant="primary"
       disabled={isLoading}
       isLoading={isLoading}
+      colorScheme={isUnread ? ButtonColor.WHITE : buttonColor}
       style={{
         container: isLarge ? styles.containerLarge : styles.container,
-        button: [styles.button, { borderColor }, styles[size]],
+        button: [styles.button, styles[size]],
       }}
-      customColorScheme={customColorScheme}
       icon={
         <View style={styles.iconContainer}>
           <MessageBubbleIcon color={iconColor} size={ICON_SIZES[size]} />

package/src/features/feedback/components/index.ts

@@ -1,5 +1,5 @@
 export { TeacherFeedbackComments } from './TeacherFeedbackComments/TeacherFeedbackComments'
-export { TeacherFeedbackButton } from './TeacherFeedbackButton/TeacherFeedbackButton'
+export { TeacherFeedbackButton } from './TeacherFeedbackButton'
 export { TeacherFeedback } from './TeacherFeedback'
 export { UnreadMessagesBadge } from './UnreadMessagesBadge'
 export { ListCardCommentsCount } from './ListCardCommentsCount'

package/src/features/feedback/constants.ts

@@ -7,11 +7,6 @@ export const BUENOS_AIRES_FONT =
 export const EMPTY_COMMENT_ID = 'empty-comment'
 export const TEACHER_FEEDBACK_BUTTON_ID = 'teacherFeedbackButton'
 
-export enum FeedbackButtonColors {
-  BLUE = 'BLUE',
-  PURPLE = 'PURPLE',
-}
-
 export enum FeedbackButtonSize {
   SMALL = 'SMALL',
   LARGE = 'LARGE',

package/src/features/keyboard/components/AlgebraLayout/AlgebraLayout.tsx

@@ -3,15 +3,11 @@ import { KeysList } from '../KeysList/KeysList'
 import { StyleSheet, useWindowDimensions, View } from 'react-native'
 import { COLORS, SelectGroup, SelectOptionSize, IS_MOBILE } from '@magmamath/react-native-ui'
 import { Locale, useText } from '../../../../shared/translation'
-import { KEYBOARD_GROUPS_BY_LOCALE } from '../../constants/keysValues'
 import { KeyboardLayoutProps, KeyboardType } from '../../types/types'
 import { MOBILE_LAYOUT_WIDTH } from '../../constants/constants'
 import { useLayoutOptions } from './useLayoutOptions'
-
-enum SelectedLayout {
-  BASIC = 'basic',
-  ALGEBRA = 'algebra',
-}
+import { SelectedLayout } from './types'
+import { getKeyboardGroup } from '../../helpers'
 
 export const AlgebraLayout = (props: KeyboardLayoutProps) => {
   const [selectedLayout, setSelectedLayout] = useState<SelectedLayout>(SelectedLayout.BASIC)
@@ -22,10 +18,11 @@ export const AlgebraLayout = (props: KeyboardLayoutProps) => {
   const locale = t('locale') as Locale
 
   const keyboardGroups = useMemo(() => {
-    const algebra = KEYBOARD_GROUPS_BY_LOCALE[locale][KeyboardType.AlgebraAdvanced]
-    const basic = isDesktop
-      ? KEYBOARD_GROUPS_BY_LOCALE[locale][KeyboardType.BasicPlusPlus]
-      : KEYBOARD_GROUPS_BY_LOCALE[locale][KeyboardType.BasicPlusPlusMobile]
+    const algebra = getKeyboardGroup(locale, KeyboardType.AlgebraAdvanced)
+    const basic = getKeyboardGroup(
+      locale,
+      isDesktop ? KeyboardType.BasicPlusPlus : KeyboardType.BasicPlusPlusMobile,
+    )
 
     return new Map([
       [SelectedLayout.BASIC, basic],

package/src/features/keyboard/components/AlgebraLayout/types.ts

@@ -0,0 +1,4 @@
+export enum SelectedLayout {
+  BASIC = 'basic',
+  ALGEBRA = 'algebra',
+}

package/src/features/keyboard/components/AlgebraLayout/useLayoutOptions.tsx

@@ -2,13 +2,9 @@ import React, { ReactNode, useMemo } from 'react'
 import { COLORS } from '@magmamath/react-native-ui'
 import { AlgebraIcon } from '../../../../shared/icons/AlgebraIcon'
 import { IntegralABIcon } from '../../../../shared/icons/MATH/IntegralABIcon/IntegralABIcon'
+import { SelectedLayout } from './types'
 
-export enum SelectedLayout {
-  BASIC = 'basic',
-  ALGEBRA = 'algebra',
-}
-
-interface LayoutOption {
+type LayoutOption = {
   key: SelectedLayout
   title: ReactNode
   onPressIn: () => void

package/src/features/keyboard/components/BasicLayout/BasicLayout.tsx

@@ -4,7 +4,7 @@ import { StyleSheet, useWindowDimensions, View } from 'react-native'
 import { KeyboardLayoutProps, KeyboardType } from '../../types/types'
 import { MOBILE_LAYOUT_WIDTH } from '../../constants/constants'
 import { Locale, useText } from '../../../../shared/translation'
-import { KEYBOARD_GROUPS_BY_LOCALE } from '../../constants/keysValues'
+import { KEYBOARD_GROUPS_BY_LOCALE } from '../../constants/keyboardGroupsByLocale'
 
 export const BasicLayout = (props: KeyboardLayoutProps & PropsWithChildren) => {
   const t = useText()

package/src/features/keyboard/components/BasicLayout/CurrencyBasicLayout.tsx

@@ -3,11 +3,11 @@ import { KeysList } from '../KeysList/KeysList'
 import { BasicLayout } from './BasicLayout'
 import { KeyboardLayoutProps, KeyboardType } from '../../types/types'
 import { Locale, useText } from '../../../../shared/translation'
-import { KEYBOARD_GROUPS_BY_LOCALE } from '../../constants/keysValues'
+import { getKeyboardGroup } from '../../helpers'
 
 export const CurrencyBasicLayout = (props: KeyboardLayoutProps) => {
   const t = useText()
-  const keysGroup = KEYBOARD_GROUPS_BY_LOCALE[t('locale') as Locale][KeyboardType.BasicCurrency]
+  const keysGroup = getKeyboardGroup(t('locale') as Locale, KeyboardType.BasicCurrency)
 
   return (
     <BasicLayout {...props}>

package/src/features/keyboard/components/BasicLayout/TimeBasicLayout.tsx

@@ -4,11 +4,11 @@ import { StyleSheet } from 'react-native'
 import { BasicLayout } from './BasicLayout'
 import { KeyboardLayoutProps, KeyboardType } from '../../types/types'
 import { useText, Locale } from '../../../../shared/translation'
-import { KEYBOARD_GROUPS_BY_LOCALE } from '../../constants/keysValues'
+import { getKeyboardGroup } from '../../helpers'
 
 export const TimeBasicLayout = (props: KeyboardLayoutProps) => {
   const t = useText()
-  const keysGroup = KEYBOARD_GROUPS_BY_LOCALE[t('locale') as Locale][KeyboardType.BasicTime]
+  const keysGroup = getKeyboardGroup(t('locale') as Locale, KeyboardType.BasicTime)
 
   return (
     <BasicLayout {...props}>

package/src/features/keyboard/components/BasicPlusLayout/BasicPlusLayout.tsx

@@ -3,15 +3,18 @@ import { KeysList } from '../KeysList/KeysList'
 import { StyleSheet, useWindowDimensions, View } from 'react-native'
 import { KeyboardLayoutProps, KeyboardType } from '../../types/types'
 import { Locale, useText } from '../../../../shared/translation'
-import { KEYBOARD_GROUPS_BY_LOCALE } from '../../constants/keysValues'
+import { MOBILE_LAYOUT_WIDTH } from '../../constants/constants'
+import { getKeyboardGroup } from '../../helpers'
 
 export const BasicPlusLayout = (props: KeyboardLayoutProps) => {
   const t = useText()
   const { width } = useWindowDimensions()
-  const keysGroup =
-    width > 1180
-      ? KEYBOARD_GROUPS_BY_LOCALE[t('locale') as Locale][KeyboardType.BasicPlus]
-      : KEYBOARD_GROUPS_BY_LOCALE[t('locale') as Locale][KeyboardType.BasicPlusMobile]
+  const locale = t('locale') as Locale
+  const isDesktop = width > MOBILE_LAYOUT_WIDTH
+  const keysGroup = getKeyboardGroup(
+    locale,
+    isDesktop ? KeyboardType.BasicPlus : KeyboardType.BasicPlusMobile,
+  )
 
   return (
     <View style={styles.container}>
@@ -27,18 +30,4 @@ const styles = StyleSheet.create({
     gap: 16,
     paddingRight: 16,
   },
-  keysContainer: {
-    gap: 10,
-  },
-  option: {
-    width: 40,
-  },
-  optionContainer: {
-    flexGrow: 0,
-    flexBasis: 'auto',
-  },
-  text: {
-    fontStyle: 'italic',
-    fontWeight: 700,
-  },
 })

package/src/features/keyboard/components/BasicPlusPlusLayout/BasicPlusPlusLayout.tsx

@@ -3,15 +3,18 @@ import { StyleSheet, useWindowDimensions, View } from 'react-native'
 import { KeysList } from '../KeysList/KeysList'
 import { KeyboardLayoutProps, KeyboardType } from '../../types/types'
 import { Locale, useText } from '../../../../shared/translation'
-import { KEYBOARD_GROUPS_BY_LOCALE } from '../../constants/keysValues'
+import { MOBILE_LAYOUT_WIDTH } from '../../constants/constants'
+import { getKeyboardGroup } from '../../helpers'
 
 export const BasicPlusPlusLayout = (props: KeyboardLayoutProps) => {
   const t = useText()
   const { width } = useWindowDimensions()
-  const keysGroup =
-    width > 1180
-      ? KEYBOARD_GROUPS_BY_LOCALE[t('locale') as Locale][KeyboardType.BasicPlusPlus]
-      : KEYBOARD_GROUPS_BY_LOCALE[t('locale') as Locale][KeyboardType.BasicPlusPlusMobile]
+  const locale = t('locale') as Locale
+  const isDesktop = width > MOBILE_LAYOUT_WIDTH
+  const keysGroup = getKeyboardGroup(
+    locale,
+    isDesktop ? KeyboardType.BasicPlusPlus : KeyboardType.BasicPlusPlusMobile,
+  )
 
   return (
     <View style={styles.container}>

package/src/features/keyboard/components/Keyboard.tsx

@@ -11,36 +11,37 @@ type KeyboardProps = {
   characterType?: number
   style?: StyleProp<ViewStyle>
   color?: SelectOptionColor
-  visible?: boolean
-  isSpecialButtonsDisabled?: boolean
+  isVisible?: boolean
   isDisabled?: boolean
   disabledKeys?: KeyboardKey[]
 }
 
-export const Keyboard = ({ style, characterType, visible = true, ...props }: KeyboardProps) => {
+export const Keyboard = ({ style, characterType, isVisible = true, ...props }: KeyboardProps) => {
   const slideAnim = useRef(new Animated.Value(600)).current
   const { width } = useWindowDimensions()
+  const isMobile = width <= MOBILE_LAYOUT_WIDTH
+
   const Layout = useMemo(() => getLayoutByCharType(characterType), [characterType])
   const isBasicMobileLayout =
     characterType &&
-    width <= MOBILE_LAYOUT_WIDTH &&
+    isMobile &&
     KEYBOARD_LAYOUTS[KeyboardType.Basic].characterTypes.includes(characterType)
   const isAlgebraMobileLayout =
     characterType &&
-    width <= MOBILE_LAYOUT_WIDTH &&
+    isMobile &&
     (KEYBOARD_LAYOUTS[KeyboardType.AlgebraAdvanced].characterTypes.includes(characterType) ||
       KEYBOARD_LAYOUTS[KeyboardType.BasicPlus].characterTypes.includes(characterType))
 
   useEffect(() => {
     Animated.spring(slideAnim, {
-      toValue: visible ? 0 : 600,
-      stiffness: visible ? 320 : 720,
-      damping: visible ? 40 : 60,
+      toValue: isVisible ? 0 : 600,
+      stiffness: isVisible ? 320 : 720,
+      damping: isVisible ? 40 : 60,
       mass: 1,
       velocity: 0,
       useNativeDriver: true,
     }).start()
-  }, [visible])
+  }, [isVisible])
 
   return (
     <Animated.View

package/src/features/keyboard/components/KeysList/KeysList.tsx

@@ -25,7 +25,6 @@ export const KeysList = ({
   numOfRows,
   style,
   onKeyPress,
-  isSpecialButtonsDisabled,
   isDisabled,
   disabledKeys,
 }: KeysListProps) => {
@@ -35,12 +34,11 @@ export const KeysList = ({
         mapKeyToOption({
           key,
           onKeyPress,
-          isSpecialButtonsDisabled,
           disabledKeys,
           optionStyle: style?.option,
         }),
       ),
-    [keys, onKeyPress, isSpecialButtonsDisabled, disabledKeys, style?.option],
+    [keys, onKeyPress, disabledKeys, style?.option],
   )
 
   return (

package/src/features/keyboard/components/KeysList/helpers.ts

@@ -3,12 +3,10 @@ import { KeyboardKey, KeyboardKeyValue } from '../../types/types'
 import { ButtonStyle } from '@magmamath/react-native-ui'
 import { styles } from './KeysList'
 import { getIsIpadOrIphoneDevice } from '../../helpers'
-import { DISABLED_KEYS } from '../../constants/spreadsheetDisabledKeys'
 
 type MapKeyToOptionProps = {
   key: KeyboardKey
   onKeyPress?: (key: KeyboardKeyValue) => void
-  isSpecialButtonsDisabled?: boolean
   disabledKeys?: KeyboardKey[]
   optionStyle?: ButtonStyle
 }
@@ -21,16 +19,12 @@ const mergeOptionStyles = (keyStyle?: ButtonStyle, override?: ButtonStyle) => ({
   text: [styles.optionText, keyStyle?.text, override?.text],
 })
 
-const isKeyDisabled = (
-  key: KeyboardKey,
-  isSpecialButtonsDisabled?: boolean,
-  disabledKeys?: KeyboardKey[],
-) => (isSpecialButtonsDisabled && DISABLED_KEYS.includes(key)) || disabledKeys?.includes(key)
+const isKeyDisabled = (key: KeyboardKey, disabledKeys?: KeyboardKey[]) =>
+  disabledKeys?.includes(key)
 
 export const mapKeyToOption = ({
   key,
   onKeyPress,
-  isSpecialButtonsDisabled,
   disabledKeys,
   optionStyle,
 }: MapKeyToOptionProps) => {
@@ -50,6 +44,6 @@ export const mapKeyToOption = ({
     delayPressIn: 0,
     style: mergeOptionStyles(key.style, optionStyle),
     ...(IS_IOS_WEB ? { onPress: pressHandler } : { onPressIn: pressHandler }),
-    disabled: isKeyDisabled(key, isSpecialButtonsDisabled, disabledKeys),
+    disabled: isKeyDisabled(key, disabledKeys),
   }
 }

package/src/features/keyboard/components/UnitsLayout/UnitTabs.tsx

@@ -16,7 +16,7 @@ export const UnitTabs = ({ activeTab, tabs, onTabChange, ...props }: UnitTabsPro
   const keyboardGroups = useTabKeys(activeTab.key as KeyboardUnitsGroupType)
 
   return (
-    <View style={{ width: 283 }}>
+    <View style={styles.container}>
       <View style={styles.tabsContainer}>
         <TabGroup
           activeTab={activeTab}
@@ -45,6 +45,9 @@ export const UnitTabs = ({ activeTab, tabs, onTabChange, ...props }: UnitTabsPro
 }
 
 const styles = StyleSheet.create({
+  container: {
+    width: 283,
+  },
   tabsContainer: {
     gap: 16,
     flex: 1,

package/src/features/keyboard/components/UnitsLayout/UnitsLayout.tsx

@@ -6,24 +6,21 @@ import { Locale, useText } from '../../../../shared/translation'
 import { UnitTabs } from './UnitTabs'
 import { KeyboardLayoutProps, KeyboardType } from '../../types/types'
 import { KeyboardUnitsGroupType } from './keyboardGroups'
-import { KEYBOARD_GROUPS_BY_LOCALE } from '../../constants/keysValues'
 import { MOBILE_LAYOUT_WIDTH } from '../../constants/constants'
 import { useLayoutSelectOptions } from './hooks/useLayoutSelectOptions'
 import { useUnitTabs } from './hooks/useUnitTabs'
-
-enum SelectedLayout {
-  ALGEBRA = 'algebra',
-  UNITS = 'units',
-}
+import { getKeyboardGroup } from '../../helpers'
+import { SelectedLayout } from './types'
 
 export const UnitsLayout = (props: KeyboardLayoutProps) => {
   const { width } = useWindowDimensions()
+  const t = useText()
+  const locale = t('locale') as Locale
   const isDesktop = width > MOBILE_LAYOUT_WIDTH
   const [selectedLayout, setSelectedLayout] = useState<SelectedLayout>(
     isDesktop ? SelectedLayout.ALGEBRA : SelectedLayout.UNITS,
   )
-  const t = useText()
-  const basicPlusKeys = KEYBOARD_GROUPS_BY_LOCALE[t('locale') as Locale][KeyboardType.BasicPlus]
+  const basicPlusKeys = getKeyboardGroup(locale, KeyboardType.BasicPlus)
   const tabs = useUnitTabs()
   const [activeTab, setActiveTab] = useState(tabs[0])
   const selectOptions = useLayoutSelectOptions({

package/src/features/keyboard/components/UnitsLayout/hooks/useLayoutSelectOptions.tsx

@@ -4,13 +4,9 @@ import { AlgebraIcon } from '../../../../../shared/icons/AlgebraIcon'
 import { UNITS_KEYBOARD_GROUPS } from '../constants'
 import { KeyboardUnitsGroupType } from '../keyboardGroups'
 import React from 'react'
+import { SelectedLayout } from '../types'
 
-export enum SelectedLayout {
-  ALGEBRA = 'algebra',
-  UNITS = 'units',
-}
-
-interface UseLayoutSelectOptionsProps {
+type UseLayoutSelectOptionsProps = {
   activeTabKey: KeyboardUnitsGroupType
   selectedLayout: SelectedLayout
   setSelectedLayout: (layout: SelectedLayout) => void

package/src/features/keyboard/components/UnitsLayout/types.ts

@@ -0,0 +1,4 @@
+export enum SelectedLayout {
+  ALGEBRA = 'algebra',
+  UNITS = 'units',
+}

package/src/features/keyboard/constants/{keysValues.ts → keyboardGroupsByLocale.ts}

@@ -7,8 +7,7 @@ import {
   MATH_ENTRY_BASIC_SW_KEYBOARD_GROUP,
   MATH_TIME_SW_KEYBOARD_GROUP,
   MATH_TIME_US_KEYBOARD_GROUP,
-} from '../components/BasicLayout/keyboardGroup'
-import { MATH_ENTRY_ALGEBRA_KEYBOARD_GROUP } from '../components/AlgebraLayout/keyboardGroups'
+} from '../components/BasicLayout/keyboardGroups'
 import {
   MATH_ENTRY_BASIC_PLUS_MOBILE,
   MATH_ENTRY_BASIC_PLUS_MOBILE_SW,
@@ -27,6 +26,7 @@ import {
 } from '../components/Numpad/keyboardGroups'
 import { MATH_ENTRY_LENGTH_UNITS_US_KEYBOARD_GROUPS } from '../components/UnitsLayout/keyboardGroups'
 import { Locale } from '../../../shared/translation'
+import { MATH_ENTRY_ALGEBRA_KEYBOARD_GROUP } from '../components/AlgebraLayout/keyboardGroups'
 
 export const KEYBOARD_GROUPS_BY_LOCALE: Record<Locale, Record<KeyboardType, KeyboardGroup>> = {
   [Locale.CA]: {

package/src/features/keyboard/helpers.ts

@@ -1,4 +1,4 @@
-import { KEYBOARD_GROUPS_BY_LOCALE } from './constants/keysValues'
+import { KEYBOARD_GROUPS_BY_LOCALE } from './constants/keyboardGroupsByLocale'
 import { KeyboardGroup, KeyboardType } from './types/types'
 import { Locale } from '../../shared/translation/types'
 import { MATH_ENTRY_ALGEBRA_KEYBOARD_GROUP } from './components/AlgebraLayout/keyboardGroups'

package/src/features/keyboard/index.ts

@@ -1,3 +1,2 @@
-export * from './types/types'
+export * from './types'
 export { Keyboard } from './components/Keyboard'
-export * from './types/MathKeysGroups'

package/src/features/keyboard/types/index.ts

@@ -0,0 +1,2 @@
+export * from './types'
+export * from './MathKeysGroups'

package/src/features/keyboard/types/types.ts

@@ -43,7 +43,6 @@ export type KeyboardGroup = {
 export type KeyboardLayoutProps = {
   onKeyPress: (key: KeyboardKeyValue) => void
   color?: SelectOptionColor
-  isSpecialButtonsDisabled?: boolean
   isDisabled?: boolean
   disabledKeys?: KeyboardKey[]
 }

package/src/features/problemSelector/constants.ts

@@ -15,6 +15,8 @@ export const PROBLEM_SELECTOR_BUTTON_STATE = {
   NOT_SOLVED: 'not-solved',
   MISTAKE: 'mistake',
   EXAM: 'exam',
+  ASSESSMENT: 'assessment',
+  SELECTED_ASSESSMENT: 'selected-assessment',
 } as const
 
 const colorPreset = (bg: string, border: string, color: string, raise: string = border) => ({
@@ -104,4 +106,34 @@ export const COLOR_SCHEME_MAP: Record<ProblemSelectorButtonState, ButtonColorPre
     ),
     [ButtonStates.DISABLED]: colorPreset(COLORS.PURPLE_3, COLORS.PURPLE_3, COLORS.NEUTRAL_1),
   },
+  [PROBLEM_SELECTOR_BUTTON_STATE.SELECTED_ASSESSMENT]: {
+    [ButtonStates.DEFAULT]: colorPreset(
+      COLORS.ORANGE_1,
+      COLORS.PRIMARY_ORANGE,
+      COLORS.PRIMARY_ORANGE,
+    ),
+    [ButtonStates.HOVER]: colorPreset(COLORS.ORANGE_1, COLORS.ORANGE_4, COLORS.ORANGE_4),
+    [ButtonStates.ACTIVE]: colorPreset(COLORS.ORANGE_1, COLORS.ORANGE_4, COLORS.ORANGE_4),
+    [ButtonStates.PRESSED]: colorPreset(COLORS.ORANGE_1, COLORS.ORANGE_4, COLORS.ORANGE_4),
+    [ButtonStates.DISABLED]: colorPreset(COLORS.ORANGE_1, COLORS.ORANGE_3, COLORS.ORANGE_3),
+  },
+  [PROBLEM_SELECTOR_BUTTON_STATE.ASSESSMENT]: {
+    [ButtonStates.DEFAULT]: colorPreset(
+      COLORS.PRIMARY_ORANGE,
+      COLORS.PRIMARY_ORANGE,
+      COLORS.NEUTRAL_1,
+    ),
+    [ButtonStates.HOVER]: colorPreset(COLORS.ORANGE_4, COLORS.ORANGE_4, COLORS.NEUTRAL_1),
+    [ButtonStates.ACTIVE]: colorPreset(
+      COLORS.PRIMARY_ORANGE,
+      COLORS.PRIMARY_ORANGE,
+      COLORS.NEUTRAL_1,
+    ),
+    [ButtonStates.PRESSED]: colorPreset(
+      COLORS.PRIMARY_ORANGE,
+      COLORS.PRIMARY_ORANGE,
+      COLORS.NEUTRAL_1,
+    ),
+    [ButtonStates.DISABLED]: colorPreset(COLORS.ORANGE_3, COLORS.ORANGE_3, COLORS.NEUTRAL_1),
+  },
 }

package/src/shared/icons/MATH/BackspaceIcon/BackspaceIcon.tsx

@@ -5,7 +5,7 @@ import Svg, { G, Path } from 'react-native-svg'
 export const BackspaceIcon = ({ size = 20, color }: IconProps) => {
   return (
     <Svg width={size} height={size} viewBox="0 0 21 21" fill="none">
-      <G clip-path="url(#clip0_1683_234)">
+      <G clipPath="url(#clip0_1683_234)">
         <Path
           d="M17.8252 2.7644H7.23593C6.80314 2.7644 6.39561 2.96817 6.13593 3.3144L1.54218 9.4394C1.17551 9.92829 1.17551 10.6005 1.54218 11.0894L6.13593 17.2144C6.39561 17.5606 6.80314 17.7644 7.23593 17.7644H17.8252C18.5846 17.7644 19.2002 17.1488 19.2002 16.3894V4.1394C19.2002 3.38001 18.5846 2.7644 17.8252 2.7644Z"
           stroke={color}

package/dist/commonjs/features/feedback/components/TeacherFeedbackButton/TeacherFeedbackButton.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_reactNative","_reactNativeUi","_UnreadMessagesBadge","_MessageBubbleIcon","_XCloseIcon","_colorSchemes","_constants","_jsxRuntime","e","__esModule","default","ICON_SIZES","FeedbackButtonSize","LARGE","SMALL","COLOR_PRESETS","FeedbackButtonColors","PURPLE","borderColor","COLORS","PURPLE_6","schemeColor","COLOR_SCHEMES","BLUE","BLUE_6","getVariantStyles","isUnread","color","iconColor","NEUTRAL_1","NEUTRAL_9","customColorScheme","GREY","NEUTRAL_5","TeacherFeedbackButton","isOpen","onPress","unreadCommentsCount","isLoading","size","isLarge","jsx","Button","id","TEACHER_FEEDBACK_BUTTON_ID","variant","disabled","style","container","styles","containerLarge","button","icon","XCloseIcon","jsxs","View","iconContainer","children","MessageBubbleIcon","badgeContainerLarge","badgeContainer","UnreadMessagesBadge","badgeContent","textStyle","textLarge","badgeLarge","exports","StyleSheet","create","width","height","borderWidth","buttonLarge","position","top","right","fontSize","lineHeight","textAlign","alignItems","justifyContent","borderRadius"],"sourceRoot":"../../../../../../src","sources":["features/feedback/components/TeacherFeedbackButton/TeacherFeedbackButton.tsx"],"mappings":"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","ignoreList":[]}