Merge pull request #39 from RonasIT/PRD-2132-keyboard-controllers-refactoring

PRD-2132: ScreenWrapper keyboard avoidance fix

Author: veliseev93

apps/mobile/app/(main)/chat/create.tsx

@@ -47,7 +47,7 @@ export default function CreateChatScreen(): ReactElement {
         header: <AppHeader title={translate('TEXT_NEW_CHAT')} onGoBack={handleBackPress} />,
       }}
       safeAreaProps={{ edges: [] }}
-      keyBoardAvoidingProps={{ enabled: !isBottomSheetInputFocused }}>
+      keyBoardAvoidingProps={{ enabled: !isBottomSheetInputFocused, bottomOffset: 60 }}>
       <NoConnectionBanner isVisible={isOfflineMode} />
       <CreateChat
         onChatCreated={handleChatCreated}

libs/mobile/shared/ui/keyboard-avoiding-view/src/lib/component.tsx

@@ -1,23 +1,24 @@
 import { ComponentType } from 'react';
 import { ScrollViewProps, StyleProp, ViewStyle } from 'react-native';
 import { KeyboardAwareScrollView } from 'react-native-keyboard-controller';
-import { commonStyle } from '@open-webui-react-native/mobile/shared/ui/styles';
 
 export type AppKeyboardAvoidingViewProps = Omit<ScrollViewProps, 'onFocus'> & {
   onFocus?: ((event: any) => void) | null;
   contentContainerStyleKeyboardShown?: StyleProp<ViewStyle>;
   enabled?: boolean;
+  bottomOffset?: number;
 };
 
 // TODO: Research how use nativewind here
 export const AppKeyboardAvoidingView: ComponentType<AppKeyboardAvoidingViewProps> = ({ children, ...props }) => {
-  const { onFocus, ...restProps } = props;
+  const { onFocus, contentContainerStyle, bottomOffset, ...restProps } = props;
 
   return (
     <KeyboardAwareScrollView
       keyboardShouldPersistTaps='handled'
       showsVerticalScrollIndicator={false}
-      contentContainerStyle={commonStyle.fullFlex}
+      contentContainerStyle={[{ flexGrow: 1 }, contentContainerStyle]}
+      bottomOffset={bottomOffset}
       onFocus={onFocus ?? undefined}
       {...restProps}>
       {children}

libs/mobile/shared/ui/screen-wrapper/src/lib/component.tsx

@@ -26,9 +26,12 @@ export function ScreenWrapper({
   keyBoardAvoidingProps,
 }: PropsWithChildren<ScreenWrapperProps>): ReactElement {
   const { header, ...restScreenProps } = screenProps || {};
+
   const content = isKeyboardAvoiding ? (
     <AppKeyboardAvoidingView {...keyBoardAvoidingProps}>
-      <AppScreen {...restScreenProps}>{children}</AppScreen>
+      <AppScreen scrollDisabled {...restScreenProps}>
+        {children}
+      </AppScreen>
     </AppKeyboardAvoidingView>
   ) : (
     <AppScreen {...restScreenProps}>{children}</AppScreen>

libs/shared/data-access/api/src/lib/knowledge/models/knowledge-response.ts

@@ -1,8 +1,9 @@
-import { Expose } from 'class-transformer';
+import { Expose, Type } from 'class-transformer';
 import { Knowledge } from './knowledge';
 
 export class KnowledgeResponse {
   @Expose()
+  @Type(() => Knowledge)
   public items: Array<Knowledge>;
 
   @Expose()