feat: support probe shell generation

web/src/components/code-viewer.tsx

@@ -1,14 +1,14 @@
-import { VariantProps } from "class-variance-authority";
-import { Check, Copy } from "lucide-react";
-import { type HTMLProps, type ReactNode, useCallback, useEffect, useState } from "react";
-import { CopyToClipboard } from "react-copy-to-clipboard";
-import { useTranslation } from "react-i18next";
-import { PrismLight as SyntaxHighlighter } from "react-syntax-highlighter";
+import type {VariantProps} from "class-variance-authority";
+import {Check, Copy} from "lucide-react";
+import {type HTMLProps, type ReactNode, useCallback, useEffect, useState} from "react";
+import {CopyToClipboard} from "react-copy-to-clipboard";
+import {useTranslation} from "react-i18next";
+import {PrismLight as SyntaxHighlighter} from "react-syntax-highlighter";
 import java from "react-syntax-highlighter/dist/esm/languages/prism/java";
-import { materialDark } from "react-syntax-highlighter/dist/esm/styles/prism";
-import { toast } from "sonner";
-import { Button, buttonVariants } from "@/components/ui/button";
-import { cn } from "@/lib/utils";
+import {materialDark} from "react-syntax-highlighter/dist/esm/styles/prism";
+import {toast} from "sonner";
+import {Button, type buttonVariants} from "@/components/ui/button";
+import {cn} from "@/lib/utils";
 
 SyntaxHighlighter.registerLanguage("java", java);
 interface CopyButtonProps extends React.ComponentProps<"button"> {

web/src/components/magicui/line-shadow-text.tsx

@@ -1,5 +1,5 @@
-import { MotionProps, motion } from "motion/react";
-import { cn } from "@/lib/utils";
+import {type MotionProps, motion } from "motion/react";
+import {cn} from "@/lib/utils";
 
 interface LineShadowTextProps extends Omit<React.HTMLAttributes<HTMLElement>, keyof MotionProps>, MotionProps {
   shadowColor?: string;

web/src/components/magicui/rainbow-button.tsx

@@ -1,7 +1,7 @@
-import { Slot } from "@radix-ui/react-slot";
-import { cva, VariantProps } from "class-variance-authority";
+import {Slot} from "@radix-ui/react-slot";
+import {cva, type VariantProps} from "class-variance-authority";
 import React from "react";
-import { cn } from "@/lib/utils";
+import {cn} from "@/lib/utils";
 
 const rainbowButtonVariants = cva(
   cn(

web/src/components/memshell/main-config-card.tsx

@@ -9,10 +9,16 @@ import {
   WaypointsIcon,
   ZapIcon,
 } from "lucide-react";
-import { JSX, useCallback, useEffect, useId, useState } from "react";
-import { FormProvider, UseFormReturn } from "react-hook-form";
+import { type JSX, useCallback, useEffect, useId, useState } from "react";
+import { FormProvider, type UseFormReturn } from "react-hook-form";
 import { useTranslation } from "react-i18next";
-import { JreTip } from "@/components/tips/jre-tip.tsx";
+import { AntSwordTabContent } from "@/components/memshell/tabs/antsword-tab";
+import { BehinderTabContent } from "@/components/memshell/tabs/behinder-tab";
+import { CommandTabContent } from "@/components/memshell/tabs/command-tab";
+import CustomTabContent from "@/components/memshell/tabs/custom-tab";
+import { GodzillaTabContent } from "@/components/memshell/tabs/godzilla-tab";
+import { NeoRegTabContent } from "@/components/memshell/tabs/neoreg-tab";
+import { Suo5TabContent } from "@/components/memshell/tabs/suo5-tab";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card.tsx";
 import {
   FormControl,
@@ -28,15 +34,8 @@ import { Label } from "@/components/ui/label.tsx";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select.tsx";
 import { Switch } from "@/components/ui/switch.tsx";
 import { Tabs, TabsList, TabsTrigger } from "@/components/ui/tabs";
-import { FormSchema } from "@/types/schema.ts";
-import { JDKVersion, MainConfig, ServerConfig, ShellToolType } from "@/types/shell.ts";
-import { AntSwordTabContent } from "./tools/antsword-tab";
-import { BehinderTabContent } from "./tools/behinder-tab";
-import { CommandTabContent } from "./tools/command-tab";
-import CustomTabContent from "./tools/custom-tab";
-import { GodzillaTabContent } from "./tools/godzilla-tab";
-import { NeoRegTabContent } from "./tools/neoreg-tab";
-import { Suo5TabContent } from "./tools/suo5-tab";
+import type { ShellFormSchema } from "@/types/schema.ts";
+import { type MainConfig, type ServerConfig, ShellToolType } from "@/types/shell.ts";
 
 const shellToolIcons: Record<ShellToolType, JSX.Element> = {
   [ShellToolType.Behinder]: <ShieldOffIcon className="h-4 w-4" />,
@@ -61,7 +60,7 @@ export default function MainConfigCard({
   servers,
 }: Readonly<{
   mainConfig: MainConfig | undefined;
-  form: UseFormReturn<FormSchema>;
+  form: UseFormReturn<ShellFormSchema>;
   servers?: ServerConfig;
 }>) {
   const [shellToolMap, setShellToolMap] = useState<{
@@ -143,7 +142,7 @@ export default function MainConfigCard({
         }
 
         form.resetField("serverVersion");
-        form.resetField("bypassJavaModule");
+        form.resetField("byPassJavaModule");
         form.resetField("urlPattern");
       }
     },
@@ -315,43 +314,6 @@ export default function MainConfigCard({
               )}
             />
           </div>
-          <div className="grid grid-cols-1">
-            <FormField
-              control={form.control}
-              name="targetJdkVersion"
-              render={({ field }) => (
-                <FormFieldItem>
-                  <FormFieldLabel>
-                    {t("mainConfig.jre")} {t("optional")} <JreTip />
-                  </FormFieldLabel>
-                  <Select
-                    onValueChange={(v) => {
-                      if (Number.parseInt(v) >= 53) {
-                        form.setValue("bypassJavaModule", true);
-                      } else {
-                        form.setValue("bypassJavaModule", false);
-                      }
-                      field.onChange(v);
-                    }}
-                    value={field.value}
-                  >
-                    <FormControl>
-                      <SelectTrigger>
-                        <SelectValue placeholder={t("placeholders.select")} />
-                      </SelectTrigger>
-                    </FormControl>
-                    <SelectContent>
-                      {JDKVersion.map((v) => (
-                        <SelectItem key={v.value} value={v.value}>
-                          {v.name}
-                        </SelectItem>
-                      ))}
-                    </SelectContent>
-                  </Select>
-                </FormFieldItem>
-              )}
-            />
-          </div>
           <div className="flex gap-4 mt-4 flex-col sm:flex-row">
             <FormField
               control={form.control}
@@ -367,13 +329,13 @@ export default function MainConfigCard({
             />
             <FormField
               control={form.control}
-              name="bypassJavaModule"
+              name="byPassJavaModule"
               render={({ field }) => (
                 <FormItem className="flex items-center space-x-2  space-y-0">
                   <FormControl>
                     <Switch id={bypassId} checked={field.value} onCheckedChange={field.onChange} />
                   </FormControl>
-                  <Label htmlFor={bypassId}>{t("mainConfig.bypassJavaModule")}</Label>
+                  <Label htmlFor={bypassId}>{t("mainConfig.byPassJavaModule")}</Label>
                 </FormItem>
               )}
             />

web/src/components/memshell/package-config-card.tsx

@@ -1,12 +1,12 @@
 import { PackageIcon } from "lucide-react";
 import { useEffect, useState } from "react";
-import { FormProvider, UseFormReturn } from "react-hook-form";
+import { FormProvider, type UseFormReturn } from "react-hook-form";
 import { useTranslation } from "react-i18next";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card.tsx";
 import { FormControl, FormField, FormItem, FormLabel } from "@/components/ui/form.tsx";
 import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group.tsx";
-import { FormSchema } from "@/types/schema.ts";
-import { PackerConfig } from "@/types/shell.ts";
+import type { ShellFormSchema } from "@/types/schema.ts";
+import type { PackerConfig } from "@/types/shell.ts";
 
 type Option = {
   name: string;
@@ -18,7 +18,7 @@ export default function PackageConfigCard({
   form,
 }: Readonly<{
   packerConfig: PackerConfig | undefined;
-  form: UseFormReturn<FormSchema>;
+  form: UseFormReturn<ShellFormSchema>;
 }>) {
   const [options, setOptions] = useState<Array<Option>>([]);
 

web/src/components/memshell/results/agent.tsx

@@ -1,10 +1,10 @@
 import { ScrollTextIcon } from "lucide-react";
 import { useTranslation } from "react-i18next";
+import { Button } from "@/components/ui/button";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { Separator } from "@/components/ui/separator";
 import { downloadBytes, formatBytes } from "@/lib/utils";
-import { GenerateResult } from "@/types/shell";
-import { Button } from "../ui/button";
-import { Card, CardContent, CardHeader, CardTitle } from "../ui/card";
-import { Separator } from "../ui/separator";
+import type { GenerateResult } from "@/types/shell";
 
 export function AgentResult({
   packMethod,

web/src/components/memshell/results/basic-info.tsx

@@ -1,19 +1,19 @@
 import { FileTextIcon } from "lucide-react";
 import { useTranslation } from "react-i18next";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import { Separator } from "@/components/ui/separator";
 import { shouldHidden } from "@/lib/utils";
 import {
-  AntSwordShellToolConfig,
-  BehinderShellToolConfig,
-  CommandShellToolConfig,
-  GenerateResult,
-  GodzillaShellToolConfig,
-  NeoreGeorgShellToolConfig,
+  type AntSwordShellToolConfig,
+  type BehinderShellToolConfig,
+  type CommandShellToolConfig,
+  type GenerateResult,
+  type GodzillaShellToolConfig,
+  type NeoreGeorgShellToolConfig,
   ShellToolType,
-  Suo5ShellToolConfig,
+  type Suo5ShellToolConfig,
 } from "@/types/shell";
-import { CopyableField } from "../copyable-field";
-import { Card, CardContent, CardHeader, CardTitle } from "../ui/card";
-import { Separator } from "../ui/separator";
+import { CopyableField } from "../../copyable-field";
 import { FeedbackAlert } from "./feedback-alert";
 
 export function BasicInfo({ generateResult }: Readonly<{ generateResult?: GenerateResult }>) {

web/src/components/memshell/results/feedback-alert.tsx

@@ -10,8 +10,8 @@ import {
   AlertDialogHeader,
   AlertDialogTitle,
   AlertDialogTrigger,
-} from "../ui/alert-dialog";
-import { Button } from "../ui/button";
+} from "@/components/ui/alert-dialog";
+import { Button } from "@/components/ui/button";
 
 export function FeedbackAlert() {
   const { t } = useTranslation();

web/src/components/memshell/results/jar-result.tsx

@@ -1,7 +1,7 @@
 import { useTranslation } from "react-i18next";
+import { Button } from "@/components/ui/button";
 import { downloadBytes } from "@/lib/utils";
-import { GenerateResult } from "@/types/shell";
-import { Button } from "../ui/button";
+import type { GenerateResult } from "@/types/shell";
 
 export function JarResult({
   packResult,

web/src/components/memshell/results/multi-packer.tsx

@@ -1,17 +1,16 @@
-import { TFunction } from "i18next";
 import { useEffect, useState } from "react";
+import { useTranslation } from "react-i18next";
 import CodeViewer from "@/components/code-viewer";
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../ui/select";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
 export function MultiPackResult({
   allPackResults,
   packMethod,
-  t,
 }: Readonly<{
   allPackResults: object | undefined;
   packMethod: string;
-  t: TFunction;
 }>) {
   const showCode = packMethod === "JSP";
+  const {t} = useTranslation();
   const packMethods = Object.keys(allPackResults ?? {});
   const [selectedMethod, setSelectedMethod] = useState(packMethods[0]);
   const [packResult, setPackResult] = useState(allPackResults?.[selectedMethod as keyof typeof allPackResults] ?? "");

web/src/components/memshell/results/result-component.tsx

@@ -1,6 +1,6 @@
-import { TFunction } from "i18next";
+import { useTranslation } from "react-i18next";
 import CodeViewer from "@/components/code-viewer";
-import { GenerateResult } from "@/types/shell";
+import type { GenerateResult } from "@/types/shell";
 import { AgentResult } from "./agent";
 import { JarResult } from "./jar-result";
 import { MultiPackResult } from "./multi-packer";
@@ -9,20 +9,19 @@ export function ResultComponent({
   packResult,
   allPackResults,
   packMethod,
-  t,
   generateResult,
 }: Readonly<{
   packResult: string | undefined;
   allPackResults: Map<string, string> | undefined;
   packMethod: string;
-  t: TFunction;
   generateResult?: GenerateResult;
 }>) {
   const showCode = packMethod === "JSP";
   const isAgent = packMethod.startsWith("Agent");
   const isJar = packMethod === "Jar";
+  const { t } =  useTranslation();
   if (allPackResults) {
-    return <MultiPackResult allPackResults={allPackResults} packMethod={packMethod} t={t} />;
+    return <MultiPackResult allPackResults={allPackResults} packMethod={packMethod} />;
   }
 
   if (isAgent) {

web/src/components/memshell/shell-result.tsx

@@ -2,12 +2,12 @@ import { DownloadIcon } from "lucide-react";
 import { useTranslation } from "react-i18next";
 import { toast } from "sonner";
 
-import { QuickUsage } from "@/components/quick-usage.tsx";
+import { QuickUsage } from "@/components/memshell/quick-usage";
 import { Button } from "@/components/ui/button.tsx";
 import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs.tsx";
 import { downloadBytes } from "@/lib/utils.ts";
-import { GenerateResult } from "@/types/shell.ts";
-import CodeViewer from "./code-viewer";
+import type { GenerateResult } from "@/types/shell.ts";
+import CodeViewer from "../code-viewer";
 import { BasicInfo } from "./results/basic-info";
 import { ResultComponent } from "./results/result-component";
 
@@ -39,7 +39,6 @@ export default function ShellResult({
           packResult={packResult}
           allPackResults={allPackResults}
           packMethod={packMethod}
-          t={t}
           generateResult={generateResult}
         />
       </TabsContent>

web/src/components/memshell/tabs/antsword-tab.tsx

@@ -1,10 +1,10 @@
-import { FormProvider, UseFormReturn } from "react-hook-form";
+import { FormProvider, type UseFormReturn } from "react-hook-form";
 import { useTranslation } from "react-i18next";
-import { FormSchema } from "@/types/schema";
-import { Card, CardContent } from "../ui/card";
-import { FormControl, FormField, FormFieldItem, FormFieldLabel } from "../ui/form";
-import { Input } from "../ui/input";
-import { TabsContent } from "../ui/tabs";
+import { Card, CardContent } from "@/components/ui/card";
+import { FormControl, FormField, FormFieldItem, FormFieldLabel } from "@/components/ui/form";
+import { Input } from "@/components/ui/input";
+import { TabsContent } from "@/components/ui/tabs";
+import type { ShellFormSchema } from "@/types/schema";
 import { OptionalClassFormField } from "./classname-field";
 import { ShellTypeFormField } from "./shelltype-field";
 import { UrlPatternFormField } from "./urlpattern-field";
@@ -12,7 +12,7 @@ import { UrlPatternFormField } from "./urlpattern-field";
 export function AntSwordTabContent({
   form,
   shellTypes,
-}: Readonly<{ form: UseFormReturn<FormSchema>; shellTypes: Array<string> }>) {
+}: Readonly<{ form: UseFormReturn<ShellFormSchema>; shellTypes: Array<string> }>) {
   const { t } = useTranslation();
   return (
     <FormProvider {...form}>

web/src/components/memshell/tabs/behinder-tab.tsx

@@ -1,10 +1,10 @@
-import { FormProvider, UseFormReturn } from "react-hook-form";
+import { FormProvider, type UseFormReturn } from "react-hook-form";
 import { useTranslation } from "react-i18next";
-import { FormSchema } from "@/types/schema";
-import { Card, CardContent } from "../ui/card";
-import { FormField, FormFieldItem, FormFieldLabel } from "../ui/form";
-import { Input } from "../ui/input";
-import { TabsContent } from "../ui/tabs";
+import { Card, CardContent } from "@/components/ui/card";
+import { FormField, FormFieldItem, FormFieldLabel } from "@/components/ui/form";
+import { Input } from "@/components/ui/input";
+import { TabsContent } from "@/components/ui/tabs";
+import type { ShellFormSchema } from "@/types/schema";
 import { OptionalClassFormField } from "./classname-field";
 import { ShellTypeFormField } from "./shelltype-field";
 import { UrlPatternFormField } from "./urlpattern-field";
@@ -12,7 +12,7 @@ import { UrlPatternFormField } from "./urlpattern-field";
 export function BehinderTabContent({
   form,
   shellTypes,
-}: Readonly<{ form: UseFormReturn<FormSchema>; shellTypes: Array<string> }>) {
+}: Readonly<{ form: UseFormReturn<ShellFormSchema>; shellTypes: Array<string> }>) {
   const { t } = useTranslation();
   return (
     <FormProvider {...form}>

web/src/components/memshell/tabs/classname-field.tsx

@@ -1,13 +1,13 @@
 import { ChevronDown, ChevronUp, Settings } from "lucide-react";
 import { Fragment, useId, useState } from "react";
-import { FormProvider, UseFormReturn } from "react-hook-form";
+import { FormProvider, type UseFormReturn } from "react-hook-form";
 import { useTranslation } from "react-i18next";
+import { Button } from "@/components/ui/button";
 import { FormField, FormFieldItem, FormFieldLabel } from "@/components/ui/form.tsx";
 import { Input } from "@/components/ui/input.tsx";
-import { FormSchema } from "@/types/schema.ts";
-import { Button } from "../ui/button";
+import type { ShellFormSchema } from "@/types/schema.ts";
 
-export function OptionalClassFormField({ form }: Readonly<{ form: UseFormReturn<FormSchema> }>) {
+export function OptionalClassFormField({ form }: Readonly<{ form: UseFormReturn<ShellFormSchema> }>) {
   const { t } = useTranslation();
   const [showAdvanced, setShowAdvanced] = useState(false);
   const shellClassNameId = useId();

web/src/components/memshell/tabs/command-tab.tsx

@@ -1,13 +1,13 @@
 import { useQuery } from "@tanstack/react-query";
-import { FormProvider, UseFormReturn } from "react-hook-form";
+import { FormProvider, type UseFormReturn } from "react-hook-form";
 import { useTranslation } from "react-i18next";
+import { Card, CardContent } from "@/components/ui/card";
+import { FormControl, FormField, FormFieldItem, FormFieldLabel } from "@/components/ui/form";
+import { Input } from "@/components/ui/input";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
+import { TabsContent } from "@/components/ui/tabs";
 import { env } from "@/config";
-import { FormSchema } from "@/types/schema";
-import { Card, CardContent } from "../ui/card";
-import { FormControl, FormField, FormFieldItem, FormFieldLabel } from "../ui/form";
-import { Input } from "../ui/input";
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../ui/select";
-import { TabsContent } from "../ui/tabs";
+import type { ShellFormSchema } from "@/types/schema";
 import { OptionalClassFormField } from "./classname-field";
 import { ShellTypeFormField } from "./shelltype-field";
 import { UrlPatternFormField } from "./urlpattern-field";
@@ -15,7 +15,7 @@ import { UrlPatternFormField } from "./urlpattern-field";
 export function CommandTabContent({
   form,
   shellTypes,
-}: Readonly<{ form: UseFormReturn<FormSchema>; shellTypes: Array<string> }>) {
+}: Readonly<{ form: UseFormReturn<ShellFormSchema>; shellTypes: Array<string> }>) {
   const { t } = useTranslation();
   const { data } = useQuery<{ encryptors: Array<string>; implementationClasses: Array<string> }>({
     queryKey: ["commandConfigs"],

web/src/components/memshell/tabs/custom-tab.tsx

@@ -1,14 +1,14 @@
 import { t } from "i18next";
 import { useId, useState } from "react";
-import { FormProvider, UseFormReturn } from "react-hook-form";
+import { FormProvider, type UseFormReturn } from "react-hook-form";
 import { Card, CardContent } from "@/components/ui/card";
+import { FormControl, FormField, FormFieldItem, FormFieldLabel, FormMessage } from "@/components/ui/form";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group";
 import { TabsContent } from "@/components/ui/tabs";
-import { FormSchema } from "@/types/schema";
-import { FormControl, FormField, FormFieldItem, FormFieldLabel, FormMessage } from "../ui/form";
-import { Input } from "../ui/input";
-import { Label } from "../ui/label";
-import { RadioGroup, RadioGroupItem } from "../ui/radio-group";
-import { Textarea } from "../ui/textarea";
+import { Textarea } from "@/components/ui/textarea";
+import type { ShellFormSchema } from "@/types/schema";
 import { OptionalClassFormField } from "./classname-field";
 import { ShellTypeFormField } from "./shelltype-field";
 import { UrlPatternFormField } from "./urlpattern-field";
@@ -16,7 +16,7 @@ import { UrlPatternFormField } from "./urlpattern-field";
 export default function CustomTabContent({
   form,
   shellTypes,
-}: Readonly<{ form: UseFormReturn<FormSchema>; shellTypes: Array<string> }>) {
+}: Readonly<{ form: UseFormReturn<ShellFormSchema>; shellTypes: Array<string> }>) {
   const [isFile, setIsFile] = useState(false);
   const optionOneId = useId();
   const optionTwoId = useId();

web/src/components/memshell/tabs/godzilla-tab.tsx

@@ -1,10 +1,10 @@
-import { FormProvider, UseFormReturn } from "react-hook-form";
+import { FormProvider, type UseFormReturn } from "react-hook-form";
 import { useTranslation } from "react-i18next";
-import { FormSchema } from "@/types/schema";
-import { Card, CardContent } from "../ui/card";
-import { FormField, FormFieldItem, FormFieldLabel } from "../ui/form";
-import { Input } from "../ui/input";
-import { TabsContent } from "../ui/tabs";
+import { Card, CardContent } from "@/components/ui/card";
+import { FormField, FormFieldItem, FormFieldLabel } from "@/components/ui/form";
+import { Input } from "@/components/ui/input";
+import { TabsContent } from "@/components/ui/tabs";
+import type { ShellFormSchema } from "@/types/schema";
 import { OptionalClassFormField } from "./classname-field";
 import { ShellTypeFormField } from "./shelltype-field";
 import { UrlPatternFormField } from "./urlpattern-field";
@@ -12,7 +12,7 @@ import { UrlPatternFormField } from "./urlpattern-field";
 export function GodzillaTabContent({
   form,
   shellTypes,
-}: Readonly<{ form: UseFormReturn<FormSchema>; shellTypes: Array<string> }>) {
+}: Readonly<{ form: UseFormReturn<ShellFormSchema>; shellTypes: Array<string> }>) {
   const { t } = useTranslation();
   return (
     <FormProvider {...form}>

web/src/components/memshell/tabs/neoreg-tab.tsx

@@ -1,10 +1,10 @@
-import { FormProvider, UseFormReturn } from "react-hook-form";
+import { FormProvider, type UseFormReturn } from "react-hook-form";
 import { useTranslation } from "react-i18next";
-import { FormSchema } from "@/types/schema";
-import { Card, CardContent } from "../ui/card";
-import { FormField, FormFieldItem, FormFieldLabel } from "../ui/form";
-import { Input } from "../ui/input";
-import { TabsContent } from "../ui/tabs";
+import { Card, CardContent } from "@/components/ui/card";
+import { FormField, FormFieldItem, FormFieldLabel } from "@/components/ui/form";
+import { Input } from "@/components/ui/input";
+import { TabsContent } from "@/components/ui/tabs";
+import type { ShellFormSchema } from "@/types/schema";
 import { OptionalClassFormField } from "./classname-field";
 import { ShellTypeFormField } from "./shelltype-field";
 import { UrlPatternFormField } from "./urlpattern-field";
@@ -12,7 +12,7 @@ import { UrlPatternFormField } from "./urlpattern-field";
 export function NeoRegTabContent({
   form,
   shellTypes,
-}: Readonly<{ form: UseFormReturn<FormSchema>; shellTypes: Array<string> }>) {
+}: Readonly<{ form: UseFormReturn<ShellFormSchema>; shellTypes: Array<string> }>) {
   const { t } = useTranslation();
   return (
     <FormProvider {...form}>

web/src/components/memshell/tabs/shelltype-field.tsx

@@ -1,13 +1,13 @@
-import { FormProvider, UseFormReturn } from "react-hook-form";
+import { FormProvider, type UseFormReturn } from "react-hook-form";
 import { useTranslation } from "react-i18next";
 import { FormControl, FormField, FormFieldItem, FormFieldLabel } from "@/components/ui/form.tsx";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select.tsx";
-import { FormSchema } from "@/types/schema.ts";
+import type { ShellFormSchema } from "@/types/schema.ts";
 
 export function ShellTypeFormField({
   form,
   shellTypes,
-}: Readonly<{ form: UseFormReturn<FormSchema>; shellTypes: Array<string> }>) {
+}: Readonly<{ form: UseFormReturn<ShellFormSchema>; shellTypes: Array<string> }>) {
   const { t } = useTranslation();
   return (
     <FormProvider {...form}>

web/src/components/memshell/tabs/suo5-tab.tsx

@@ -1,10 +1,10 @@
-import { FormProvider, UseFormReturn } from "react-hook-form";
+import { FormProvider, type UseFormReturn } from "react-hook-form";
 import { useTranslation } from "react-i18next";
-import { FormSchema } from "@/types/schema";
-import { Card, CardContent } from "../ui/card";
-import { FormField, FormFieldItem, FormFieldLabel } from "../ui/form";
-import { Input } from "../ui/input";
-import { TabsContent } from "../ui/tabs";
+import { Card, CardContent } from "@/components/ui/card";
+import { FormField, FormFieldItem, FormFieldLabel } from "@/components/ui/form";
+import { Input } from "@/components/ui/input";
+import { TabsContent } from "@/components/ui/tabs";
+import type { ShellFormSchema } from "@/types/schema";
 import { OptionalClassFormField } from "./classname-field";
 import { ShellTypeFormField } from "./shelltype-field";
 import { UrlPatternFormField } from "./urlpattern-field";
@@ -12,7 +12,7 @@ import { UrlPatternFormField } from "./urlpattern-field";
 export function Suo5TabContent({
   form,
   shellTypes,
-}: Readonly<{ form: UseFormReturn<FormSchema>; shellTypes: Array<string> }>) {
+}: Readonly<{ form: UseFormReturn<ShellFormSchema>; shellTypes: Array<string> }>) {
   const { t } = useTranslation();
   return (
     <FormProvider {...form}>

web/src/components/memshell/tabs/urlpattern-field.tsx

@@ -1,11 +1,11 @@
-import { FormProvider, UseFormReturn } from "react-hook-form";
+import { FormProvider, type UseFormReturn } from "react-hook-form";
 import { useTranslation } from "react-i18next";
 import { FormField, FormFieldItem, FormFieldLabel, FormMessage } from "@/components/ui/form.tsx";
 import { Input } from "@/components/ui/input.tsx";
 import { shouldHidden } from "@/lib/utils";
-import { FormSchema } from "@/types/schema.ts";
+import type { ShellFormSchema } from "@/types/schema.ts";
 
-export function UrlPatternFormField({ form }: Readonly<{ form: UseFormReturn<FormSchema> }>) {
+export function UrlPatternFormField({ form }: Readonly<{ form: UseFormReturn<ShellFormSchema> }>) {
   const { t } = useTranslation();
   const shellType = form.watch("shellType");
   return (

web/src/components/probe/basic-info.tsx

@@ -0,0 +1,32 @@
+import { FileTextIcon } from "lucide-react";
+import { useTranslation } from "react-i18next";
+import { CopyableField } from "@/components/copyable-field";
+import { FeedbackAlert } from "@/components/memshell/results/feedback-alert";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import type { ProbeGenerateResult } from "@/types/probe";
+
+export function BasicInfo({ generateResult }: Readonly<{ generateResult?: ProbeGenerateResult }>) {
+  const { t } = useTranslation();
+  return (
+    <Card>
+      <CardHeader>
+        <CardTitle className="flex items-center justify-between">
+          <div className="text-md flex items-center gap-2">
+            <FileTextIcon className="h-5" />
+            <span>{t("generateResult.basicInfo")}</span>
+          </div>
+          <FeedbackAlert />
+        </CardTitle>
+      </CardHeader>
+      <CardContent>
+        <div className="grid grid-cols-1 md:grid-cols-2 gap-2">
+          <CopyableField
+            label={t("mainConfig.shellClassName")}
+            value={generateResult?.shellClassName}
+            text={`${generateResult?.shellClassName} (${generateResult?.shellSize} bytes)`}
+          />
+        </div>
+      </CardContent>
+    </Card>
+  );
+}

web/src/components/probe/main-config-card.tsx

@@ -0,0 +1,356 @@
+import { ServerIcon } from "lucide-react";
+import { useCallback, useEffect, useMemo } from "react";
+import { FormProvider, type UseFormReturn } from "react-hook-form";
+import { useTranslation } from "react-i18next";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
+import {
+  FormControl,
+  FormField,
+  FormFieldItem,
+  FormFieldLabel,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from "@/components/ui/form";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
+import { Switch } from "@/components/ui/switch";
+import type { ProbeFormSchema } from "@/types/schema";
+import type { ServerConfig } from "@/types/shell";
+import { Separator } from "../ui/separator";
+
+// 常量提取到组件外部
+const PROBE_OPTIONS = [
+  { value: "Server" as const, label: "中间件类型" },
+  { value: "JDK" as const, label: "JDK 信息" },
+  { value: "Command" as const, label: "命令执行" },
+  { value: "Bytecode" as const, label: "自定义字节码执行" },
+] as const;
+
+const MIDDLEWARE_OPTIONS = [
+  { value: "Tomcat", label: "Tomcat" },
+  { value: "Jetty", label: "Jetty" },
+  { value: "Undertow", label: "Undertow" },
+  { value: "Resin", label: "Resin" },
+  { value: "JBoss", label: "JBoss" },
+  { value: "GlassFish", label: "GlassFish" },
+  { value: "BES", label: "BES" },
+  { value: "TongWeb", label: "TongWeb" },
+  { value: "InforSuite", label: "InforSuite" },
+  { value: "Apusic", label: "Apusic" },
+  { value: "SpringWebFlux", label: "SpringWebFlux" },
+  { value: "WebLogic", label: "WebLogic" },
+  { value: "WebSphere", label: "WebSphere" },
+] as const;
+
+const PROBE_METHOD_OPTIONS = [
+  { value: "Sleep", label: "Sleep 延迟探测" },
+  { value: "DNSLog", label: "DNSLog" },
+  { value: "ResponseBody", label: "ResponseBody" },
+] as const;
+
+// 默认值配置
+const DEFAULT_FORM_VALUES = {
+  reqParamName: "payload",
+  reqHeaderName: "X-PAYLOAD",
+  sleepServer: "Tomcat",
+  seconds: 5,
+} as const;
+
+interface MainConfigCardProps {
+  readonly form: UseFormReturn<ProbeFormSchema>;
+  readonly servers?: ServerConfig;
+}
+
+export default function MainConfigCard({ form, servers }: MainConfigCardProps) {
+  const { t } = useTranslation();
+  const watchedProbeMethod = form.watch("probeMethod");
+  const watchedProbeContent = form.watch("probeContent");
+
+  const filteredOptions = useMemo(() => {
+    const filterMap = {
+      ResponseBody: ["Command", "Bytecode"],
+      DNSLog: ["JDK", "Server"],
+      Sleep: ["Server"],
+    } as const;
+
+    const allowedValues = filterMap[watchedProbeMethod as keyof typeof filterMap];
+    
+    if (!allowedValues) return PROBE_OPTIONS;
+    
+    return PROBE_OPTIONS.filter(opt => 
+      allowedValues.includes(opt.value as never)
+    );
+  }, [watchedProbeMethod]);
+
+  const resetFormValues = useCallback(() => {
+    if (filteredOptions.length === 0) return;
+
+    const currentValues = form.getValues();
+    form.reset({
+      ...currentValues,
+      probeMethod: watchedProbeMethod,
+      probeContent: filteredOptions[0].value,
+      ...DEFAULT_FORM_VALUES,
+    });
+  }, [form, watchedProbeMethod, filteredOptions]);
+
+  useEffect(() => {
+    resetFormValues();
+  }, [resetFormValues]);
+
+  const ContentOptionsSelect = useMemo(() => (
+    <FormField
+      control={form.control}
+      name="probeContent"
+      render={({ field }) => (
+        <FormFieldItem>
+          <FormFieldLabel>探测内容</FormFieldLabel>
+          <Select onValueChange={field.onChange} value={field.value || ""}>
+            <FormControl>
+              <SelectTrigger>
+                <SelectValue placeholder="请选择要探测的内容..." />
+              </SelectTrigger>
+            </FormControl>
+            <SelectContent>
+              {filteredOptions.map((opt) => (
+                <SelectItem key={opt.value} value={opt.value}>
+                  {opt.label}
+                </SelectItem>
+              ))}
+            </SelectContent>
+          </Select>
+          <FormMessage />
+        </FormFieldItem>
+      )}
+    />
+  ), [form.control, filteredOptions]);
+
+  const RequestParamField = useMemo(() => (
+    <div className="space-y-4 pt-4 border-t mt-4">
+      <FormField
+        control={form.control}
+        name="reqParamName"
+        render={({ field }) => (
+          <FormFieldItem>
+            <FormFieldLabel>Request Param Name</FormFieldLabel>
+            <FormControl>
+              <Input placeholder="例如: cmd, data, ..." {...field} />
+            </FormControl>
+            <FormMessage />
+          </FormFieldItem>
+        )}
+      />
+    </div>
+  ), [form.control]);
+
+  const SleepFields = useMemo(() => (
+    <div className="space-y-4 pt-4 border-t mt-4">
+      <div className="space-y-4">
+        <FormField
+          control={form.control}
+          name="sleepServer"
+          render={({ field }) => (
+            <FormFieldItem>
+              <FormFieldLabel>探测中间件</FormFieldLabel>
+              <Select onValueChange={field.onChange} value={field.value || ""}>
+                <FormControl>
+                  <SelectTrigger>
+                    <SelectValue placeholder="选择中间件..." />
+                  </SelectTrigger>
+                </FormControl>
+                <SelectContent>
+                  {MIDDLEWARE_OPTIONS.map(({ value, label }) => (
+                    <SelectItem key={value} value={value}>
+                      {label}
+                    </SelectItem>
+                  ))}
+                </SelectContent>
+              </Select>
+              <FormMessage />
+            </FormFieldItem>
+          )}
+        />
+        <FormField
+          control={form.control}
+          name="seconds"
+          render={({ field }) => (
+            <FormFieldItem>
+              <FormFieldLabel>命中延迟时间 (秒)</FormFieldLabel>
+              <FormControl>
+                <Input
+                  type="number"
+                  placeholder="例如: 5"
+                  {...field}
+                  onChange={(event) => field.onChange(+event.target.value)}
+                />
+              </FormControl>
+              <FormMessage />
+            </FormFieldItem>
+          )}
+        />
+      </div>
+    </div>
+  ), [form.control]);
+
+  const renderDynamicFields = useCallback(() => {
+    const isBodyMethod = watchedProbeMethod === "ResponseBody";
+    const isCommandOrBytecode = watchedProbeContent === "Command" || watchedProbeContent === "Bytecode";
+    const isSleepMethod = watchedProbeMethod === "Sleep";
+    const isServerContent = watchedProbeContent === "Server";
+
+    if (isBodyMethod && isCommandOrBytecode) {
+      return RequestParamField;
+    }
+
+    if (isSleepMethod && isServerContent) {
+      return SleepFields;
+    }
+
+    return null;
+  }, [watchedProbeMethod, watchedProbeContent, RequestParamField, SleepFields]);
+
+
+  const DNSLogSection = useMemo(() => (
+      <FormField
+        control={form.control}
+        name="host"
+        render={({ field }) => (
+          <FormFieldItem>
+            <FormFieldLabel>DNSLog 地址</FormFieldLabel>
+            <FormControl>
+              <Input placeholder="例如: abcde.DNSLog.cn" {...field} />
+            </FormControl>
+            <FormMessage />
+          </FormFieldItem>
+        )}
+      />
+  ), [form.control]);
+
+  const MiddlewareSelect = useMemo(() => (
+    <FormField
+      control={form.control}
+      name="server"
+      render={({ field }) => (
+        <FormFieldItem>
+          <FormFieldLabel>中间件类型</FormFieldLabel>
+          <Select onValueChange={field.onChange} defaultValue={field.value}>
+            <FormControl>
+              <SelectTrigger>
+                <SelectValue placeholder="选择中间件..." />
+              </SelectTrigger>
+            </FormControl>
+            <SelectContent>
+              {Object.keys(servers ?? {}).map((server: string) => (
+                <SelectItem key={server} value={server}>
+                  {server}
+                </SelectItem>
+              ))}
+            </SelectContent>
+          </Select>
+          <FormMessage />
+        </FormFieldItem>
+      )}
+    />
+  ), [form.control, servers]);
+
+  const SwitchGroup = useMemo(() => (
+    <div className="flex gap-4 mt-4 flex-col sm:flex-row">
+      <FormField
+        control={form.control}
+        name="debug"
+        render={({ field }) => (
+          <FormItem className="flex items-center space-x-2 space-y-0">
+            <FormControl>
+              <Switch id="debug" checked={field.value} onCheckedChange={field.onChange} />
+            </FormControl>
+            <FormLabel htmlFor="debug">{t("mainConfig.debug")}</FormLabel>
+          </FormItem>
+        )}
+      />
+      <FormField
+        control={form.control}
+        name="byPassJavaModule"
+        render={({ field }) => (
+          <FormItem className="flex items-center space-x-2 space-y-0">
+            <FormControl>
+              <Switch id="bypass" checked={field.value} onCheckedChange={field.onChange} />
+            </FormControl>
+            <Label htmlFor="bypass">{t("mainConfig.byPassJavaModule")}</Label>
+          </FormItem>
+        )}
+      />
+      <FormField
+        control={form.control}
+        name="shrink"
+        render={({ field }) => (
+          <FormItem className="flex items-center space-x-2 space-y-0">
+            <FormControl>
+              <Switch id="shrink" checked={field.value} onCheckedChange={field.onChange} />
+            </FormControl>
+            <Label htmlFor="shrink">{t("mainConfig.shrink")}</Label>
+          </FormItem>
+        )}
+      />
+    </div>
+  ), [form.control, t]);
+
+  return (
+    <FormProvider {...form}>
+      <Card>
+        <CardHeader className="pb-1">
+          <CardTitle className="text-md flex items-center gap-2">
+            <ServerIcon className="h-5 w-5" />
+            <span>{t("configs.main-config")}</span>
+          </CardTitle>
+        </CardHeader>
+        <CardContent className="space-y-4">
+          <FormField
+            control={form.control}
+            name="probeMethod"
+            render={({ field }) => (
+              <FormFieldItem>
+                <FormFieldLabel>探测方式</FormFieldLabel>
+                <Select onValueChange={field.onChange} defaultValue={field.value}>
+                  <FormControl>
+                    <SelectTrigger>
+                      <SelectValue />
+                    </SelectTrigger>
+                  </FormControl>
+                  <SelectContent>
+                    {PROBE_METHOD_OPTIONS.map(({ value, label }) => (
+                      <SelectItem key={value} value={value}>
+                        {label}
+                      </SelectItem>
+                    ))}
+                  </SelectContent>
+                </Select>
+                <FormMessage />
+              </FormFieldItem>
+            )}
+          />
+
+          {watchedProbeMethod === "ResponseBody" && MiddlewareSelect}
+          {watchedProbeMethod === "DNSLog" && DNSLogSection}
+          {watchedProbeMethod && ContentOptionsSelect}
+          {SwitchGroup}
+          {renderDynamicFields()}
+          <Separator />
+          <FormField
+            control={form.control}
+            name="shellClassName"
+            render={({ field }) => (
+              <FormFieldItem>
+                <FormFieldLabel htmlFor="shellClassName">
+                  {t("mainConfig.shellClassName")} {t("optional")}
+                </FormFieldLabel>
+                <Input id="shellClassName" {...field} placeholder={t("placeholders.input")} />
+              </FormFieldItem>
+            )}
+          />
+        </CardContent>
+      </Card>
+    </FormProvider>
+  );
+}

web/src/components/probe/package-config-card.tsx

@@ -0,0 +1,93 @@
+import { PackageIcon } from "lucide-react";
+import { useEffect, useState } from "react";
+import { FormProvider, type UseFormReturn } from "react-hook-form";
+import { useTranslation } from "react-i18next";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card.tsx";
+import { FormControl, FormField, FormItem, FormLabel } from "@/components/ui/form.tsx";
+import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group.tsx";
+import type { ProbeFormSchema } from "@/types/schema";
+import type { PackerConfig } from "@/types/shell.ts";
+
+type Option = {
+  name: string;
+  value: string;
+};
+
+export default function PackageConfigCard({
+  packerConfig,
+  form,
+}: Readonly<{
+  packerConfig: PackerConfig | undefined;
+  form: UseFormReturn<ProbeFormSchema>;
+}>) {
+  const [options, setOptions] = useState<Array<Option>>([]);
+  const { t } = useTranslation();
+
+  useEffect(() => {
+    const filteredOptions = (packerConfig ?? []).filter((name) => {
+      return !name.startsWith("Agent") && !name.toLowerCase().startsWith("xxl");
+    });
+
+    const mappedOptions = filteredOptions.map((name) => {
+      return {
+        name: t(`packageConfig.packer.${name}`),
+        value: name,
+      };
+    });
+
+    setOptions(mappedOptions);
+    const currentValue = form.getValues("packingMethod");
+    if (filteredOptions.length > 0 && (!currentValue || !filteredOptions.includes(currentValue))) {
+      form.setValue("packingMethod", filteredOptions[0]);
+    }
+  }, [form, packerConfig, t]);
+
+  return (
+    <Card className="w-full">
+      <CardHeader className="pb-1">
+        <CardTitle className="text-md flex items-center gap-2">
+          <PackageIcon className="h-5" />
+          <span>{t("configs.package-config")}</span>
+        </CardTitle>
+      </CardHeader>
+      <CardContent>
+        {options.length > 0 ? (
+          <FormProvider {...form}>
+            <FormField
+              control={form.control}
+              name="packingMethod"
+              render={({ field }) => (
+                <FormItem className="space-y-3">
+                  <FormLabel>{t("packageConfig.title")}</FormLabel>
+                  <FormControl>
+                    <RadioGroup
+                      onValueChange={field.onChange}
+                      value={field.value}
+                      className="grid grid-cols-2 md:grid-cols-3"
+                    >
+                      {options.map(({ name, value }) => (
+                        <FormItem key={value} className="flex items-center space-x-3 space-y-0">
+                          <FormControl>
+                            <RadioGroupItem value={value} id={value} />
+                          </FormControl>
+                          <FormLabel className="text-xs" htmlFor={value}>
+                            {name}
+                          </FormLabel>
+                        </FormItem>
+                      ))}
+                    </RadioGroup>
+                  </FormControl>
+                </FormItem>
+              )}
+            />
+          </FormProvider>
+        ) : (
+          <div className="flex items-center justify-center p-4 space-x-2">
+            <div className="h-4 w-4 animate-spin rounded-full border-2 border-primary border-t-transparent" />
+            <span className="text-sm text-muted-foreground">{t("loading")}</span>
+          </div>
+        )}
+      </CardContent>
+    </Card>
+  );
+}

web/src/components/probe/quick-usage.tsx

@@ -0,0 +1,26 @@
+import { ScrollTextIcon } from "lucide-react";
+import { useTranslation } from "react-i18next";
+import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card.tsx";
+
+export function QuickUsage() {
+  const { t } = useTranslation();
+  return (
+    <Card>
+      <CardHeader>
+        <CardTitle className="text-md flex items-center gap-2">
+          <ScrollTextIcon className="h-5" />
+          <span>{t("quickUsage.title")}</span>
+        </CardTitle>
+      </CardHeader>
+      <CardContent>
+        <ol className="list-decimal list-inside space-y-4 text-sm">
+          <li>{t("quickUsage.step1")}</li>
+          <li>{t("quickUsage.step2")}</li>
+          <li>{t("quickUsage.step3")}</li>
+          <li>{t("quickUsage.step4")}</li>
+          <li>{t("quickUsage.step5")}</li>
+        </ol>
+      </CardContent>
+    </Card>
+  );
+}

web/src/components/probe/shell-result.tsx

@@ -0,0 +1,57 @@
+import { useTranslation } from "react-i18next";
+import { QuickUsage } from "@/components/probe/quick-usage";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs.tsx";
+import type { ProbeGenerateResult } from "@/types/probe";
+import CodeViewer from "../code-viewer";
+import { MultiPackResult } from "../memshell/results/multi-packer";
+import { BasicInfo } from "./basic-info";
+
+export default function ShellResult({
+  packResult,
+  allPackResults,
+  packMethod,
+  generateResult,
+}: Readonly<{
+  packResult: string | undefined;
+  allPackResults: Map<string, string> | undefined;
+  packMethod: string;
+  generateResult?: ProbeGenerateResult;
+}>) {
+  const { t } = useTranslation();
+  if (!generateResult) {
+    return <QuickUsage />;
+  }
+  const showCode = packMethod === "JSP";
+  return (
+    <Tabs defaultValue="packResult">
+      <TabsList className="grid w-full grid-cols-1">
+        <TabsTrigger value="packResult">{t("generateResult.title1")}</TabsTrigger>
+      </TabsList>
+      <TabsContent value="packResult" className="my-2 space-y-4">
+        <BasicInfo generateResult={generateResult} />
+        {
+          allPackResults && <MultiPackResult allPackResults={allPackResults} packMethod={packMethod} />
+        }
+        {
+          packResult && (
+                <CodeViewer
+                  code={packResult}
+                  header={
+                    <div className="flex items-center justify-between text-xs gap-2">
+                      <span>
+                        {t("packageConfig.title")}：{packMethod}
+                      </span>
+                      <span className="text-muted-foreground">({packResult?.length})</span>
+                    </div>
+                  }
+                  wrapLongLines={!showCode}
+                  showLineNumbers={showCode}
+                  language={showCode ? "java" : "text"}
+                  height={350}
+                />
+              )
+        }
+      </TabsContent>
+    </Tabs>
+  );
+}