progress

src/components/Common/PostCard/PostDownvoteButton.tsx

@@ -1,5 +1,5 @@
 import React, { useCallback } from 'react';
-import instance from '@api/Instance';
+import instance from '@src/Instance';
 import { usePostMyVote } from '@src/state/post/postStore';
 import AnimatedIconButton from '@components/Common/Button/AnimatedIconButton';
 import { ArrowDown } from '@tamagui/lucide-icons';

src/components/Common/PostCard/PostUpvoteButton.tsx

@@ -1,5 +1,5 @@
 import React, { useCallback } from 'react';
-import instance from '@api/Instance';
+import instance from '@src/Instance';
 import { usePostMyVote } from '@src/state/post/postStore';
 import AnimatedIconButton from '@components/Common/Button/AnimatedIconButton';
 import { ArrowUp } from '@tamagui/lucide-icons';

src/components/Common/SwipeableRow/LeftOptions.tsx

@@ -15,16 +15,16 @@ import { StyleSheet } from 'react-native';
 import { playHaptic } from '@helpers/haptics';
 import { SwipeableActionParams } from '@components/Common/SwipeableRow/actions';
 import { useSwipeableRow } from '@components/Common/SwipeableRow/SwipeableRowProvider';
-import { UsePostSwipeOptions } from '@components/Common/SwipeableRow/hooks/usePostSwipeOptions';
 import { IconMap, IconType } from '@src/types/IconMap';
 import { styled } from 'tamagui';
+import { ISwipeableOptions } from '@components/Common/SwipeableRow/types';
 
 type Stops = [first: number, second: number];
 const DEFAULT_STOPS: Stops = [75, 150];
 const [firstStop, secondStop] = DEFAULT_STOPS;
 
 interface Props {
-  options: UsePostSwipeOptions;
+  options: ISwipeableOptions;
   flipFlop?: boolean;
   actionParams: SwipeableActionParams;
 }
