feat: add "sync" pane to preferences -> account tab (#621)

* feat: add "sync" pane to preferences -> account tab

* chore: configure eslint to add new line at the end of file and remove trailing spaces

* chore: add newline at the end of file

app/assets/javascripts/components/Button.tsx

@@ -1,6 +1,6 @@
 import { FunctionComponent } from 'preact';
 
-const baseClass = `rounded px-4 py-1.75 font-bold text-sm fit-content cursor-pointer`;
+const baseClass = `rounded px-4 py-1.75 font-bold text-sm fit-content`;
 
 const normalClass = `${baseClass} bg-default color-text border-solid border-gray-300 border-1 \
 focus:bg-contrast hover:bg-contrast`;
@@ -12,15 +12,19 @@ export const Button: FunctionComponent<{
   type: 'normal' | 'primary';
   label: string;
   onClick: () => void;
-}> = ({ type, label, className = '', onClick }) => {
+  disabled?: boolean;
+}> = ({ type, label, className = '', onClick, disabled = false }) => {
   const buttonClass = type === 'primary' ? primaryClass : normalClass;
+  const cursorClass = disabled ? 'cursor-default' : 'cursor-pointer';
+
   return (
     <button
-      className={`${buttonClass} ${className}`}
+      className={`${buttonClass} ${cursorClass} ${className}`}
       onClick={(e) => {
         onClick();
         e.preventDefault();
       }}
+      disabled={disabled}
     >
       {label}
     </button>