Refactor to external scraper and update dependencies (#113)

components/LangSelect.tsx

@@ -1,14 +1,18 @@
 import { FC, ChangeEvent } from "react";
 import { Select } from "@chakra-ui/react";
+import { LangCode } from "lingva-scraper";
 
 type Props = {
     value: string,
     onChange: (e: ChangeEvent<any>) => void,
-    langs: [string, string][],
+    langs: {
+        [code in LangCode]: string
+    },
+    detectedSource?: LangCode<"source">,
     [key: string]: any
 };
 
-const LangSelect: FC<Props> = ({ value, onChange, langs, ...props }) => (
+const LangSelect: FC<Props> = ({ value, onChange, langs, detectedSource, ...props }) => (
     <Select
         value={value}
         onChange={onChange}
@@ -18,8 +22,10 @@ const LangSelect: FC<Props> = ({ value, onChange, langs, ...props }) => (
         style={{ textAlignLast: "center" }}
         {...props}
     >
-        {langs.map(([code, name]) => (
-            <option value={code} key={code}>{name}</option>
+        {Object.entries(langs).map(([code, name]) => (
+            <option value={code} key={code}>
+                {name}{code === "auto" && !!detectedSource && ` (${langs[detectedSource]})`}
+            </option>
         ))}
     </Select>
 );