Create proper prisma type

app/admin/country/view/page.tsx

@@ -12,7 +12,14 @@ import {
   TableRow,
   TableHead,
 } from '@mui/material';
-import { country as CountryType } from '@prisma/client';
+
+import { Prisma } from '@prisma/client';
+type CountryType = Prisma.countryGetPayload<{
+  include: {
+    country: true;
+  };
+}>;
+
 import moment from 'moment';
 import React from 'react';
 

app/page.tsx

@@ -4,20 +4,25 @@ import Box from '@mui/material/Box';
 import Container from '@mui/material/Container';
 import Typography from '@mui/material/Typography';
 
-import appconfig from '@/appconfig';
-import { coin as CoinType } from '@prisma/client';
+import { Prisma } from '@prisma/client';
+type CoinType = Prisma.coinGetPayload<{
+  include: {
+    image: true;
+  };
+}>;
+
 import { getCoins } from '@/http/coin';
 import HomePageCoinDetail from './components/HomePageCoinDetail';
-import { Card } from '@mui/material';
+
+import appconfig from '@/appconfig';
 
 export const metadata: Metadata = {
   title: appconfig.siteName,
   description: 'Welcome to Coin Organizer site.',
 };
 
 export default async function Home() {
-  const MAX_COINS: number = 5;
-  const coins: CoinType[] = await getCoins(MAX_COINS);
+  const coins: CoinType[] = await getCoins(appconfig.numberOfCoinsOnHomepage);
 
   return (
     <main>

appconfig.ts

@@ -1,6 +1,7 @@
 const appconfig = {
   siteName: "Eric's Coins",
   siteDescription: "Eric's Coins Site.",
+  numberOfCoinsOnHomepage: 10,
   links: {
     github: "https://github.com/ericbrian/coinorganizer",
     mastadon: "https://mstdn.social/@EricBrian",

package.json

@@ -40,6 +40,7 @@
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "react-instantsearch": "^7.0.1",
+    "react-query": "^3.39.3",
     "typescript": "5.2.2"
   },
   "devDependencies": {