♻️ (typescript) migrated ManagePayees and LoadBackupModal files

actualbudget · Sep 25, 2024 · 87ee246 · 87ee246
1 parent be0eccd
commit 87ee246
Show file tree

Hide file tree

Showing 12 changed files with 364 additions and 465 deletions.
diff --git a/packages/desktop-client/src/components/autocomplete/PayeeAutocomplete.tsx b/packages/desktop-client/src/components/autocomplete/PayeeAutocomplete.tsx
@@ -309,7 +309,7 @@ export function PayeeAutocomplete({
       return filteredSuggestions;
     }
 
-    return [{ id: 'new', favorite: false, name: '' }, ...filteredSuggestions];
+    return [{ id: 'new', favorite: 0, name: '' }, ...filteredSuggestions];
   }, [commonPayees, payees, focusTransferPayees, accounts, hasPayeeInput]);
 
   const dispatch = useDispatch();

diff --git a/packages/desktop-client/src/components/modals/LoadBackupModal.tsx b/packages/desktop-client/src/components/modals/LoadBackupModal.tsx
@@ -1,7 +1,8 @@
-import React, { Component, useState, useEffect } from 'react';
+import React, { useState, useEffect } from 'react';
 import { useDispatch } from 'react-redux';
 
 import { loadBackup, makeBackup } from 'loot-core/client/actions';
+import { type Backup } from 'loot-core/server/backups';
 import { send, listen, unlisten } from 'loot-core/src/platform/client/fetch';
 
 import { useMetadataPref } from '../../hooks/useMetadataPref';
@@ -12,50 +13,31 @@ import { Modal, ModalCloseButton, ModalHeader } from '../common/Modal';
 import { Text } from '../common/Text';
 import { View } from '../common/View';
 import { Row, Cell } from '../table';
-import { type Backup } from 'loot-core/server/backups';
 
 type BackupTableProps = {
   backups: Backup[];
   onSelect: (backupId: string) => void;
 };
-type BackupTableState = {
-  hoveredBackup: null | string;
-};
-
-class BackupTable extends Component<BackupTableProps, BackupTableState> {
-  state = { hoveredBackup: null };
-
-  onHover = (id: BackupTableState['hoveredBackup']) => {
-    this.setState({ hoveredBackup: id });
-  };
 
-  render() {
-    const { backups, onSelect } = this.props;
-    const { hoveredBackup } = this.state;
-
-    return (
-      <View
-        style={{ flex: 1, maxHeight: 200, overflow: 'auto' }}
-        onMouseLeave={() => this.onHover(null)}
-      >
-        {backups.map((backup, idx) => (
-          <Row
-            key={backup.id}
-            collapsed={idx !== 0}
-            onMouseEnter={() => this.onHover(backup.id)}
-            onClick={() => onSelect(backup.id)}
-            style={{ cursor: 'pointer' }}
-          >
-            <Cell
-              width="flex"
-              value={backup.date ? backup.date : 'Revert to Latest'}
-              valueStyle={{ paddingLeft: 20 }}
-            />
-          </Row>
-        ))}
-      </View>
-    );
-  }
+function BackupTable({ backups, onSelect }: BackupTableProps) {
+  return (
+    <View style={{ flex: 1, maxHeight: 200, overflow: 'auto' }}>
+      {backups.map((backup, idx) => (
+        <Row
+          key={backup.id}
+          collapsed={idx !== 0}
+          onClick={() => onSelect(backup.id)}
+          style={{ cursor: 'pointer' }}
+        >
+          <Cell
+            width="flex"
+            value={backup.date ? backup.date : 'Revert to Latest'}
+            valueStyle={{ paddingLeft: 20 }}
+          />
+        </Row>
+      ))}
+    </View>
+  );
 }
 
 type LoadBackupModalProps = {