@@ -47,6 +47,18 @@ export function LeftOptions({
 
   const [icon, setIcon] = useState<IconType | undefined>(icons.first);
 
+  // We need to do this because functions passed from a worklet using runOnJS are converted to objects
+  const runAction = useCallback(
+    (actionType: 'first' | 'second') => {
+      if (actionType === 'first' && actions.first != null) {
+        actions.first(actionParams);
+      } else if (actionType === 'second' && actions.second != null) {
+        actions.second(actionParams);
+      }
+    },
+    [options.actions],
+  );
+
   const RenderIcon = useMemo(
     () =>
       icon != null
@@ -75,12 +87,12 @@ export function LeftOptions({
           if (translateX.value >= secondStop) {
             if (actions.second == null) return;
 
-            runOnJS(actions.second)(actionParams);
+            runOnJS(runAction)('second');
             runOnJS(resetIcon)();
           } else if (translateX.value >= firstStop) {
             if (actions.first == null) return;
 
-            runOnJS(actions.first)(actionParams);
+            runOnJS(runAction)('first');
             runOnJS(resetIcon)();
           }
           isFrozen.value = true;

src/components/Common/SwipeableRow/RightOptions.tsx

@@ -17,15 +17,15 @@ import { playHaptic } from '@helpers/haptics';
 import { IconMap, IconType } from '@src/types/IconMap';
 import { styled } from 'tamagui';
 import { SwipeableActionParams } from '@components/Common/SwipeableRow/actions';
-import { UsePostSwipeOptions } from '@components/Common/SwipeableRow/hooks/usePostSwipeOptions';
+import { ISwipeableOptions } from '@components/Common/SwipeableRow/types';
 
 type Stops = [first: number, second: number];
 const DEFAULT_STOPS: Stops = [-75, -150];
 const [firstStop, secondStop] = DEFAULT_STOPS;
 const SCREEN_WIDTH = Dimensions.get('screen').width;
 
 interface Props {
-  options: UsePostSwipeOptions;
+  options: ISwipeableOptions;
   flipFlop?: boolean;
   actionParams: SwipeableActionParams;
 }
@@ -48,6 +48,18 @@ export function RightOptions({
 
   const [icon, setIcon] = useState<IconType | undefined>(icons.first);
 
+  // We need to do this because functions passed from a worklet using runOnJS are converted to objects
+  const runAction = useCallback(
+    (actionType: 'first' | 'second') => {
+      if (actionType === 'first' && actions.first != null) {
+        actions.first(actionParams);
+      } else if (actionType === 'second' && actions.second != null) {
+        actions.second(actionParams);
+      }
+    },
+    [options.actions],
+  );
+
   const RenderIcon = useMemo(
     () =>
       icon != null
@@ -76,12 +88,13 @@ export function RightOptions({
           if (translateX.value <= secondStop) {
             if (actions.second == null) return;
 
-            runOnJS(actions.second)(actionParams);
+            // runOnJS(actions.second)(actionParams);
+            runOnJS(runAction)('second');
             runOnJS(resetIcon)();
           } else if (translateX.value <= firstStop) {
             if (actions.first == null) return;
 
-            runOnJS(actions.first)(actionParams);
+            runOnJS(runAction)('first');
             runOnJS(resetIcon)();
           }
           isFrozen.value = true;

src/components/Common/SwipeableRow/actions/downvoteCommentOption.ts

@@ -1,5 +1,5 @@
 import { SwipeableActionParams } from '@components/Common/SwipeableRow/actions/swipeableActions';
-import instance from '@api/Instance';
+import instance from '@src/Instance';
 import { playHaptic } from '@helpers/haptics';
 
 export const downvoteCommentOption = ({

src/components/Common/SwipeableRow/actions/downvotePostOption.ts

@@ -1,4 +1,4 @@
-import instance from '@api/Instance';
+import instance from '@src/Instance';
 import { SwipeableActionParams } from '@components/Common/SwipeableRow/actions/swipeableActions';
 import { playHaptic } from '@helpers/haptics';
 

src/components/Common/SwipeableRow/actions/upvoteCommentOption.ts

@@ -1,5 +1,5 @@
 import { SwipeableActionParams } from '@components/Common/SwipeableRow/actions/swipeableActions';
-import instance from '@api/Instance';
+import instance from '@src/Instance';
 import { playHaptic } from '@helpers/haptics';
 
 export const upvoteCommentOption = ({

src/components/Common/SwipeableRow/actions/upvotePostOption.ts

@@ -1,4 +1,4 @@
-import instance from '@api/Instance';
+import instance from '@src/Instance';
 import { SwipeableActionParams } from '@components/Common/SwipeableRow/actions/swipeableActions';
 import { playHaptic } from '@helpers/haptics';
 

src/components/Feed/components/Community/CommunityActionBar.tsx

@@ -1,6 +1,6 @@
 import React, { useCallback, useMemo, useState } from 'react';
 import { useCommunitySubscribed } from '@src/state/community/communityStore';
-import instance from '@api/Instance';
+import instance from '@src/Instance';
 import { isSubscribed } from '@helpers/lemmy';
 import HStack from '@components/Common/Stack/HStack';
 import ButtonOne from '@components/Common/Button/ButtonOne';

src/components/Feed/components/Community/CommunityHeader.tsx

@@ -6,7 +6,7 @@ import CommunityTitle from '@components/Feed/components/Community/CommunityTitle
 import { useNavigation, useRoute } from '@react-navigation/core';
 import { useLoadData } from '@hooks/useLoadData';
 import { GetCommunityResponse } from 'lemmy-js-client';
-import instance from '@api/Instance';
+import instance from '@src/Instance';
 import { Spinner } from 'tamagui';
 import {
   useCommunityBanner,

src/components/Feed/components/Feed/FeedItem.tsx

@@ -31,13 +31,12 @@ function FeedItem({ itemId }: IProps): React.JSX.Element {
     });
   }, [itemId]);
 
-  const actionParams = useMemo(
-    () => ({
+  const actionParams = useMemo(() => {
+    return {
       postId: itemId,
       navigation,
-    }),
-    [itemId],
-  );
+    };
+  }, [itemId, navigation]);
 
   return (
     <Pressable onPress={onPress} style={styles.pressable}>

src/components/Feed/components/MainFeed.tsx

@@ -1,5 +1,5 @@
 import React, { useCallback, useEffect, useMemo } from 'react';
-import instance from '@api/Instance';
+import instance from '@src/Instance';
 import VStack from '@components/Common/Stack/VStack';
 import { useRoute } from '@react-navigation/core';
 import { useFeedNextPage, useFeedPostIds } from '@src/state/feed/feedStore';

src/components/Feed/screens/FeedIndexScreen.tsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useRef, useState } from 'react';
 import { useCurrentAccount } from '@src/state/account/accountStore';
 import { IAccount } from '@src/types';
-import instance from '@api/Instance';
+import instance from '@src/Instance';
 import LoadingScreen from '@components/Common/Loading/LoadingScreen';
 import { Alert } from 'react-native';
 import MainFeed from '@components/Feed/components/MainFeed';

src/components/Navigation/MainScreens.tsx

@@ -13,6 +13,7 @@ import FeedIndexScreen from '@components/Feed/screens/FeedIndexScreen';
 import PostScreen from '@components/Post/screens/PostScreen';
 import MainFeed from '@components/Feed/components/MainFeed';
 import CommentChainScreen from '@components/Comment/screens/CommentChainScreen';
+import ReplyScreen from '@components/Reply/screens/ReplyScreen';
 
 export default function MainScreens(
   stack: TypedNavigator<
@@ -63,6 +64,17 @@ export default function MainScreens(
           }}
         />
       </stack.Group>
+      <stack.Group
+        screenOptions={{
+          presentation: 'modal',
+        }}
+      >
+        <stack.Screen
+          name="Reply"
+          component={ReplyScreen}
+          options={{ headerShown: true }}
+        />
+      </stack.Group>
     </>
   );
 }

src/components/Post/screens/PostScreen.tsx

@@ -8,7 +8,7 @@ import {
 import LoadingScreen from '@components/Common/Loading/LoadingScreen';
 import VStack from '@components/Common/Stack/VStack';
 import Post from '@components/Post/components/Post';
-import instance from '@api/Instance';
+import instance from '@src/Instance';
 import { ICommentInfo } from '@src/types';
 import CommentChain from '@components/Comment/components/CommentChain';
 import { FlatList } from 'react-native';

src/components/Reply/screens/ReplyScreen.tsx

@@ -0,0 +1,32 @@
+import React, { useEffect } from 'react';
+import { NativeStackNavigationProp } from '@react-navigation/native-stack';
+import { usePostBody } from '@src/state/post/postStore';
+import { useCommentContent } from '@src/state/comment/commentStore';
+import { ScrollView, Text } from 'tamagui';
+
+interface IProps {
+  navigation: NativeStackNavigationProp<any>;
+  route: any;
+}
+
+export default function ReplyScreen({
+  navigation,
+  route,
+}: IProps): React.JSX.Element {
+  const { postId, commentId } = route.params;
+
+  const post = usePostBody(postId);
+  const comment = useCommentContent(commentId);
+
+  useEffect(() => {
+    navigation.setOptions({
+      headerTitle: comment != null ? 'Replying to Comment' : 'Replying to Post',
+    });
+  }, [post, comment]);
+
+  return (
+    <ScrollView flex={1}>
+      <Text>Hello!</Text>
+    </ScrollView>
+  );
+}

src/hooks/comments/useCommentVoting.ts

@@ -5,7 +5,7 @@ import {
   useCommentUpvotes,
 } from '@src/state/comment/commentStore';
 import { useCallback } from 'react';
-import instance from '@api/Instance';
+import instance from '@src/Instance';
 import { playHaptic } from '@helpers/haptics';
 
 interface UseCommentVoting {

src/hooks/useLogin.ts

@@ -1,5 +1,5 @@
 import { useState } from 'react';
-import instance from '@api/Instance';
+import instance from '@src/Instance';
 import { addAccount } from '@src/state/account/actions';
 
 interface DoLoginOptions {