Merge remote-tracking branch 'origin/dev' into feat/beta-public

Signed-off-by: Innei <tukon479@gmail.com>

apps/renderer/src/components/ui/button/index.tsx

@@ -27,8 +27,15 @@ interface ActionButtonProps {
   disabled?: boolean
   shortcut?: string
   disableTriggerShortcut?: boolean
+  size?: "sm" | "md" | "base"
 }
 
+const actionButtonStyleVariant = {
+  size: {
+    base: tw`text-xl size-8`,
+    sm: tw`text-sm size-6`,
+  },
+}
 export const ActionButton = React.forwardRef<
   HTMLButtonElement,
   ComponentType<ActionButtonProps> & React.HTMLAttributes<HTMLButtonElement>
@@ -45,6 +52,7 @@ export const ActionButton = React.forwardRef<
       shortcut,
       disabled,
       disableTriggerShortcut,
+      size = "base",
       ...rest
     },
     ref,
@@ -60,10 +68,11 @@ export const ActionButton = React.forwardRef<
         // @see https://github.com/radix-ui/primitives/issues/2248#issuecomment-2147056904
         onFocusCapture={stopPropagation}
         className={cn(
-          "no-drag-region inline-flex size-8 items-center justify-center text-xl",
+          "no-drag-region inline-flex items-center justify-center",
           active && "bg-zinc-500/15 hover:bg-zinc-500/20",
           "rounded-md duration-200 hover:bg-theme-button-hover data-[state=open]:bg-theme-button-hover",
           "disabled:cursor-not-allowed disabled:opacity-50",
+          actionButtonStyleVariant.size[size],
           className,
         )}
         type="button"
@@ -86,7 +95,9 @@ export const ActionButton = React.forwardRef<
         )}
         {tooltip ? (
           <Tooltip disableHoverableContent>
-            <TooltipTrigger asChild>{Trigger}</TooltipTrigger>
+            <TooltipTrigger aria-label={typeof tooltip === "string" ? tooltip : undefined} asChild>
+              {Trigger}
+            </TooltipTrigger>
             <TooltipPortal>
               <TooltipContent className="flex items-center gap-1" side={tooltipSide ?? "bottom"}>
                 {tooltip}

apps/renderer/src/modules/discover/inbox-list-form.tsx

@@ -6,7 +6,7 @@ import { useEventCallback } from "usehooks-ts"
 
 import { useUserRole } from "~/atoms/user"
 import { CustomSafeError } from "~/components/errors/helper"
-import { Button } from "~/components/ui/button"
+import { ActionButton, Button } from "~/components/ui/button"
 import { CopyButton } from "~/components/ui/code-highlighter"
 import { useModalStack } from "~/components/ui/modal"
 import {
@@ -113,8 +113,9 @@ export function DiscoverInboxList() {
                 </div>
               </TableCell>
               <TableCell size="sm" className="center">
-                <Button
-                  variant="ghost"
+                <ActionButton
+                  size="sm"
+                  tooltip={t("discover.inbox_destroy")}
                   onClick={() =>
                     present({
                       title: t("discover.inbox_destroy_confirm"),
@@ -131,9 +132,9 @@ export function DiscoverInboxList() {
                   }
                 >
                   <i className="i-mgc-delete-2-cute-re" />
-                </Button>
-                <Button
-                  variant="ghost"
+                </ActionButton>
+                <ActionButton
+                  size="sm"
                   onClick={() => {
                     present({
                       title: t("sidebar.feed_actions.edit_inbox"),
@@ -144,7 +145,7 @@ export function DiscoverInboxList() {
                   }}
                 >
                   <i className="i-mgc-edit-cute-re" />
-                </Button>
+                </ActionButton>
               </TableCell>
             </TableRow>
           ))}
@@ -195,9 +196,14 @@ const ConfirmDestroyModalContent = ({ id, onSuccess }: { id: string; onSuccess:
 
   return (
     <div className="w-[512px]">
-      <div className="mb-4 text-red-600">{t("discover.inbox_destroy_warning")}</div>
+      <div className="mb-4">
+        <i className="i-mingcute-warning-fill -mb-1 mr-1 size-5 text-red-500" />
+        {t("discover.inbox_destroy_warning")}
+      </div>
       <div className="flex justify-end">
-        <Button onClick={() => mutationDestroy.mutate(id)}>{t("words.confirm")}</Button>
+        <Button className="bg-red-600" onClick={() => mutationDestroy.mutate(id)}>
+          {t("words.confirm")}
+        </Button>
       </div>
     </div>
   )

apps/renderer/src/modules/settings/tabs/general.tsx

@@ -1,4 +1,5 @@
 import { IN_ELECTRON } from "@follow/shared/constants"
+import { env } from "@follow/shared/env"
 import { useQuery } from "@tanstack/react-query"
 import { useAtom } from "jotai"
 import { useCallback, useEffect } from "react"
@@ -159,6 +160,17 @@ export const SettingGeneral = () => {
             description: t("general.rebuild_database.description"),
             buttonText: t("general.rebuild_database.button"),
           },
+          {
+            label: t("general.export.label"),
+            description: t("general.export.description"),
+            buttonText: t("general.export.button"),
+            action: () => {
+              const link = document.createElement("a")
+              link.href = `${env.VITE_API_URL}/subscriptions/export`
+              link.download = "follow.opml"
+              link.click()
+            },
+          },
 
           { type: "title", value: t("general.network"), disabled: !IN_ELECTRON },
           IN_ELECTRON && NettingSetting,

locales/settings/en.json

@@ -89,6 +89,9 @@
   "general.app": "App",
   "general.data_persist.description": "Persist data locally to enable offline access and local search.",
   "general.data_persist.label": "Persist data for offline usage",
+  "general.export.button": "Export",
+  "general.export.description": "Export your feeds to an OPML file.",
+  "general.export.label": "Export Feeds",
   "general.group_by_date.description": "Group entries by date.",
   "general.group_by_date.label": "Group by date",
   "general.language": "Language",