ThallesComH•2w ago

How would you architect this in Convex?

Hey, I'm trying out Convex in a learning project, a simple streaming service, and I'm wondering how would you deal with fetching external movie metadata (tmdb in this case), is syncing the best option or should I go with the action route? And for the action, do I really need to create a empty useEffect to call the action? Here's what I thought so far:

import { ActionCache } from "@convex-dev/action-cache";
import { Movie, TMDB } from "tmdb-ts";
import { components, internal } from "./_generated/api";
import { action, internalAction } from "./_generated/server";

const cache = new ActionCache(components.actionCache, {
    action: internal.movies.getPopularMoviesFromTMDB,
})

export const getPopularMovies = action({
  args: {},
  handler: async (ctx): Promise<Movie[]> => {
    const result = await cache.fetch(ctx, {});

    return result;
  },
});

export const getPopularMoviesFromTMDB = internalAction({
  args: {},
  handler: async (ctx) => {
    const tmdb = new TMDB(process.env.TMDB_ACCESS_TOKEN!);

    const popularMovies = await tmdb.movies.popular();

    return popularMovies.results;
  },
});

import { ActionCache } from "@convex-dev/action-cache";
import { Movie, TMDB } from "tmdb-ts";
import { components, internal } from "./_generated/api";
import { action, internalAction } from "./_generated/server";

const cache = new ActionCache(components.actionCache, {
    action: internal.movies.getPopularMoviesFromTMDB,
})

export const getPopularMovies = action({
  args: {},
  handler: async (ctx): Promise<Movie[]> => {
    const result = await cache.fetch(ctx, {});

    return result;
  },
});

export const getPopularMoviesFromTMDB = internalAction({
  args: {},
  handler: async (ctx) => {
    const tmdb = new TMDB(process.env.TMDB_ACCESS_TOKEN!);

    const popularMovies = await tmdb.movies.popular();

    return popularMovies.results;
  },
});

2 Replies

Convex Bot•2w ago

Thanks for posting in <#1088161997662724167>. Reminder: If you have a Convex Pro account, use the Convex Dashboard to file support tickets. - Provide context: What are you trying to achieve, what is the end-user interaction, what are you seeing? (full error message, command output, etc.) - Use search.convex.dev to search Docs, Stack, and Discord all at once. - Additionally, you can post your questions in the Convex Community's <#1228095053885476985> channel to receive a response from AI. - Avoid tagging staff unless specifically instructed. Thank you!

Clever Tagline•2w ago

is syncing the best option or should I go with the action route

Not sure what you mean. Could you elaborate?

And for the action, do I really need to create a empty useEffect to call the action?

You can call the action from wherever makes the most sense for your app. useEffect works, but it's not the only way. In an app I'm building for work, I've got a couple of action calls in custom hooks, and another in a regular function inside a component.

How would you architect this in Convex?

Did you find this page helpful?