diff --git a/packages/views/issues/components/reply-input.tsx b/packages/views/issues/components/reply-input.tsx
index 72feb68fa..fab6c7e81 100644
--- a/packages/views/issues/components/reply-input.tsx
+++ b/packages/views/issues/components/reply-input.tsx
@@ -1,9 +1,9 @@
 "use client";
 
 import { useRef, useState, useCallback, useEffect } from "react";
-import { ArrowUp, Loader2 } from "lucide-react";
 import { ContentEditor, type ContentEditorRef, useFileDropZone, FileDropOverlay } from "../../editor";
 import { FileUploadButton } from "@multica/ui/components/common/file-upload-button";
+import { SubmitButton } from "@multica/ui/components/common/submit-button";
 import { ActorAvatar } from "../../common/actor-avatar";
 import { useFileUpload } from "@multica/core/hooks/use-file-upload";
 import { api } from "@multica/core/api";
@@ -149,23 +149,11 @@ function ReplyInput({
             multiple
             onSelect={(file) => editorRef.current?.uploadFile(file)}
           />
-          <button
-            type="button"
-            disabled={isEmpty || submitting}
+          <SubmitButton
             onClick={handleSubmit}
-            className={cn(
-              "inline-flex h-6 w-6 items-center justify-center rounded-full transition-colors disabled:pointer-events-none disabled:opacity-50",
-              isEmpty
-                ? "text-muted-foreground hover:bg-accent hover:text-foreground"
-                : "bg-primary text-primary-foreground hover:bg-primary/90",
-            )}
-          >
-            {submitting ? (
-              <Loader2 className="h-3.5 w-3.5 animate-spin" />
-            ) : (
-              <ArrowUp className="h-3.5 w-3.5" />
-            )}
-          </button>
+            disabled={isEmpty}
+            loading={submitting}
+          />
         </div>
         {isDragOver && <FileDropOverlay />}
       </div>