Merge pull request #118 from ryuzaki01/typescript-cleanup

+ Typescript Cleanup
xmtp · Sep 26, 2023 · b05bf8f · b05bf8f
2 parents 935c921 + fd38436
commit b05bf8f
Show file tree

Hide file tree

Showing 5 changed files with 20 additions and 14 deletions.
diff --git a/example/src/ConversationScreen.tsx b/example/src/ConversationScreen.tsx
@@ -36,12 +36,17 @@ import { PermissionStatus } from "expo-modules-core";
 import type { DocumentPickerAsset } from "expo-document-picker";
 import type { ImagePickerAsset } from "expo-image-picker";
 
+type Attachment = {
+  file?: DocumentPickerAsset
+  image?: ImagePickerAsset
+}
+
 /// Show the messages in a conversation.
 export default function ConversationScreen({
   route,
 }: NativeStackScreenProps<NavigationParamList, "conversation">) {
   let { topic } = route.params;
-  let messageListRef = useRef<FlatList>();
+  let messageListRef = useRef<FlatList>(null);
   let {
     data: messages,
     refetch: refreshMessages,
@@ -52,8 +57,7 @@ export default function ConversationScreen({
   let [replyingTo, setReplyingTo] = useState<string | null>(null);
   let [text, setText] = useState("");
   let [isShowingAttachmentModal, setShowingAttachmentModal] = useState(false);
-  let [attachment, setAttachment] = useState<
-    { image: ImagePickerAsset } | { file: DocumentPickerAsset } | null
+  let [attachment, setAttachment] = useState<Attachment | null
   >(null);
   let [isAttachmentPreviewing, setAttachmentPreviewing] = useState(false);
   let [isSending, setSending] = useState(false);
@@ -255,16 +259,15 @@ function AttachmentPreviewModal({
   onRequestClose,
 }: {
   attachment:
-    | { image: ImagePickerAsset }
-    | { file: DocumentPickerAsset }
+    Attachment
     | null;
   visible: boolean;
   onRequestClose: () => void;
 }) {
   let isImage = attachment?.image?.type === "image";
   return (
     <CenteredModal visible={visible} onRequestClose={onRequestClose}>
-      {isImage && (
+      {(isImage && attachment?.image) && (
         <Image
           source={attachment.image}
           style={{
@@ -306,7 +309,7 @@ function AttachmentInputHeader({
   onRemove,
 }: {
   topic: string;
-  attachment: { file: DocumentPickerAsset } | { image: ImagePickerAsset };
+  attachment: Attachment;
   onPress: () => void;
   onRemove: () => void;
 }) {
@@ -323,7 +326,7 @@ function AttachmentInputHeader({
       }}
     >
       <TouchableOpacity onPress={onPress}>
-        {isImage && (
+        {(isImage && attachment?.image) && (
           <Image
             source={attachment.image}
             style={{
@@ -609,7 +612,7 @@ function AttachmentModal({
                   copyToCacheDirectory: true,
                   multiple: false,
                 });
-                if (result.type === "success" && result.assets?.length) {
+                if (!result.canceled && result.assets?.length) {
                   onAttachedFile(result.assets[0]);
                 }
               }}

diff --git a/example/src/HomeScreen.tsx b/example/src/HomeScreen.tsx
@@ -1,7 +1,7 @@
 import { NavigationParamList } from "./Navigation";
 import { NativeStackScreenProps } from "@react-navigation/native-stack";
 import { useXmtp } from "./XmtpContext";
-import { useConversationList, useLastMessage, useMessages } from "./hooks";
+import { useConversationList, useMessages } from "./hooks";
 import {
   Button,
   FlatList,

diff --git a/example/src/XmtpContext.tsx b/example/src/XmtpContext.tsx
@@ -1,4 +1,4 @@
-import { createContext, useContext, useMemo, useState } from "react";
+import {createContext, FC, ReactNode, useContext, useMemo, useState} from "react";
 import * as XMTP from "xmtp-react-native-sdk";
 
 const XmtpContext = createContext<{
@@ -9,7 +9,10 @@ const XmtpContext = createContext<{
   setClient: () => {},
 });
 export const useXmtp = () => useContext(XmtpContext);
-export function XmtpContextProvider({ children }) {
+type Props = {
+  children: ReactNode
+}
+export const XmtpContextProvider: FC<Props> = ({ children }) => {
   let [client, setClient] = useState<XMTP.Client | null>(null);
   let context = useMemo(() => ({ client, setClient }), [client, setClient]);
   return (

diff --git a/example/src/hooks.tsx b/example/src/hooks.tsx
@@ -248,7 +248,7 @@ export function usePrepareRemoteAttachment({
   fileUri,
   mimeType,
 }: {
-  fileUri?: `file://${string}`;
+  fileUri?: string;
   mimeType?: string;
 }): {
   remoteAttachment: RemoteAttachmentContent | undefined;

diff --git a/example/src/storage.ts b/example/src/storage.ts
@@ -25,7 +25,7 @@ export async function uploadFile(
   return url;
 }
 
-export async function downloadFile(url: string): Promise<`file://${string}`> {
+export async function downloadFile(url: string): Promise<string> {
   console.log("downloading from", url);
   let res = await ReactNativeBlobUtil.config({ fileCache: true }).fetch(
     "GET",