update

2025-07-31 21:25:33 +08:00
parent 5cfbc81e3a
commit 84fc719a10
307 changed files with 46470 additions and 0 deletions
@@ -0,0 +1,141 @@
+import { useState, useEffect } from "reactn";
+import { Pressable, TextInput, View, Image } from "react-native";
+import { BlurView } from "expo-blur";
+
+import { Fonts, gutters, Palette } from "../styles";
+import Style from "../styles/Style";
+
+import { chatsRef } from "../config/firebase";
+
+import { icons } from "../assets";
+
+import { isWeb } from "../hooks/useLayoutType.js";
+
+import DocumentDropZone from "./DocumentDropZone.js";
+import FilesPreview from "./FilesPreview.js";
+
+const ChatInput = ({
+  message,
+  setMessage,
+  onSendMessage,
+  containerStyle = {},
+  placeholder = "",
+  chatID = null,
+}) => {
+  const [files, setFiles] = useState([]);
+
+  useEffect(() => {
+    setFiles([]);
+  }, [chatID]);
+
+  const handleMessageObject = () => {
+    if (message.length > 0 || files.length > 0) {
+      onSendMessage({
+        customPayload: {
+          files,
+        },
+      });
+      setMessage("");
+      setFiles([]);
+    }
+  };
+
+  const handleKeyPress = (e) => {
+    if (e?.nativeEvent?.key?.toLowerCase() === "enter") {
+      handleMessageObject();
+    }
+  };
+
+  return (
+    <View
+      style={{
+        ...Style.containerItem,
+        backgroundColor: Palette.transparentDarkPurple,
+        justifyContent: "center",
+        borderWidth: 1,
+        borderColor: Palette.ultraLightWhite,
+        overflow: "hidden",
+        width: "100%",
+        height: "auto",
+        padding: 0,
+        ...containerStyle,
+      }}
+    >
+      <BlurView
+        intensity={30}
+        tint="dark"
+        style={{ flex: 1, justifyContent: "center" }}
+      >
+        <FilesPreview
+          files={files}
+          setFiles={setFiles}
+          containerStyle={{ margin: gutters / 2, marginBottom: 0 }}
+        />
+
+        <View style={{ ...Style.containerRow, height: 50 }}>
+          <DocumentDropZone
+            documentID={chatID}
+            collectionRef={chatsRef}
+            shouldReturnObject
+            setFiles={setFiles}
+            customElement={() => (
+              <View style={{ width: 50, ...Style.containerCenter }}>
+                <Image
+                  resizeMode="contain"
+                  source={icons.addFile}
+                  style={{
+                    ...Style.iconSmall,
+                  }}
+                />
+              </View>
+            )}
+          />
+
+          <TextInput
+            numberOfLines={1}
+            placeholder={placeholder}
+            placeholderTextColor={Palette.white}
+            value={message}
+            onChangeText={setMessage}
+            style={{
+              width: "85%",
+              ...Fonts({ type: "default", style: {} }),
+            }}
+            keyboardAppearance="dark"
+            {...(!isWeb
+              ? {
+                  returnKeyType: "send",
+                  onSubmitEditing: onSendMessage,
+                }
+              : {
+                  onKeyPress: handleKeyPress,
+                })}
+          />
+
+          <Pressable
+            onPress={handleMessageObject}
+            style={{
+              position: "absolute",
+              top: 0,
+              right: 0,
+              bottom: 0,
+              width: 50,
+              justifyContent: "center",
+              alignItems: "center",
+            }}
+          >
+            <Image
+              resizeMode="contain"
+              source={icons.send}
+              style={{
+                ...Style.iconSmall,
+              }}
+            />
+          </Pressable>
+        </View>
+      </BlurView>
+    </View>
+  );
+};
+
+export default ChatInput;