Son Posts - Answer Overflow

•Created by Son on 9/1/2024 in #support-community

Convex Monorepo Issue (react-dom native)

9 replies

•Created by Son on 6/21/2024 in #support-community

auto incremented int?

Is there a auto incremented int capability that is tracked internally by the database i could use? I don’t want to use a custom v.id, I need a int that increments for every new document added as well as having the standard v.id. Is this possible?

6 replies

•Created by Son on 6/17/2024 in #support-community

How to use useMutation with convex-ents. API object TYPE error

in my frontend i'm calling this api const storeUser = useMutation(api.users.store); but i get this type error. the function still runs and works as expected.

Property 'users' does not exist on type '{ clerkBackend: { AdminGetUserList: FunctionReference<"action", "public", {}, { id: string; email: string | undefined; firstName: string | null; }[] | null>; }; messageActions: { ...; }; }'

it cannot find the api because i have replaced... // import { mutation, query } from './_generated/server'; with import { mutation } from './functions'; this is part of my functions.ts

import { entsTableFactory } from 'convex-ents';
import {
  customCtx,
  customMutation,
  customQuery
} from 'convex-helpers/server/customFunctions';
import { GenericDatabaseReader, GenericDatabaseWriter } from 'convex/server';
import { DataModel } from './_generated/dataModel';
import {
  internalMutation as baseInternalMutation,
  internalQuery as baseInternalQuery,
  mutation as baseMutation,
  query as baseQuery
} from './_generated/server';
import { entDefinitions } from './schema';
import { MutationCtx } from './types';

type LegacyTables = 'messages' | 'emailList' | 'users';

export const query = customQuery(
  baseQuery,
  customCtx(async (ctx) => {
    return {
      table: entsTableFactory(ctx, entDefinitions),
      db: ctx.db as unknown as GenericDatabaseReader<
        Pick<DataModel, LegacyTables>
      >
    };
  })
);

export const mutation = customMutation(
  baseMutation,
  customCtx(async (ctx) => {
    return {
      table: entsTableFactory(ctx, entDefinitions),
      db: ctx.db as GenericDatabaseWriter<Pick<DataModel, LegacyTables>>
    };
  })
);

import { entsTableFactory } from 'convex-ents';
import {
  customCtx,
  customMutation,
  customQuery
} from 'convex-helpers/server/customFunctions';
import { GenericDatabaseReader, GenericDatabaseWriter } from 'convex/server';
import { DataModel } from './_generated/dataModel';
import {
  internalMutation as baseInternalMutation,
  internalQuery as baseInternalQuery,
  mutation as baseMutation,
  query as baseQuery
} from './_generated/server';
import { entDefinitions } from './schema';
import { MutationCtx } from './types';

type LegacyTables = 'messages' | 'emailList' | 'users';

export const query = customQuery(
  baseQuery,
  customCtx(async (ctx) => {
    return {
      table: entsTableFactory(ctx, entDefinitions),
      db: ctx.db as unknown as GenericDatabaseReader<
        Pick<DataModel, LegacyTables>
      >
    };
  })
);

export const mutation = customMutation(
  baseMutation,
  customCtx(async (ctx) => {
    return {
      table: entsTableFactory(ctx, entDefinitions),
      db: ctx.db as GenericDatabaseWriter<Pick<DataModel, LegacyTables>>
    };
  })
);

how can i fix this? As soon as put this back in

`// import { mutation, query } from './_generated/server';

`// import { mutation, query } from './_generated/server';

