montezume

import React, { useState } from "react";
import { useQuery, UseQueryResult } from "react-query";

type Repo = {
  id: number,
  name: string,
  url: string,
};

export const RepoList = () => {

montezume

import { useRouter } from 'next/router';
import { useProfile } from '../../hooks/useProfile';
import { useBlogPost } from '../../hooks/useBlogPost';
import { BlogPost } from '../../components/BlogPost';
import { BlogPostSkeleton } from '../../components/BlogPostSkeleton';
import { BlogPostFallback } from '../../components/BlogPostFallback';

export default function BlogPostPage() {
  const { query } = useRouter();

montezume

import { useRouter } from 'next/router';
import { useProfile } from '../../hooks/useProfile';
import { useBlogPost } from '../../hooks/useBlogPost';
import { BlogPost } from '../../components/BlogPost';
import { BlogPostSkeleton } from '../../components/BlogPostSkeleton';
import { BlogPostFallback } from '../../components/BlogPostFallback';

export default function BlogPostPage() {
  const { query } = useRouter();

montezume

import { useRouter } from 'next/router';
import { useBlogPost } from '../../hooks/useBlogPost';
import { BlogPost } from '../../components/BlogPost';
import { BlogPostSkeleton } from '../../components/BlogPostSkeleton';
import { BlogPostFallback } from '../../components/BlogPostFallback';

export default function BlogPostPage() {
  const { query } = useRouter();

  const { data: blogPost, error: blogPostError } = useBlogPost(query.id);

montezume

import { useRouter } from 'next/router';
import { useBlogPost } from '../../hooks/useBlogPost';
import { BlogPost } from '../../components/BlogPost';
import { BlogPostSkeleton } from '../../components/BlogPostSkeleton';
import { BlogPostFallback } from '../../components/BlogPostFallback';

export default function BlogPostPage() {
  const { query } = useRouter();

  const { data: blogPost, error: blogPostError } = useBlogPost(

montezume

import { useRouter } from 'next/router';
import { useProfile } from '../../hooks/useProfile';
import { useBlogPost } from '../../hooks/useBlogPost';
import { BlogPost } from '../../components/BlogPost';
import { BlogPostSkeleton } from '../../components/BlogPostSkeleton';
import { BlogPostFallback } from '../../components/BlogPostFallback';

export default function BlogPostPage() {
  const { query } = useRouter();

montezume

import useSWR from 'swr';
import { fetcher } from '../utils/fetcher';
import type { TUserProfile } from '../types';

export const useProfile = (id?: string) =>
  useSWR<TUserProfile>(() => {
    if (id) {
      return `/api/users/${id}`;
    }

montezume

test('renders balances correctly', async () => {
  render(<App />);
  await waitFor(() => expect(screen.getByTestId('loading-skeleton')).not.toBeInTheDocument());
  expect(screen.getByLabelText(/Total/)).toHaveTextContent('$100.00');
});

montezume

test('renders balances correctly', () => {
  render(<App />);
  expect(screen.getByLabelText(/Total/)).toHaveTextContent('$100.00');
});

montezume

const Balance = ({balance}: {balance: string}) => (
  <div>
    <span id="total">Total: </span>
    <span aria-labelledby="total">{balance}</span>
  </div>
);