Reconnect chat

app.json

@@ -7,6 +7,7 @@
     "icon": "./assets/images/icon.jpg",
     "scheme": "arcade",
     "userInterfaceStyle": "dark",
+    "backgroundColor": "#000000",
     "splash": {
       "image": "./assets/images/splash.png",
       "resizeMode": "cover",

package.json

@@ -61,9 +61,11 @@
     "expo-system-ui": "~2.2.1",
     "expo-web-browser": "~12.1.1",
     "i18n-js": "3.9.2",
+    "js-lnurl": "0.5.1",
     "lodash": "^4.17.21",
     "luxon": "3.3.0",
     "moment": "^2.29.4",
+    "nostr-relaypool": "0.2.1",
     "nostr-tools": "1.8.1",
     "ramda": "0.29.0",
     "react": "18.2.0",

src/@types/globals.d.ts

@@ -0,0 +1,5 @@
+import { FC, ReactNode } from 'react'
+
+declare global {
+  type FCC<T = object> = FC<{ children?: ReactNode } & T>
+}

src/@types/navigation.ts

@@ -0,0 +1,8 @@
+import { Channel } from 'stores/chat'
+
+export type StackNavigatorParams = {
+  home: undefined
+  create: undefined
+  login: undefined
+  channel: { channel: Channel }
+}

src/@types/rnw-overrides.d.ts

@@ -0,0 +1,31 @@
+// override react-native types with react-native-web types
+import 'react-native'
+
+declare module 'react-native' {
+  interface PressableStateCallbackType {
+    hovered?: boolean
+    focused?: boolean
+  }
+  interface ViewStyle {
+    transitionProperty?: string
+    transitionDuration?: string
+  }
+  interface TextProps {
+    accessibilityComponentType?: never
+    accessibilityTraits?: never
+    href?: string
+    hrefAttrs?: {
+      rel: 'noreferrer'
+      target?: '_blank'
+    }
+  }
+  interface ViewProps {
+    accessibilityRole?: string
+    href?: string
+    hrefAttrs?: {
+      rel: 'noreferrer'
+      target?: '_blank'
+    }
+    onClick?: (e: React.MouseEvent<HTMLAnchorElement, MouseEvent>) => void
+  }
+}

src/lib/api/getApiToken.ts

@@ -1,6 +1,6 @@
-// import * as Crypto from 'expo-crypto'
-import * as storage from 'app/lib/storage'
 import axios from 'axios'
+// import * as Crypto from 'expo-crypto'
+import * as storage from 'lib/storage'
 import { randomFourLetterString } from 'lib/utils'
 import * as secp256k1 from '@noble/secp256k1'
 import { API_URL } from './url'

src/lib/hooks/index.ts

@@ -5,4 +5,5 @@ export * from './useAuthed'
 export * from './useChannelMessages'
 export * from './useInterval'
 export * from './useLongPress'
+export * from './useNostr'
 export * from './useTheme'

src/lib/hooks/useNostr.ts

@@ -0,0 +1,17 @@
+import { useEffect } from 'react'
+import { useStore } from 'stores'
+import { Nostr } from '../nostr'
+
+export const useNostr = () => {
+  const nostr = useStore((s) => s.nostr)
+
+  // If nostr is undefined, create new Nostr object. Do it only once.
+  useEffect(() => {
+    if (!nostr) {
+      const newNostr = new Nostr()
+      useStore.setState({ nostr: newNostr })
+    }
+  }, [nostr])
+
+  return nostr
+}

src/lib/hooks/useNostrHook.ts

@@ -0,0 +1,144 @@
+import {
+    Event as NostrEvent, Filter, handleEvent, Kind, validateEvent
+} from 'lib/nostr'
+import { RelayPool, RelayPoolSubscription } from 'nostr-relaypool'
+import {
+    Event, generatePrivateKey, getEventHash, getPublicKey, signEvent
+} from 'nostr-tools'
+import { useEffect, useState } from 'react'
+import { useStore } from 'stores'
+import { initialSubscriptions } from 'views/chat/initialSubscriptions'
+import { DEFAULT_RELAYS } from '../constants/relays'
+
+export function useNostr(
+  publicKey: string | undefined = undefined,
+  privateKey: string | undefined = undefined,
+  relays: string[] = DEFAULT_RELAYS
+) {
+  const [relayPool, setRelayPool] = useState(new RelayPool(relays))
+  const [subscription, setSubscription] =
+    useState<RelayPoolSubscription | null>(null)
+
+  const [privateKeyState, setPrivateKey] = useState(
+    privateKey ?? generatePrivateKey()
+  )
+  const [publicKeyState, setPublicKey] = useState(
+    publicKey ?? getPublicKey(privateKeyState)
+  )
+
+  useEffect(() => {
+    setRelayPool(new RelayPool(relays))
+  }, [relays])
+
+  const [friendList, setFriendList] = useState<any>([])
+
+  //   useEffect(() => {
+  //     setFriendList(getFriendList())
+  //   }, [getFriendList])
+
+  //   function getFriendList(): string[] {
+  //     return useStore.getState().friends
+  //   }
+
+  function loadFirstPaint() {
+    // Grab friendlist and add self to it
+    const friends = friendList
+    console.log('friends:', friends)
+    friends.push(publicKeyState)
+
+    // We want contact metadata of our friends
+    const contactsFilters: Filter[] = [{ kinds: [0], authors: friends }]
+
+    // We want our contact list
+    const ourContactsFilters: Filter[] = [
+      {
+        kinds: [Kind.Contacts, Kind.Metadata],
+        authors: [publicKeyState],
+      },
+    ]
+
+    // We want our DMs
+    const dmsFilters: Filter[] = [
+      {
+        kinds: [Kind.EncryptedDirectMessage],
+        limit: 500,
+        authors: [publicKeyState],
+      },
+    ]
+
+    const homeFilters: Filter[] = [
+      {
+        kinds: [Kind.Text, Kind.ChannelMessage, Kind.Repost, Kind.Reaction],
+        authors: friends,
+        limit: 100,
+        // limit: 500,
+      },
+    ]
+
+    // TODO add support for throwing these to specific relay
+    subscribe(contactsFilters)
+    subscribe(ourContactsFilters)
+    subscribe(dmsFilters)
+    subscribe(homeFilters)
+
+    return true
+  }
+
+  function setupInitialSubscriptions() {
+    const sub = relayPool.sub(initialSubscriptions, relays)
+    const chatActions = useStore.getState().chatActions
+    const addEvent = useStore.getState().addEvent
+    sub.onevent((event: NostrEvent) => {
+      handleEvent(event, {
+        addChannel: chatActions.addChannel,
+        addEvent,
+        addMessage: chatActions.addMessage,
+      })
+    })
+    setSubscription(sub)
+    return sub
+  }
+
+  function subscribe(filters: Filter[]) {
+    relayPool.sub(filters, relays)
+  }
+
+  function publish(event: NostrEvent): boolean {
+    try {
+      if (!event.id) {
+        event.id = getEventHash(event as Event)
+      }
+      if (!event.sig) {
+        if (!privateKeyState) {
+          throw new Error('Cannot sign event, private key not set')
+        }
+        event.sig = signEvent(event as Event, privateKeyState)
+      }
+      if (!validateEvent(event)) {
+        throw new Error('Invalid event')
+      }
+      relayPool.publish(event as Event, relays)
+      return true
+    } catch (e: any) {
+      console.log(e)
+      return false
+    }
+  }
+
+  function setKeys(publicKey: string, privateKey: string) {
+    setPublicKey(publicKey)
+    setPrivateKey(privateKey)
+  }
+
+  return {
+    loadFirstPaint,
+    setupInitialSubscriptions,
+    subscribe,
+    publish,
+    setKeys,
+    publicKey: publicKeyState,
+    privateKey: privateKeyState,
+    relayPool,
+    subscription,
+  }
+}

src/lib/hooks/useUserMetadataForMessages.ts

@@ -1,6 +1,6 @@
-import { ChannelMessage } from 'app/stores/types'
 import { SimplePool } from 'nostr-tools'
-import { useState, useEffect, useMemo } from 'react'
+import { useEffect, useMemo, useState } from 'react'
+import { ChannelMessage } from 'stores/types'
 import { generateRandomPlacekitten } from '../utils'
 
 const relays = [