` everything works.

19 replies

•Created by Son on 5/24/2024 in #questions

expo app production logging solutions

Hey, What are the axiom (logging) sentry.io (error logging) equivalents for expo apps?

8 replies

•Created by Son on 4/4/2024 in #questions

User Privacy Question

Say i have an app which the premise that it offers a safe place for users to “log” sensitive personal data they might not want the world to know about their commitments to various things. Over the long run I would want to organise manage and use this data for many purposes, one being to approach individuals who meet whatever criteria i have set up according to the data. Maybe to sell them services or learn from them. How would one go about user anonymity but still be able to link “logs” to users. Is this feasible? I would like to say “your logs are encrypted and cannot be read by just anyone” but at the end of the day an engineer would be able to link the user to their data by decryption. Is this acceptablet?

18 replies

•Created by Son on 2/7/2024 in #support-community

Best practise for setting user metaData with clerk and convex

would best practise to use an action? i have my convex code in a separate package, that is consumed by my a couple next.js apps. https://clerk.com/docs/users/metadata

6 replies

•Created by Son on 2/1/2024 in #support-community

Using crypto in convex functions

7 replies

•Created by Son on 1/31/2024 in #support-community

isAuthenticated is always false (Expo)

47 replies

•Created by Son on 10/18/2023 in #questions

Can you programmatically reload an expo app?

I have to re-initialize a data structure in my expo managed app (SDK 49) so i need to reload the app. Everything works in development (IOS dev build) , i hit a button and the app reloads. But in production, nothing happens. Is there anything i need to do differently in production I’m only using this function to manually reload the app not to deliver any updates just yet. Updates.reloadAsync() from expo-updates i keep getting code ERR_FUNCTION_CALL in production, my code:

setTimeout(() => {

          (async () => {
            if (__DEV__) {
              DevSettings.reload()
              return
            }
            try {
              const res = await Updates.reloadAsync()
              console.log('res',res)
              Alert.alert('res',JSON.stringify(res))
            } catch (error) {
              Alert.alert('error',JSON.stringify(error))
            }
          })();

        },100);

setTimeout(() => {

          (async () => {
            if (__DEV__) {
              DevSettings.reload()
              return
            }
            try {
              const res = await Updates.reloadAsync()
              console.log('res',res)
              Alert.alert('res',JSON.stringify(res))
            } catch (error) {
              Alert.alert('error',JSON.stringify(error))
            }
          })();

        },100);

2 replies

•Created by Son on 5/19/2023 in #questions

Are sever components running on an actual sever? Can someone explain?

Next js question. Why can’t we import sever components into client components directly? I know we can pass sever components as props, but why only this way? And are the actual sever components running on an actual sever? Can someone explain?

8 replies

•Created by Son on 5/14/2023 in #❓-help

Is this blog correct? Trpc and next.js 13.4, App directory

I working on integrating with TRPC with the App directory and was given a solution but i'm not sure if the author or myself have the right understanding of how server components work with client components. The scenario: By adding the ‘use client’ directive in the route app layout file which the author suggests, wouldn't that mean all children components would become client-side components, so we would loose the benefits of server components? I was referring to this line in the blog specifically “This can be achieved by wrapping the provider around the {children} node in the src/app/layout.tsx file, which is the main entry point of the application.“ So this would mean next would render all children components as client components, as the provider would have to be at the root of the tree. Meaning are whole app would basically be a client side rendered app? https://codevoweb.com/setup-trpc-server-and-client-in-nextjs-13-app-directory/#comment-1755 I got a response from the blog author “I understand your point now. It's important to note that Client Components can be rendered within Server Components as long as the "use client"; pragma is included in the files that have the Client Components. Wrapping the tRPC provider around the prop of the root layout component allows Next.js to make the hooks and components from the tRPC library available to all Client Components that are descendants of the root layout component. It's important to remember that even though you've wrapped a provider component that has the "use client"; pragma around the prop of the root layout component, Next.js will still render all components inside the app directory as Server Components. This means that the only way all your components will be Client Components is if you include the "use client"; directive at the beginning of the files that contain them. I hope this explanation clarifies things for you. If you have any further questions, please don't hesitate to ask.”

3 replies

•Created by Son on 3/21/2023 in #❓-help

How to call useQuery with params inside JSX

How can i achieve this? Thanks

export function MemberQueryList({ list }: Props) {
  
function checkIsOwner(housingAssociationId: string, memberId: string) {
    const isOwner = trpc.housingAssociation.checkIfOwner.useQuery({
      housingAssociationId,
      memberId,
    });

    return isOwner.data?.ok ?? false;
  }
  const navigate = useNavigate();
  const userId = getSubFromLocalStorage() ?? "";
  return (
    <div>
      {list.map((housingAssociation: listData) => {
        const isOwner = checkIsOwner(housingAssociation.id, housingAssociation.userId);
        return (
          <BoardCard
            key={housingAssociation.id}
            onClick={() => {
              navigate(
                `/housing_associations/association?name=${housingAssociation.name}&id=${housingAssociation.id}`
              );
            }}
            state={housingAssociation}
            isOwner={isOwner}
          />
        );
      })}
    </div>
  );
}

export function MemberQueryList({ list }: Props) {
  
function checkIsOwner(housingAssociationId: string, memberId: string) {
    const isOwner = trpc.housingAssociation.checkIfOwner.useQuery({
      housingAssociationId,
      memberId,
    });

    return isOwner.data?.ok ?? false;
  }
  const navigate = useNavigate();
  const userId = getSubFromLocalStorage() ?? "";
  return (
    <div>
      {list.map((housingAssociation: listData) => {
        const isOwner = checkIsOwner(housingAssociation.id, housingAssociation.userId);
        return (
          <BoardCard
            key={housingAssociation.id}
            onClick={() => {
              navigate(
                `/housing_associations/association?name=${housingAssociation.name}&id=${housingAssociation.id}`
              );
            }}
            state={housingAssociation}
            isOwner={isOwner}
          />
        );
      })}
    </div>
  );
}

6 replies

•Created by Son on 1/31/2023 in #questions

I have an infinite loop within my hook but app works as expected, i'm confused...

when i console log inside this hook, it repeats non-stop every few seconds, but my app is working as expected there is no infinite loop per say. i'm really confused with this one.

import zustand from ...

export function useGetTickets(tenantId?: any) {
  const setTickets = useTicketStore((state) => state.setTickets);
  const isApiError = useTicketStore((state) => state.isApiError);
  const setIsApiError = useTicketStore((state) => state.setIsApiError);

  const { isLoading, isError, data } =
    trpc.getTicketsWithPhotos.getAll.useQuery(undefined, {
      onSuccess: (data) => {
        console.log("data", data);
        setIsApiError(false);
        setTickets(data.tickets);
      },
      onError: (e) => {
        showToastCustomError(
          "Sever Error",
          "We cannot connect to our servers, please try again later or contact support",
          8000
        );
        setIsApiError(true);
        return console.error(e.message);
      },
    });

  return { data, isLoading, isApiError };
}

import zustand from ...

export function useGetTickets(tenantId?: any) {
  const setTickets = useTicketStore((state) => state.setTickets);
  const isApiError = useTicketStore((state) => state.isApiError);
  const setIsApiError = useTicketStore((state) => state.setIsApiError);

  const { isLoading, isError, data } =
    trpc.getTicketsWithPhotos.getAll.useQuery(undefined, {
      onSuccess: (data) => {
        console.log("data", data);
        setIsApiError(false);
        setTickets(data.tickets);
      },
      onError: (e) => {
        showToastCustomError(
          "Sever Error",
          "We cannot connect to our servers, please try again later or contact support",
          8000
        );
        setIsApiError(true);
        return console.error(e.message);
      },
    });

  return { data, isLoading, isApiError };
}

3 replies

•Created by Son on 1/31/2023 in #❓-help

i have an infinite loop within my hook but apps works as expected.

when i console log inside this hook, it repeats non-stop every few seconds, but my app is working as expected there is no infinite loop per say. i'm really confused with this one.

import zustand from ...

export function useGetTickets(tenantId?: any) {
  const setTickets = useTicketStore((state) => state.setTickets);
  const isApiError = useTicketStore((state) => state.isApiError);
  const setIsApiError = useTicketStore((state) => state.setIsApiError);

  const { isLoading, isError, data } =
    trpc.getTicketsWithPhotos.getAll.useQuery(undefined, {
      onSuccess: (data) => {
        console.log("data", data);
        setIsApiError(false);
        setTickets(data.tickets);
      },
      onError: (e) => {
        showToastCustomError(
          "Sever Error",
          "We cannot connect to our servers, please try again later or contact support",
          8000
        );
        setIsApiError(true);
        return console.error(e.message);
      },
    });

  return { data, isLoading, isApiError };
}

import zustand from ...

export function useGetTickets(tenantId?: any) {
  const setTickets = useTicketStore((state) => state.setTickets);
  const isApiError = useTicketStore((state) => state.isApiError);
  const setIsApiError = useTicketStore((state) => state.setIsApiError);

  const { isLoading, isError, data } =
    trpc.getTicketsWithPhotos.getAll.useQuery(undefined, {
      onSuccess: (data) => {
        console.log("data", data);
        setIsApiError(false);
        setTickets(data.tickets);
      },
      onError: (e) => {
        showToastCustomError(
          "Sever Error",
          "We cannot connect to our servers, please try again later or contact support",
          8000
        );
        setIsApiError(true);
        return console.error(e.message);
      },
    });

  return { data, isLoading, isApiError };
}

6 replies

•Created by Son on 1/27/2023 in #questions

Expo-Camera Bug Affecting Android only

1 replies

•Created by Son on 12/11/2022 in #❓-help

trpc hook pattern. This works, but I’m not convinced…

I want to call my route when a button is clicked and have access to isLoading, onError etc… I have implemented a pattern using ‘’refetch()’’ but it doesn’t feel ‘correct’ is there a better way of doing this. I will also create a custom hook out of it. ‘’’js const { refetch } = trpc.authDomain.signIn.useQuery( { email: userEmail }, { enabled: false, onError: (e: any) => { console.log('there was an error with the endpoint'); }, } ); async function isEmailVerified() { const response = await refetch(); const verification = response.data; // i want to access isLoading directly without writing many lines of new code which i would have to with this current approach if (verification?.status === 'tryAgain') { console.log('email not verified'); setHasInitiatedSignIn(true); } if (verification?.status === 'ok') { console.log('user can now verify code sent to their email address'); setHasInitiatedSignIn(true); } } Return <button onClick={isEmailVerified}/> ‘’’

7 replies

•Created by Son on 12/7/2022 in #❓-help

correct way to call TRPC inside a function

13 replies