migrate to typescript

1 files changed, 58 insertions, 0 deletions

diff --git a/components/anime/mobile/reused/infoChip.tsx b/components/anime/mobile/reused/infoChip.tsx
new file mode 100644
index 0000000..80ebf83
--- /dev/null
+++ b/components/anime/mobile/reused/infoChip.tsx
@@ -0,0 +1,58 @@
+import React, { CSSProperties, FC } from "react";
+import { getFormat } from "@/utils/getFormat";
+
+interface Info {
+  episodes?: number;
+  averageScore?: number;
+  format?: string;
+  status?: string;
+}
+
+interface InfoChipProps {
+  info: Info;
+  color: any;
+  className: string;
+}
+
+const InfoChip: FC<InfoChipProps> = ({ info, color, className }) => {
+  return (
+    <div
+      className={`flex-wrap w-full justify-start md:pt-1 gap-4 ${className}`}
+    >
+      {info?.episodes && (
+        <div
+          className={`dynamic-text rounded-md px-2 font-karla font-bold`}
+          style={color}
+        >
+          {info?.episodes} Episodes
+        </div>
+      )}
+      {info?.averageScore && (
+        <div
+          className={`dynamic-text rounded-md px-2 font-karla font-bold`}
+          style={color}
+        >
+          {info?.averageScore}%
+        </div>
+      )}
+      {info?.format && (
+        <div
+          className={`dynamic-text rounded-md px-2 font-karla font-bold`}
+          style={color}
+        >
+          {getFormat(info?.format)}
+        </div>
+      )}
+      {info?.status && (
+        <div
+          className={`dynamic-text rounded-md px-2 font-karla font-bold`}
+          style={color}
+        >
+          {info?.status}
+        </div>
+      )}
+    </div>
+  );
+};
+
+export default InfoChip;