Tristan
Tristan
PostsComments
CCConvex Community
Created by Tristan on 9/7/2024 in #support-community
Remix and preloadQuery or alternatives
This works great, thanks. The simple fix is just to set the NEXT_PUBLIC_CONVEX_URL=$CONVEX_URL so you don't always have to manually pass it. The things that would make this smoother for Remix would be to move preloadQuery out of convex/nextjs or have a remix equivalent, and default to CONVEX_URL or both if you're keeping packages together. There is still a type error that happens when using usePreloadedQuery from the objected returned from useLoaderData but I believe this is a remix issue. Here's a working example in case it's helpful (NEXT_PUBLIC_CONVEX_URL is set in .env.local) to others in the future: 
import type { LoaderFunction, TypedResponse } from "@remix-run/node";
import { json, useLoaderData } from "@remix-run/react";
import { api } from "convex/_generated/api";
import { preloadQuery } from "convex/nextjs";
import { usePreloadedQuery } from "convex/react";

// Fixes type error when passing return value of useLoaderData to usePreloadedQuery
// https://github.com/remix-run/remix/issues/8874#issuecomment-1969029983
type ExtractGeneric<Type> = Type extends TypedResponse<infer X> ? X : never;
function useDataFromLoader<T extends LoaderFunction>() {
  return useLoaderData() as ExtractGeneric<Awaited<ReturnType<T>>>;
}

export async function loader() {
  const tasks = await preloadQuery(api.tasks.get);
  return json({ tasks });
}

export default function Index() {
  const preload = useDataFromLoader<typeof loader>();
  const tasks = usePreloadedQuery(preload.tasks);
  return <div>{JSON.stringify(tasks)}</div>;
}
import type { LoaderFunction, TypedResponse } from "@remix-run/node";
import { json, useLoaderData } from "@remix-run/react";
import { api } from "convex/_generated/api";
import { preloadQuery } from "convex/nextjs";
import { usePreloadedQuery } from "convex/react";

// Fixes type error when passing return value of useLoaderData to usePreloadedQuery
// https://github.com/remix-run/remix/issues/8874#issuecomment-1969029983
type ExtractGeneric<Type> = Type extends TypedResponse<infer X> ? X : never;
function useDataFromLoader<T extends LoaderFunction>() {
  return useLoaderData() as ExtractGeneric<Awaited<ReturnType<T>>>;
}

export async function loader() {
  const tasks = await preloadQuery(api.tasks.get);
  return json({ tasks });
}

export default function Index() {
  const preload = useDataFromLoader<typeof loader>();
  const tasks = usePreloadedQuery(preload.tasks);
  return <div>{JSON.stringify(tasks)}</div>;
}
8 replies
CCConvex Community
Created by Tristan on 9/7/2024 in #support-community
Remix and preloadQuery or alternatives
Thanks, totally understood. I was half using this to test remix. Is preloadQuery some complex thing or is it just a particular data structure for serialized data and subscription?
8 replies
CCConvex Community
Created by Tristan on 3/17/2023 in #general
Scalability
Ok, cool. I just wanted to get a vague sense right now and that's perfect.
4 replies
CCConvex Community
Created by Tristan on 3/1/2023 in #general
Deploy Preview Environments
Got it. That's what I was thinking of doing, but it has downsides obviously. It would be cool to be able to create ephemeral deployments, perhaps that only live max 7 days or something.
43 replies
CCConvex Community
Created by Tristan on 2/10/2023 in #general
Small newbie docs feedback I d add a
Another one... For the quickstart, up until now I thought convex functions all needed to export default (e.g. listSubmissions, but reading your newer blog posts I know realize I can organize functions into logical groups (e.g. submissions:list). I like this new style a lot better.
3 replies
CCConvex Community
Created by Tristan on 2/10/2023 in #general
I m hitting an issue where Jest tests in
It does seem nice. Now I'm trying to understanding the vite vs turbopack communities...
33 replies
CCConvex Community
Created by Tristan on 2/10/2023 in #general
I m hitting an issue where Jest tests in
FWIW, vitest did work out of the box for me. I'll give that a spin for now. It looks like jest runs tests within the vm module, which causes some issue for node-fetch.
33 replies
CCConvex Community
Created by Tristan on 2/10/2023 in #general
I m hitting an issue where Jest tests in
Interesting. Yes I’m on 18.
33 replies
CCConvex Community
Created by Tristan on 2/10/2023 in #general
I m hitting an issue where Jest tests in
@tom here's a repro https://github.com/tristanz/convex-ts-jest
33 replies
CCConvex Community
Created by Tristan on 2/10/2023 in #general
I m hitting an issue where Jest tests in
I'll see if I can quickly pull out something standalone
33 replies
CCConvex Community
Created by Tristan on 2/10/2023 in #general
I m hitting an issue where Jest tests in
Yeah. I don't think that's issue since I can comment out the API import and avoid the generated code and I still see the error.
33 replies
CCConvex Community
Created by Tristan on 2/10/2023 in #general
I m hitting an issue where Jest tests in
I'm assuming the convex/tsconfig.json can be ignored?
33 replies
CCConvex Community
Created by Tristan on 2/10/2023 in #general
I m hitting an issue where Jest tests in
I'm not currently using Next for this. I started with the Turborepo Next.js starter but am just doing this in a library. The tsconfig is 
{
  "$schema": "https://json.schemastore.org/tsconfig",
  "display": "Default",
  "compilerOptions": {
    "composite": false,
    "declaration": true,
    "declarationMap": true,
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true,
    "inlineSources": false,
    "isolatedModules": true,
    "moduleResolution": "node",
    "noUnusedLocals": false,
    "noUnusedParameters": false,
    "preserveWatchOutput": true,
    "skipLibCheck": true,
    "strict": true
  },
  "exclude": ["node_modules"]
}
{
  "$schema": "https://json.schemastore.org/tsconfig",
  "display": "Default",
  "compilerOptions": {
    "composite": false,
    "declaration": true,
    "declarationMap": true,
    "esModuleInterop": true,
    "forceConsistentCasingInFileNames": true,
    "inlineSources": false,
    "isolatedModules": true,
    "moduleResolution": "node",
    "noUnusedLocals": false,
    "noUnusedParameters": false,
    "preserveWatchOutput": true,
    "skipLibCheck": true,
    "strict": true
  },
  "exclude": ["node_modules"]
}
33 replies
CCConvex Community
Created by Tristan on 2/10/2023 in #general
I m hitting an issue where Jest tests in
no luck
33 replies
CCConvex Community
Created by Tristan on 2/10/2023 in #general
I m hitting an issue where Jest tests in
/** @type {import('ts-jest').JestConfigWithTsJest} */
module.exports = {
  preset: "ts-jest",
  testEnvironment: "node",
};
/** @type {import('ts-jest').JestConfigWithTsJest} */
module.exports = {
  preset: "ts-jest",
  testEnvironment: "node",
};
33 replies
CCConvex Community
Created by Tristan on 2/10/2023 in #general
I m hitting an issue where Jest tests in
I did try a few different tsconfig settings to see if that helped, but understanding tsconfig these days is tough.
33 replies
CCConvex Community
Created by Tristan on 2/10/2023 in #general
I m hitting an issue where Jest tests in
Yeah Typescript. Currently using ts-jest.
33 replies