u

code/allapp/allapp-rn/src/components/common/ao/Avatar.tsx

@@ -0,0 +1,52 @@
+import type { StyleProp, ViewStyle } from 'react-native'
+import React from 'react'
+import {
+  AvatarBadge,
+  AvatarFallbackText,
+  AvatarImage,
+  Avatar as NativeAvatar,
+} from '@/components/ui/avatar'
+
+interface AvatarProps {
+  username?: string
+  avatar?: string
+  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl'
+  showBadge?: boolean
+  className?: string
+  style?: StyleProp<ViewStyle>
+  badgeClassName?: string
+  badgeStyle?: StyleProp<ViewStyle>
+}
+
+export const Avatar: React.FC<AvatarProps> = ({
+  username = '',
+  avatar,
+  size,
+  showBadge,
+  className = '',
+  style,
+  badgeClassName,
+  badgeStyle,
+}) => {
+  return (
+    <NativeAvatar
+      size={size}
+      className={`${!avatar ? 'bg-indigo-600' : ''} ${className}`}
+      style={style}
+    >
+      {avatar
+        ? (
+            <AvatarImage source={{ uri: avatar }} />
+          )
+        : (
+            <AvatarFallbackText className="text-white text-2xl">
+              {username[0] ?? ''}
+            </AvatarFallbackText>
+          )}
+
+      {showBadge && (
+        <AvatarBadge className={badgeClassName} style={badgeStyle} />
+      )}
+    </NativeAvatar>
+  )
+}

code/allapp/allapp-rn/src/components/common/ao/Drawer.tsx

@@ -2,7 +2,6 @@ import type { ReactNode } from 'react'
 import type { DimensionValue, ViewStyle } from 'react-native'
 import React, { useEffect, useMemo, useState } from 'react'
 import { Dimensions, StyleSheet, Text, View } from 'react-native'
-import { Gesture, GestureDetector } from 'react-native-gesture-handler'
 import Animated, {
   interpolate,
   runOnJS,
@@ -103,24 +102,6 @@ export default function Drawer({
     opacity: interpolate(progress.value, [0, 1], [0, 0.45], 'clamp'),
   }))
 
-  /* ================= 手势（只给 bottom） ================= */
-  const pan = Gesture.Pan()
-    .onUpdate((e) => {
-      if (menuPosition === 'bottom' && e.translationY > 0) {
-        drag.value = e.translationY
-      }
-    })
-    .onEnd(() => {
-      if (menuPosition === 'bottom' && drag.value > 120) {
-        progress.value = withTiming(0, { duration }, () => {
-          drag.value = 0
-          runOnJS(hideModal)()
-        })
-      }
-      else {
-        drag.value = withTiming(0)
-      }
-    })
 
   if (!innerVisible)
     return null
@@ -135,34 +116,32 @@ export default function Drawer({
 
       {/* Drawer */}
       <View style={[styles.drawerBox, drawerBox]}>
-        <GestureDetector gesture={pan}>
-          <Animated.View
-            style={[
-              styles.drawer,
-              drawerStyle,
-              {
-                borderTopLeftRadius: isCircle ? CircleNum : 0,
-                borderTopRightRadius: isCircle ? CircleNum : 0,
-              },
-            ]}
-          >
-            {showHeader && (
-              header ?? (
-                <View style={styles.headTitle}>
-                  <Text style={styles.title}>{title}</Text>
-                  <LucideIcon
-                    icon="X"
-                    size={22}
-                    style={styles.close}
-                    onPress={hideModal}
-                  />
-                </View>
-              )
-            )}
+        <Animated.View
+          style={[
+            styles.drawer,
+            drawerStyle,
+            {
+              borderTopLeftRadius: isCircle ? CircleNum : 0,
+              borderTopRightRadius: isCircle ? CircleNum : 0,
+            },
+          ]}
+        >
+          {showHeader && (
+            header ?? (
+              <View style={styles.headTitle}>
+                <Text style={styles.title}>{title}</Text>
+                <LucideIcon
+                  icon="X"
+                  size={22}
+                  style={styles.close}
+                  onPress={hideModal}
+                />
+              </View>
+            )
+          )}
 
-            {children}
-          </Animated.View>
-        </GestureDetector>
+          {children}
+        </Animated.View>
       </View>
     </View>
   )

code/allapp/allapp-rn/src/components/common/ao/index.ts

@@ -1,9 +1,10 @@
+import { Avatar } from './Avatar'
 import Button from './Button'
 import { Cell, CellGroup } from './Cell'
 import Checkbox from './Checkbox'
 import DatePicker from './DatePicker'
-import Divider from './Divider'
 
+import Divider from './Divider'
 import Drawer from './Drawer'
 import Form, { FormRef } from './Form'
 import FormItem from './FormItem'
@@ -12,9 +13,11 @@ import ListItem from './ListItem'
 import LucideIcon from './LucideIcon'
 import Modal from './Modal'
 import SegmentedTabs from './SegmentedTabs'
+
 import Tab from './Tab'
 
 export {
+  Avatar as AAvatar,
   Button as AButton,
   Cell as ACell,
   CellGroup as ACellGroup,