feat: adding resync button

src/locales/en/translation.json

@@ -167,7 +167,12 @@
     "download_options_one": "{{countFormatted}} download option",
     "download_options_other": "{{countFormatted}} download options",
     "download_source_url": "Download source URL",
-    "add_download_source_description": "Insert the URL containing the JSON file"
+    "add_download_source_description": "Insert the URL containing the JSON file",
+    "download_source_up_to_date": "Up-to-date",
+    "download_source_errored": "Errored",
+    "resync_download_sources": "Resync",
+    "removed_download_source": "Download source removed",
+    "added_download_source": "Added download source"
   },
   "notifications": {
     "download_complete": "Download complete",

src/locales/pt/translation.json

@@ -164,7 +164,12 @@
     "download_options_one": "{{countFormatted}} opcão de download",
     "download_options_other": "{{countFormatted}} opções de download",
     "download_source_url": "URL da biblioteca",
-    "add_download_source_description": "Insira a URL contendo o arquivo JSON"
+    "add_download_source_description": "Insira a URL contendo o arquivo JSON",
+    "download_source_up_to_date": "Atualizado",
+    "download_source_errored": "Falhou",
+    "resync_download_sources": "Resincronizar",
+    "removed_download_source": "Biblioteca removida",
+    "added_download_source": "Biblioteca adicionada"
   },
   "notifications": {
     "download_complete": "Download concluído",

src/main/entity/download-source.entity.ts

@@ -23,7 +23,7 @@ export class DownloadSource {
   @Column("text", { nullable: true })
   etag: string | null;
 
-  @Column("text", { default: "online" })
+  @Column("text", { default: DownloadSourceStatus.UpToDate })
   status: DownloadSourceStatus;
 
   @OneToMany(() => Repack, (repack) => repack.downloadSource, { cascade: true })

src/renderer/src/pages/settings/settings-download-sources.css.ts

@@ -8,6 +8,7 @@ export const downloadSourceField = style({
 
 export const downloadSources = style({
   padding: "0",
+  margin: "0",
   gap: `${SPACING_UNIT * 2}px`,
   display: "flex",
   flexDirection: "column",
@@ -30,8 +31,8 @@ export const downloadSourceItemHeader = style({
   gap: `${SPACING_UNIT}px`,
 });
 
-export const downloadSourceItemTitle = style({
+export const downloadSourcesHeader = style({
   display: "flex",
-  gap: `${SPACING_UNIT}px`,
+  justifyContent: "space-between",
   alignItems: "center",
 });

src/renderer/src/pages/settings/settings-download-sources.tsx

@@ -5,9 +5,10 @@ import { useTranslation } from "react-i18next";
 
 import * as styles from "./settings-download-sources.css";
 import type { DownloadSource } from "@types";
-import { NoEntryIcon, PlusCircleIcon } from "@primer/octicons-react";
+import { NoEntryIcon, PlusCircleIcon, SyncIcon } from "@primer/octicons-react";
 import { AddDownloadSourceModal } from "./add-download-source-modal";
 import { useToast } from "@renderer/hooks";
+import { DownloadSourceStatus } from "@shared";
 
 export function SettingsDownloadSources() {
   const [showAddDownloadSourceModal, setShowAddDownloadSourceModal] =
@@ -30,14 +31,19 @@ export function SettingsDownloadSources() {
 
   const handleRemoveSource = async (id: number) => {
     await window.electron.removeDownloadSource(id);
-    showSuccessToast("Removed download source");
+    showSuccessToast(t("removed_download_source"));
 
     getDownloadSources();
   };
 
   const handleAddDownloadSource = async () => {
     await getDownloadSources();
-    showSuccessToast("Download source successfully added");
+    showSuccessToast(t("added_download_source"));
+  };
+
+  const statusTitle = {
+    [DownloadSourceStatus.UpToDate]: t("download_source_up_to_date"),
+    [DownloadSourceStatus.Errored]: t("download_source_errored"),
   };
 
   return (
@@ -52,24 +58,34 @@ export function SettingsDownloadSources() {
         {t("download_sources_description")}
       </p>
 
-      <Button
+      <div className={styles.downloadSourcesHeader}>
-        type="button"
+        <Button
-        theme="outline"
+          type="button"
-        style={{ alignSelf: "flex-start" }}
+          theme="outline"
-        onClick={() => setShowAddDownloadSourceModal(true)}
+          onClick={() => setShowAddDownloadSourceModal(true)}
-      >
+        >
-        <PlusCircleIcon />
+          <PlusCircleIcon />
-        {t("add_download_source")}
+          {t("add_download_source")}
-      </Button>
+        </Button>
+
+        <Button
+          type="button"
+          theme="outline"
+          disabled={!downloadSources.length}
+        >
+          <SyncIcon />
+          {t("resync_download_sources")}
+        </Button>
+      </div>
 
       <ul className={styles.downloadSources}>
         {downloadSources.map((downloadSource) => (
           <li key={downloadSource.id} className={styles.downloadSourceItem}>
             <div className={styles.downloadSourceItemHeader}>
-              <div className={styles.downloadSourceItemTitle}>
+              <h2>{downloadSource.name}</h2>
-                <h2>{downloadSource.name}</h2>
 
-                <Badge>{downloadSource.status}</Badge>
+              <div style={{ display: "flex" }}>
+                <Badge>{statusTitle[downloadSource.status]}</Badge>
               </div>
 
               <small>