@magmamath/students-features 0.10.0-rc.7 → 0.10.0

package/src/features/chatbot/types/model.types.ts

@@ -2,7 +2,8 @@ import type { Store, StoreWritable } from 'effector'
 import {
   ChatHintPayload,
   ChatHintResponse,
-  ChatHistory,
+  ErrorSpottingPayload,
+  ErrorSpottingResponse,
   GetAlternativesPayload,
   GetAlternativesResponse,
   GoogleText2SpeechPayload,
@@ -11,14 +12,12 @@ import {
   GoogleTranslateResponse,
   PostMessagePayload,
   PostMessageResponse,
-  ProblemStandard,
   SendMessagePayload,
   SendMessageResponse,
 } from './api.types'
 import { ExtendWithOptional } from '../../../lib/helpers/types'
 import { ChatAnswer, ChatItem, ConversationMessage, FullStrokeData } from './units.types'
 import { WithAbortSignal } from '../../../lib/types/requests'
-import { RequestOptionalConfig } from '../../../lib/effector/createControllerEffect'
 
 export type ChatbotMessages = {
   error: ConversationMessage
@@ -29,20 +28,18 @@ export type ChatbotMessages = {
 
 export type ChatbotApiRequests = {
   getAlternatives: (props: GetAlternativesPayload) => Promise<GetAlternativesResponse>
-  sendMessage: (
-    props: WithAbortSignal<SendMessagePayload>,
-    requestConfig?: RequestOptionalConfig,
-  ) => Promise<SendMessageResponse>
-  postMessage: (
-    props: WithAbortSignal<PostMessagePayload>,
-    requestConfig?: RequestOptionalConfig,
-  ) => Promise<PostMessageResponse>
+  sendMessage: (props: WithAbortSignal<SendMessagePayload>) => Promise<SendMessageResponse>
+  postMessage: (props: WithAbortSignal<PostMessagePayload>) => Promise<PostMessageResponse>
   postTranslateText: (
     props: WithAbortSignal<GoogleTranslatePayload>,
   ) => Promise<GoogleTranslateResponse>
   postTextToSpeech: (
     props: WithAbortSignal<GoogleText2SpeechPayload>,
   ) => Promise<GoogleText2SpeechResponse>
+  /**
+   * @deprecated merged with hint
+   */
+  spotError?: (props: ErrorSpottingPayload) => Promise<ErrorSpottingResponse>
 }
 
 type ChatbotSettings = {
@@ -52,10 +49,7 @@ type ChatbotSettings = {
 export type ChatbotModelProps = {
   $key?: Store<string>
   api: Omit<ChatbotApiRequests, 'postMessage'> & {
-    requestHint: (
-      props: ChatHintPayload,
-      requestConfig?: RequestOptionalConfig,
-    ) => Promise<ChatHintResponse>
+    requestHint: (props: ChatHintPayload) => Promise<ChatHintResponse>
   }
   threadMessagesLimit?: number
   chatAccess: StoreWritable<boolean>
@@ -72,7 +66,6 @@ export type SendHelpProps = SendHelpParams & {
   key: string
   context: ChatbotContext | null
   cache: Record<string, ChatItem>
-  alternatives?: GetAlternativesResponse | null
   isFreeText?: boolean
 }
 
@@ -82,7 +75,6 @@ export type SetHintMessageProps = {
 
 export type StartConversationProps = {
   initOnly?: boolean
-  withGreetingMessage?: boolean
 }
 
 export type StartConversationFxData = {
@@ -126,17 +118,13 @@ export type IChatDrawBoardAdapter = {
 
 export type ChatbotContext = {
   language: string
-  problemDescription: string
+  problem: string
   problemAnswer: string[]
-  translationTargetLanguage: string
-  assignmentId?: string
   answer?: string | string[]
   answerOptions?: string[]
+  translationTargetLanguage: string
   imageDescription?: string
   imageCdnId?: string
-  chatHistory?: ChatHistory
-  problemId?: string
-  problemStandards?: ProblemStandard[]
 }
 
 export type ReinitConversationProps = {
@@ -150,7 +138,7 @@ export enum ChatRequestType {
 
 type FreeTextWithConversationId = {
   type: ChatRequestType.FREETEXT
-  data: Pick<SendMessagePayload, 'message' | 'conversationId' | 'chatHistory'>
+  data: Pick<SendMessagePayload, 'message' | 'conversationId'>
 }
 
 type FreeTextNewConversation = {

package/src/features/chatbot/types/t2s.types.ts

@@ -1,10 +1,4 @@
-import React from 'react'
-import { ColorScheme } from './style.types'
 import { ConversationMessage } from './units.types'
-import { ChatbotAPI } from '../model/ChatbotApi'
-import { ChatTTSHighlightModel } from '../model/ChatTTSHighlightModel'
-import { AUDIO_CONFIG, DEFAULT_VOICE } from '../constants'
-import { Timepoint } from './api.types'
 
 export enum AudioStatus {
   PLAYING = 'playing',
@@ -12,24 +6,13 @@ export enum AudioStatus {
   PAUSED = 'paused',
 }
 
-export type OnTimeUpdate = (callback: ((time: number) => void) | null) => void
-
 export type AudioProvider = {
   play: (audioPath: string, onPlaybackComplete: () => void) => Promise<void>
   pause: () => void
   resume: () => void
   stop: () => void
-  onTimeUpdate?: OnTimeUpdate
-}
-
-export type TTSHighlightRendererProps = {
-  text: string
-  highlightedIndex: number
-  colorScheme?: ColorScheme
 }
 
-export type TTSHighlightRenderer = React.ComponentType<TTSHighlightRendererProps>
-
 export type PlayTextToSpeechProps = {
   message: ConversationMessage
   isTranslated: boolean
@@ -42,19 +25,3 @@ export type T2SState = {
   isLoading: boolean
   isEnabled: boolean
 }
-
-export type T2SConfig = {
-  audioProvider?: AudioProvider
-  textSanitizer?: (speech: string) => string
-  isWordHighlightEnabled?: boolean
-}
-
-export type AudioConfig = {
-  voice?: typeof DEFAULT_VOICE
-  audioConfig?: typeof AUDIO_CONFIG
-}
-
-export type AudioCache = {
-  audioPath: string
-  timepoints: Timepoint[]
-}

package/src/features/feedback/model/model.ts

@@ -11,10 +11,7 @@ export type TeacherFeedbackModelProps = {
     getComments: (props: GetCommentsPayload) => Promise<GetCommentsResponse>
     updateCommentStatusSeen: (props: UpdateCommentStatusSeenPayload) => Promise<void>
   }
-  /**
-   * @deprecated - use socket and events directly in the client
-   */
-  socket?: any
+  socket: any
   credits: {
     $assignmentId: Store<string>
     $problemId: Store<string>

package/src/features/feedback/model/sockets.ts

@@ -2,23 +2,21 @@ import { createEvent } from 'effector'
 import { TeacherComment, FeedbackSocketEvents } from '../types'
 
 export class TeacherFeedbackSockets {
-  private readonly socket: any = null
+  private readonly socket: any
   public readonly commentAdded = createEvent<TeacherComment>()
   public readonly commentDeleted = createEvent<TeacherComment>()
 
   constructor(socket: any) {
-    if (socket) {
-      this.socket = socket
-    }
+    this.socket = socket
   }
 
   connect() {
-    this.socket?.on(FeedbackSocketEvents.COMMENT_ADDED, this.commentAdded)
-    this.socket?.on(FeedbackSocketEvents.COMMENT_DELETED, this.commentDeleted)
+    this.socket.on(FeedbackSocketEvents.COMMENT_ADDED, this.commentAdded)
+    this.socket.on(FeedbackSocketEvents.COMMENT_DELETED, this.commentDeleted)
   }
 
   off() {
-    this.socket?.off(FeedbackSocketEvents.COMMENT_ADDED, this.commentAdded)
-    this.socket?.off(FeedbackSocketEvents.COMMENT_DELETED, this.commentDeleted)
+    this.socket.off(FeedbackSocketEvents.COMMENT_ADDED, this.commentAdded)
+    this.socket.off(FeedbackSocketEvents.COMMENT_DELETED, this.commentDeleted)
   }
 }

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

@@ -1,21 +1,20 @@
 import React, { useMemo, useState } from 'react'
 import { KeysList } from '../KeysList/KeysList'
 import { StyleSheet, useWindowDimensions, View } from 'react-native'
-import { COLORS, IS_MOBILE, SelectGroup, SelectOptionSize } from '@magmamath/react-native-ui'
+import { COLORS, SelectGroup, SelectOptionSize, IS_MOBILE } from '@magmamath/react-native-ui'
 import { Locale, useText } from '../../../../shared/translation'
 import { KeyboardLayoutProps, KeyboardType } from '../../types/types'
+import { MOBILE_LAYOUT_WIDTH } from '../../constants/constants'
 import { SelectedLayout } from './types'
 import { getKeyboardGroup } from '../../helpers'
 import { getSelectOptions } from './helpers'
-import { KEYBOARD_LAYOUTS } from '../../constants/keyboardLayouts'
 
 export const AlgebraLayout = ({ onLayoutChange, ...props }: KeyboardLayoutProps) => {
   const [selectedLayout, setSelectedLayout] = useState<SelectedLayout>(SelectedLayout.BASIC)
   const t = useText()
   const { width } = useWindowDimensions()
   const selectOptions = getSelectOptions({ selectedLayout, setSelectedLayout, onLayoutChange })
-  const isDesktop =
-    width > KEYBOARD_LAYOUTS[KeyboardType.AlgebraAdvanced].mobileBreakpoint && !IS_MOBILE
+  const isDesktop = width > MOBILE_LAYOUT_WIDTH && !IS_MOBILE
   const locale = t('locale') as Locale
 
   const keyboardGroups = useMemo(() => {

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

@@ -2,17 +2,17 @@ import React, { PropsWithChildren } from 'react'
 import { KeysList } from '../KeysList/KeysList'
 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/keyboardGroupsByLocale'
 import { IS_MOBILE } from '@magmamath/react-native-ui'
-import { KEYBOARD_LAYOUTS } from '../../constants/keyboardLayouts'
 
 export const BasicLayout = (props: KeyboardLayoutProps & PropsWithChildren) => {
   const t = useText()
   const keysByLocale = KEYBOARD_GROUPS_BY_LOCALE[t('locale') as Locale][KeyboardType.Basic]
   const keys = props.children ? keysByLocale.keys : keysByLocale.keys.slice(0, -1)
   const { width } = useWindowDimensions()
-  const isMobile = width <= KEYBOARD_LAYOUTS[KeyboardType.Basic].mobileBreakpoint || IS_MOBILE
+  const isMobile = width <= MOBILE_LAYOUT_WIDTH || IS_MOBILE
 
   if (isMobile && !props.children) {
     return null

package/src/features/keyboard/components/BasicPlusLayout/keyboardGroups.ts

@@ -9,21 +9,19 @@ export const MATH_ENTRY_BASIC_SW_PLUS: KeyboardGroup = {
     MATH_BASIC_OPERATORS.ADDITION,
     MATH_BASIC_OPERATORS.SUBTRACTION,
     MATH_BASIC_OPERATORS.EQUALS,
-    MATH_BASIC_OPERATORS.ROUND_BRACKET_LEFT,
-    MATH_BASIC_OPERATORS.ROUND_BRACKET_RIGHT,
-    MATH_BASIC_OPERATORS.FRACTION,
+    MATH_BASIC_OPERATORS.PARENTHESES,
+    MATH_BASIC_OPERATORS.SQUARE_POWER,
+    MATH_BASIC_OPERATORS.SQUARE_ROOT,
     MATH_BASIC_OPERATORS.C_DOT,
     MATH_BASIC_OPERATORS.DIVISION,
     MATH_BASIC_OPERATORS.DOT,
     MATH_BASIC_OPERATORS.PERCENT,
-    MATH_BASIC_OPERATORS.SQUARE_POWER,
-    MATH_BASIC_OPERATORS.SQUARE_ROOT,
+    MATH_BASIC_OPERATORS.NTH_POWER,
+    MATH_BASIC_OPERATORS.NTH_ROOT,
     MATH_TEXT_SYMBOLS.X,
     MATH_TEXT_SYMBOLS.Y,
     MATH_TEXT_SYMBOLS.Z,
     MATH_BASIC_OPERATORS.PERMILLE,
-    MATH_BASIC_OPERATORS.NTH_POWER,
-    MATH_BASIC_OPERATORS.NTH_ROOT,
   ],
 }
 
@@ -33,20 +31,17 @@ export const MATH_ENTRY_BASIC_PLUS_MOBILE_SW: KeyboardGroup = {
     MATH_BASIC_OPERATORS.ADDITION,
     MATH_BASIC_OPERATORS.SUBTRACTION,
     MATH_BASIC_OPERATORS.EQUALS,
-    MATH_BASIC_OPERATORS.ROUND_BRACKET_LEFT,
-    MATH_BASIC_OPERATORS.ROUND_BRACKET_RIGHT,
-    MATH_BASIC_OPERATORS.FRACTION,
-    MATH_BASIC_OPERATORS.C_DOT,
+    MATH_BASIC_OPERATORS.SQUARE_POWER,
+    MATH_BASIC_OPERATORS.SQUARE_ROOT,
+    MATH_BASIC_OPERATORS.MULTIPLICATION,
     MATH_BASIC_OPERATORS.DIVISION,
     MATH_BASIC_OPERATORS.DOT,
     MATH_BASIC_OPERATORS.PERCENT,
-    MATH_BASIC_OPERATORS.SQUARE_POWER,
-    MATH_BASIC_OPERATORS.SQUARE_ROOT,
+    MATH_BASIC_OPERATORS.NTH_POWER,
     MATH_TEXT_SYMBOLS.X,
     MATH_TEXT_SYMBOLS.Y,
     MATH_TEXT_SYMBOLS.Z,
     MATH_BASIC_OPERATORS.PERMILLE,
-    MATH_BASIC_OPERATORS.NTH_POWER,
   ],
 }
 
@@ -56,21 +51,19 @@ export const MATH_ENTRY_BASIC_US_PLUS: KeyboardGroup = {
     MATH_BASIC_OPERATORS.ADDITION,
     MATH_BASIC_OPERATORS.SUBTRACTION,
     MATH_BASIC_OPERATORS.EQUALS,
-    MATH_BASIC_OPERATORS.ROUND_BRACKET_LEFT,
-    MATH_BASIC_OPERATORS.ROUND_BRACKET_RIGHT,
-    MATH_BASIC_OPERATORS.FRACTION,
+    MATH_BASIC_OPERATORS.PARENTHESES,
+    MATH_BASIC_OPERATORS.SQUARE_POWER,
+    MATH_BASIC_OPERATORS.SQUARE_ROOT,
     MATH_BASIC_OPERATORS.MULTIPLICATION,
     MATH_BASIC_OPERATORS.DIVISION,
     MATH_BASIC_OPERATORS.COMMA,
     MATH_BASIC_OPERATORS.PERCENT,
-    MATH_BASIC_OPERATORS.SQUARE_POWER,
-    MATH_BASIC_OPERATORS.SQUARE_ROOT,
+    MATH_BASIC_OPERATORS.NTH_POWER,
+    MATH_BASIC_OPERATORS.NTH_ROOT,
     MATH_TEXT_SYMBOLS.X,
     MATH_TEXT_SYMBOLS.Y,
     MATH_TEXT_SYMBOLS.Z,
     MATH_BASIC_OPERATORS.PERMILLE,
-    MATH_BASIC_OPERATORS.NTH_POWER,
-    MATH_BASIC_OPERATORS.NTH_ROOT,
   ],
 }
 
@@ -80,19 +73,16 @@ export const MATH_ENTRY_BASIC_PLUS_MOBILE: KeyboardGroup = {
     MATH_BASIC_OPERATORS.ADDITION,
     MATH_BASIC_OPERATORS.SUBTRACTION,
     MATH_BASIC_OPERATORS.EQUALS,
-    MATH_BASIC_OPERATORS.ROUND_BRACKET_LEFT,
-    MATH_BASIC_OPERATORS.ROUND_BRACKET_RIGHT,
-    MATH_BASIC_OPERATORS.FRACTION,
+    MATH_BASIC_OPERATORS.SQUARE_POWER,
+    MATH_BASIC_OPERATORS.SQUARE_ROOT,
     MATH_BASIC_OPERATORS.MULTIPLICATION,
     MATH_BASIC_OPERATORS.DIVISION,
     MATH_BASIC_OPERATORS.COMMA,
     MATH_BASIC_OPERATORS.PERCENT,
-    MATH_BASIC_OPERATORS.SQUARE_POWER,
-    MATH_BASIC_OPERATORS.SQUARE_ROOT,
+    MATH_BASIC_OPERATORS.NTH_POWER,
     MATH_TEXT_SYMBOLS.X,
     MATH_TEXT_SYMBOLS.Y,
     MATH_TEXT_SYMBOLS.Z,
     MATH_BASIC_OPERATORS.PERMILLE,
-    MATH_BASIC_OPERATORS.NTH_POWER,
   ],
 }

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

@@ -3,16 +3,15 @@ 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 { MOBILE_LAYOUT_WIDTH } from '../../constants/constants'
 import { getKeyboardGroup } from '../../helpers'
 import { IS_MOBILE } from '@magmamath/react-native-ui'
-import { KEYBOARD_LAYOUTS } from '../../constants/keyboardLayouts'
 
 export const BasicPlusPlusLayout = (props: KeyboardLayoutProps) => {
   const t = useText()
   const { width } = useWindowDimensions()
   const locale = t('locale') as Locale
-  const isDesktop =
-    width > KEYBOARD_LAYOUTS[KeyboardType.BasicPlusPlus].mobileBreakpoint && !IS_MOBILE
+  const isDesktop = width > MOBILE_LAYOUT_WIDTH && !IS_MOBILE
   const keysGroup = getKeyboardGroup(
     locale,
     isDesktop ? KeyboardType.BasicPlusPlus : KeyboardType.BasicPlusPlusMobile,

package/src/features/keyboard/components/BasicPlusPlusLayout/keyboardGroups.ts

@@ -11,22 +11,21 @@ export const MATH_ENTRY_BASIC_PLUS_PLUS: KeyboardGroup = {
     MATH_BASIC_OPERATORS.ADDITION,
     MATH_BASIC_OPERATORS.SUBTRACTION,
     MATH_BASIC_OPERATORS.EQUALS,
-    MATH_BASIC_OPERATORS.ROUND_BRACKET_LEFT,
-    MATH_BASIC_OPERATORS.ROUND_BRACKET_RIGHT,
+    MATH_BASIC_OPERATORS.PARENTHESES,
     MATH_BASIC_OPERATORS.SQUARE_POWER,
     MATH_BASIC_OPERATORS.SQUARE_ROOT,
+    MATH_BASIC_OPERATORS.PLUS_MINUS,
     MATH_SYMBOLS.PI,
     MATH_GEOMETRY_SYMBOLS.RADIAN,
     MATH_BASIC_OPERATORS.MULTIPLICATION,
     MATH_BASIC_OPERATORS.FRACTION,
     MATH_BASIC_OPERATORS.SLASH,
-    MATH_BASIC_OPERATORS.PLUS_MINUS,
+    MATH_BASIC_OPERATORS.COMMA,
     MATH_BASIC_OPERATORS.PERCENT,
     MATH_BASIC_OPERATORS.NTH_POWER,
     MATH_BASIC_OPERATORS.NTH_ROOT,
     MATH_SYMBOLS.THETA,
     MATH_GEOMETRY_SYMBOLS.DEGREE,
-    MATH_BASIC_OPERATORS.COMMA,
     MATH_TEXT_SYMBOLS.X,
     MATH_TEXT_SYMBOLS.Y,
     MATH_TEXT_SYMBOLS.Z,
@@ -44,23 +43,21 @@ export const MATH_ENTRY_BASIC_PLUS_PLUS_MOBILE: KeyboardGroup = {
     MATH_BASIC_OPERATORS.ADDITION,
     MATH_BASIC_OPERATORS.SUBTRACTION,
     MATH_BASIC_OPERATORS.EQUALS,
-    MATH_BASIC_OPERATORS.ROUND_BRACKET_LEFT,
-    MATH_BASIC_OPERATORS.ROUND_BRACKET_RIGHT,
-    MATH_SYMBOLS.PI,
-    MATH_GEOMETRY_SYMBOLS.RADIAN,
+    MATH_BASIC_OPERATORS.SQUARE_POWER,
+    MATH_BASIC_OPERATORS.SQUARE_ROOT,
+    MATH_BASIC_OPERATORS.GREATER_THAN,
     MATH_BASIC_OPERATORS.MULTIPLICATION,
     MATH_BASIC_OPERATORS.FRACTION,
     MATH_BASIC_OPERATORS.COMMA,
-    MATH_BASIC_OPERATORS.SQUARE_POWER,
-    MATH_BASIC_OPERATORS.SQUARE_ROOT,
-    MATH_SYMBOLS.THETA,
-    MATH_GEOMETRY_SYMBOLS.DEGREE,
+    MATH_BASIC_OPERATORS.NTH_POWER,
+    MATH_SYMBOLS.PI,
+    MATH_BASIC_OPERATORS.LESS_THAN,
     MATH_TEXT_SYMBOLS.X,
     MATH_TEXT_SYMBOLS.Y,
     MATH_TEXT_SYMBOLS.Z,
-    MATH_BASIC_OPERATORS.NTH_POWER,
-    MATH_BASIC_OPERATORS.LESS_THAN,
-    MATH_BASIC_OPERATORS.GREATER_THAN,
+    MATH_SYMBOLS.THETA,
+    MATH_GEOMETRY_SYMBOLS.DEGREE,
+    MATH_GEOMETRY_SYMBOLS.RADIAN,
   ],
 }
 
@@ -70,22 +67,21 @@ export const MATH_ENTRY_BASIC_PLUS_PLUS_SW: KeyboardGroup = {
     MATH_BASIC_OPERATORS.ADDITION,
     MATH_BASIC_OPERATORS.SUBTRACTION,
     MATH_BASIC_OPERATORS.EQUALS,
-    MATH_BASIC_OPERATORS.ROUND_BRACKET_LEFT,
-    MATH_BASIC_OPERATORS.ROUND_BRACKET_RIGHT,
+    MATH_BASIC_OPERATORS.PARENTHESES,
     MATH_BASIC_OPERATORS.SQUARE_POWER,
     MATH_BASIC_OPERATORS.SQUARE_ROOT,
+    MATH_BASIC_OPERATORS.PLUS_MINUS,
     MATH_SYMBOLS.PI,
     MATH_GEOMETRY_SYMBOLS.RADIAN,
     MATH_BASIC_OPERATORS.C_DOT,
     MATH_BASIC_OPERATORS.FRACTION,
     MATH_BASIC_OPERATORS.SLASH,
-    MATH_BASIC_OPERATORS.PLUS_MINUS,
+    MATH_BASIC_OPERATORS.DOT,
     MATH_BASIC_OPERATORS.PERCENT,
     MATH_BASIC_OPERATORS.NTH_POWER,
     MATH_BASIC_OPERATORS.NTH_ROOT,
     MATH_SYMBOLS.THETA,
     MATH_GEOMETRY_SYMBOLS.DEGREE,
-    MATH_BASIC_OPERATORS.DOT,
     MATH_TEXT_SYMBOLS.X,
     MATH_TEXT_SYMBOLS.Y,
     MATH_TEXT_SYMBOLS.Z,
@@ -103,22 +99,20 @@ export const MATH_ENTRY_BASIC_PLUS_PLUS_MOBILE_SW: KeyboardGroup = {
     MATH_BASIC_OPERATORS.ADDITION,
     MATH_BASIC_OPERATORS.SUBTRACTION,
     MATH_BASIC_OPERATORS.EQUALS,
-    MATH_BASIC_OPERATORS.ROUND_BRACKET_LEFT,
-    MATH_BASIC_OPERATORS.ROUND_BRACKET_RIGHT,
-    MATH_SYMBOLS.PI,
-    MATH_GEOMETRY_SYMBOLS.RADIAN,
+    MATH_BASIC_OPERATORS.SQUARE_POWER,
+    MATH_BASIC_OPERATORS.SQUARE_ROOT,
+    MATH_BASIC_OPERATORS.GREATER_THAN,
     MATH_BASIC_OPERATORS.C_DOT,
     MATH_BASIC_OPERATORS.FRACTION,
     MATH_BASIC_OPERATORS.DOT,
-    MATH_BASIC_OPERATORS.SQUARE_POWER,
-    MATH_BASIC_OPERATORS.SQUARE_ROOT,
-    MATH_SYMBOLS.THETA,
-    MATH_GEOMETRY_SYMBOLS.DEGREE,
+    MATH_BASIC_OPERATORS.NTH_POWER,
+    MATH_SYMBOLS.PI,
+    MATH_BASIC_OPERATORS.LESS_THAN,
     MATH_TEXT_SYMBOLS.X,
     MATH_TEXT_SYMBOLS.Y,
     MATH_TEXT_SYMBOLS.Z,
-    MATH_BASIC_OPERATORS.NTH_POWER,
-    MATH_BASIC_OPERATORS.LESS_THAN,
-    MATH_BASIC_OPERATORS.GREATER_THAN,
+    MATH_SYMBOLS.THETA,
+    MATH_GEOMETRY_SYMBOLS.DEGREE,
+    MATH_GEOMETRY_SYMBOLS.RADIAN,
   ],
 }

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

@@ -9,7 +9,7 @@ import {
   KEYBOARD_SLIDE_DISTANCE,
   slideInAnimationSettings,
 } from './MainLayout/constants'
-import { isMobileWidth } from '../helpers'
+import { MOBILE_LAYOUT_WIDTH } from '../constants/constants'
 
 type KeyboardProps = {
   onKeyPress: (key: KeyboardKeyValue) => void
@@ -17,21 +17,15 @@ type KeyboardProps = {
   style?: StyleProp<ViewStyle>
   color?: SelectOptionColor
   isDisabled?: boolean
-  isMainLayoutDisabled?: boolean
   showUnderlinedKeys?: boolean
   disabledKeys?: KeyboardKey[]
 }
 
-export const Keyboard = ({
-  style,
-  characterType,
-  isMainLayoutDisabled,
-  ...props
-}: KeyboardProps) => {
+export const Keyboard = ({ style, characterType, ...props }: KeyboardProps) => {
   const slideAnim = useRef(new Animated.Value(KEYBOARD_SLIDE_DISTANCE)).current
 
   const { width } = useWindowDimensions()
-  const isMobile = IS_MOBILE || isMobileWidth(width, characterType)
+  const isMobile = width <= MOBILE_LAYOUT_WIDTH || IS_MOBILE
   const mobileStyles = useMemo(
     () => getLayoutConfigStyles(characterType, isMobile),
     [characterType, isMobile],
@@ -60,11 +54,7 @@ export const Keyboard = ({
         },
       ]}
     >
-      <MainLayout
-        {...props}
-        isDisabled={isMainLayoutDisabled || props.isDisabled}
-        characterType={characterType}
-      />
+      <MainLayout {...props} characterType={characterType} />
       <Numpad {...props} style={mobileStyles} />
     </Animated.View>
   )

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

@@ -1,5 +1,5 @@
 import React, { useMemo } from 'react'
-import { StyleSheet } from 'react-native'
+import { StyleProp, StyleSheet, ViewStyle } from 'react-native'
 import {
   ButtonStyle,
   SelectGroup,

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

@@ -1,9 +1,10 @@
 import React, { useEffect, useMemo, useRef, useState, useCallback } from 'react'
-import { Animated, StyleSheet, View } from 'react-native'
+import { Animated, StyleSheet, useWindowDimensions, View } from 'react-native'
 import { SelectOptionColor, IS_MOBILE, IS_WEB } from '@magmamath/react-native-ui'
 import { getLayoutByCharType, isBasicPlusPlusLayout } from '../../constants/keyboardLayouts'
 import { KeyboardKey, KeyboardKeyValue } from '../../types/types'
 import { UnderlinedLayout } from '../UnderlinedLayout/UnderlinedLayout'
+import { MOBILE_LAYOUT_WIDTH } from '../../constants/constants'
 
 type LayoutProps = {
   onKeyPress: (key: KeyboardKeyValue) => void
@@ -26,8 +27,11 @@ export const MainLayout = ({
   const fadeAnim = useRef(new Animated.Value(showUnderlinedKeys ? 1 : 0)).current
   const fadeRef = useRef<Animated.CompositeAnimation | null>(null)
 
+  const { width } = useWindowDimensions()
+  const isMobile = width <= MOBILE_LAYOUT_WIDTH || IS_MOBILE
+
   const Layout = useMemo(() => getLayoutByCharType(characterType), [characterType])
-  const isUnderlinedLayoutVisible = isUnderlinedVisible && !isSecondaryLayoutSelected && !IS_MOBILE
+  const isUnderlinedLayoutVisible = isUnderlinedVisible && !isSecondaryLayoutSelected && !isMobile
 
   const animateFade = useCallback(
     (toValue: number, onComplete?: () => void) => {

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

@@ -61,7 +61,7 @@ const styles = StyleSheet.create({
     borderBottomWidth: 1,
     borderBottomColor: COLORS.NEUTRAL_3,
     paddingTop: 0,
-    gap: 12,
+    gap: 24,
   },
   keyGroupContainer: {
     gap: 8,

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

@@ -50,6 +50,3 @@ export const getSelectOptions = ({
     ]
   }
 }
-
-export const isKeyboardUnitsGroupType = (k: string): k is KeyboardUnitsGroupType =>
-  (Object.values(KeyboardUnitsGroupType) as string[]).includes(k)

package/src/features/keyboard/components/UnitsLayout/hooks/useUnitTabs.ts

@@ -1,46 +1,32 @@
 import { useText } from '../../../../../shared/translation'
 import { useMemo, useState } from 'react'
-import { KeyboardUnitsGroupType, UnitTab } from '../types'
-import { useWindowDimensions } from 'react-native'
-import { IS_MOBILE, TabOptionProps } from '@magmamath/react-native-ui'
-import { isKeyboardUnitsGroupType } from '../helpers'
+import { TabOptionProps } from '@magmamath/react-native-ui'
+
+import { KeyboardUnitsGroupType } from '../types'
 
 export const useUnitTabs = () => {
   const t = useText()
-  const { width } = useWindowDimensions()
-
-  const allTabs = useMemo<UnitTab[]>(
+  const tabs = useMemo(
     () => [
-      { title: t('keyboard.length'), key: KeyboardUnitsGroupType.LENGTH },
-      { title: t('keyboard.area'), key: KeyboardUnitsGroupType.AREA, minBreakpoint: 1005 },
-      { title: t('keyboard.volume'), key: KeyboardUnitsGroupType.VOLUME, minBreakpoint: 1060 },
-      { title: t('keyboard.weight'), key: KeyboardUnitsGroupType.WEIGHT, minBreakpoint: 1060 },
-      { title: t('keyboard.time'), key: KeyboardUnitsGroupType.TIME, minBreakpoint: 1125 },
+      {
+        title: t('keyboard.length'),
+        key: KeyboardUnitsGroupType.LENGTH,
+      },
+      {
+        title: t('keyboard.area'),
+        key: KeyboardUnitsGroupType.AREA,
+      },
+      {
+        title: t('keyboard.volume'),
+        key: KeyboardUnitsGroupType.VOLUME,
+      },
+      {
+        title: t('keyboard.weight'),
+        key: KeyboardUnitsGroupType.WEIGHT,
+      },
     ],
     [t],
   )
-
-  const tabs = useMemo(
-    () =>
-      allTabs.filter(
-        (tab) => IS_MOBILE || tab.minBreakpoint === undefined || width >= tab.minBreakpoint,
-      ),
-    [allTabs, width],
-  )
-
-  const [activeKey, setActiveKey] = useState<KeyboardUnitsGroupType | undefined>(() => tabs[0]?.key)
-
-  const activeTab = useMemo(() => {
-    return tabs.find((t) => t?.key && t.key === activeKey) ?? tabs[0]
-  }, [tabs, activeKey])
-
-  return {
-    tabs,
-    activeTab,
-    setActiveTab: (tab: TabOptionProps) => {
-      if (isKeyboardUnitsGroupType(tab.key)) {
-        setActiveKey(tab.key)
-      }
-    },
-  }
+  const [activeTab, setActiveTab] = useState<TabOptionProps>(tabs[0])
+  return { tabs, activeTab, setActiveTab }
 }