🪨 Anime Characters

Author: adenlall

components/@HooKit/Characters/Entry.tsx

@@ -1,7 +1,7 @@
-import { AnimeCharacterEntryFragment } from "@/generated/graphql";
-import gql from 'graphql-tag'; ;
-import { formated } from "@/utils/helpers";
+import gql from 'graphql-tag';;
 import { LoveIcon } from "../AnimeDetails/Stats";
+import { formated } from "@/utils/helpers";
+import { AnimeCharacterEntryFragment } from '@/lib/types/anilist';
 
 export const ANIME_CHARACTER_ENTRY = gql`
 fragment AnimeCharacterEntry on CharacterEdge {

components/@HooKit/Characters/Swipe.tsx

@@ -1,6 +1,6 @@
-import { AnimeCharactersListFragment } from '@/generated/graphql';
 import gql from 'graphql-tag';
 import Entry, { ANIME_CHARACTER_ENTRY } from './Entry';
+import { AnimeCharactersFragment, AnimeCharactersListFragment } from '@/lib/types/anilist';
 
 
 export const ANIME_CHARACTERS_LIST = gql`
@@ -17,7 +17,7 @@ export default function Swipe({ data }: { data: AnimeCharactersListFragment }) {
         return
     }
     return <div className='flex overflow-x-scroll gap-3'>
-        {data.edges?.map((char, index) => (
+        {data.edges?.map((char: any, index: number) => (
             <Entry key={index} data={{ node: char?.node, voiceActors: char?.voiceActors }} />
         ))}
     </div>

components/@HooKit/Characters/index.tsx

@@ -1,8 +1,7 @@
 import PersonsIcon from '~icons/gravity-ui/persons'
-import gql from 'graphql-tag'; 
-import { AnimeCharactersFragment } from '@/generated/graphql';
+import gql from 'graphql-tag';
 import Swipe, { ANIME_CHARACTERS_LIST } from './Swipe';
-import { getDictionary } from '@/app/[lang]/dictionaries';
+import { AnimeCharactersFragment } from '@/lib/types/anilist';
 
 export const ANIME_CHARACTERS = gql`
 fragment AnimeCharacters on Media {
@@ -20,10 +19,9 @@ export default async function Characters({ data }: { data: AnimeCharactersFragme
     if (!data?.characters?.edges) {
         return
     }
-    const disc = await getDictionary('helpers');
     return <div className="bg-base-200 p-3 my-4 rounded-lg">
         <div className='flex items-center gap-2 mb-2'>
-            <PersonsIcon /><h2>{disc?.characters} {data.title?.userPreferred ?? 'Anime'}</h2>
+            <PersonsIcon /><h2>{data.title?.userPreferred ?? 'Anime'} Characters</h2>
         </div>
         <Swipe data={{ edges: data.characters.edges }} />
     </div>;