I have a page "src/app/article/[articleId]" and to get the data, I created another file "src/server/queries/article.ts".

import { db } from "~/server/db";

export const getArticle = async ({ id }: { id: string }) => {
  const article = await db.article.findUnique({
    where: { id },
  });

  return { article };
};

I call this function inside the page (server component). Is it safe to fetch data like this? What would happen if I called the function inside of a client conmponent?