src/utils/hooks/use-article.tsx


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36

import useSWR from 'swr';
import {
  articleBySlugQuery,
  fetchAPI,
  getArticleFromRawData,
} from '../../services/graphql';
import { type Article, type RawArticle } from '../../types';

export type UseArticleConfig = {
  /**
   * A fallback article
   */
  fallback?: Article;
  /**
   * The article slug
   */
  slug?: string;
};

/**
 * Retrieve an article by slug.
 *
 * @param {UseArticleConfig} config - The config.
 * @returns {Article|undefined} The matching article if it exists.
 */
export const useArticle = ({
  slug,
  fallback,
}: UseArticleConfig): Article | undefined => {
  const { data } = useSWR(
    slug ? { query: articleBySlugQuery, variables: { slug } } : null,
    fetchAPI<RawArticle, typeof articleBySlugQuery>
  );

  return data ? getArticleFromRawData(data.post) : fallback;
};