From fb70f3204807284599187130070a44c8f40311dc Mon Sep 17 00:00:00 2001
From: soheil khaledabadi <soheilkhaledabdi@gmail.com>
Date: Tue, 15 Sep 2026 23:37:07 +0330
Subject: [PATCH] fix: add missing tutorial access to DNS service modal in
 profile
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The "آموزش" button only appeared in the desktop-only action row, and
the modal that opens for DNS on mobile (ModalDnsConfig) never had a
tutorial link at all, unlike ModalConfigDetails for other config
types. DNS users therefore had no way to reach /tutorial on mobile.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
---
 .../profile/section/components/ConfigItem.tsx |  1 +
 .../section/components/ModalDnsConfig.tsx     | 24 ++++++++++++++++++-
 src/types/props.d.ts                          |  1 +
 3 files changed, 25 insertions(+), 1 deletion(-)

diff --git a/src/pages/profile/section/components/ConfigItem.tsx b/src/pages/profile/section/components/ConfigItem.tsx
index 7de72f3..2bc8248 100644
--- a/src/pages/profile/section/components/ConfigItem.tsx
+++ b/src/pages/profile/section/components/ConfigItem.tsx
@@ -146,6 +146,7 @@ const ConfigItem = ({
           dnsRegistrationExpired={dnsRegistrationExpired}
           dnsExpiresAt={dnsExpiresAt}
           canRenew={canRenew}
+          categoryId={categoryId}
         />
       )}
       <div className="relative w-full h-full rounded-md">
diff --git a/src/pages/profile/section/components/ModalDnsConfig.tsx b/src/pages/profile/section/components/ModalDnsConfig.tsx
index 7abc76a..93432d5 100644
--- a/src/pages/profile/section/components/ModalDnsConfig.tsx
+++ b/src/pages/profile/section/components/ModalDnsConfig.tsx
@@ -1,11 +1,13 @@
 import { useState } from "react";
 import toast from "react-hot-toast";
-import { IoCopyOutline, IoWifiOutline } from "react-icons/io5";
+import { IoCopyOutline, IoSchoolOutline, IoWifiOutline } from "react-icons/io5";
 import { MdOutlineDns } from "react-icons/md";
 import { FaBolt } from "react-icons/fa6";
 import { BsShieldExclamation } from "react-icons/bs";
 import { useMutation } from "@tanstack/react-query";
 import { AxiosError } from "axios";
+import { useDispatch } from "react-redux";
+import { useNavigate } from "react-router-dom";
 import MuiModal from "../../../../common/modal";
 import Button from "../../../../components/button";
 import Input from "../../../../components/input";
@@ -13,6 +15,7 @@ import Alert from "../../../../components/alert/Alert";
 import { ModalDnsConfigProps } from "../../../../types/props";
 import useAxios from "../../../../hooks/useAxios";
 import { queryClient } from "../../../../main";
+import { setCategoryId } from "../../../../redux/slices/categoryId";
 
 const IPV4_ADDRESS_REGEX = /^(\d{1,3}\.){3}\d{1,3}$/;
 
@@ -50,11 +53,21 @@ const ModalDnsConfig = ({
   dnsRegistrationExpired,
   dnsExpiresAt,
   canRenew,
+  categoryId,
 }: ModalDnsConfigProps) => {
   const axios = useAxios();
+  const dispatch = useDispatch();
+  const navigate = useNavigate();
   const [ip, setIp] = useState("");
   const [isDetecting, setIsDetecting] = useState(false);
 
+  const goToTutorial = () => {
+    if (!categoryId) return;
+    dispatch(setCategoryId(categoryId));
+    setIsOpen(false);
+    navigate("/tutorial");
+  };
+
   const renewMutation = useMutation({
     mutationKey: ["renewDnsOrder", orderId],
     mutationFn: () => {
@@ -158,6 +171,15 @@ const ModalDnsConfig = ({
   return (
     <MuiModal isOpenModal={isOpen} setIsOpenModal={setIsOpen} nameService={nameConfig}>
       <div className="w-full h-full flex flex-col gap-4 max-sm:text-xs max-md:text-sm text-base">
+        {categoryId && (
+          <Button
+            onClick={goToTutorial}
+            extra="!m-0 !px-3 shadow-md self-start flex flex-row-reverse justify-center items-center gap-1.5"
+          >
+            <IoSchoolOutline className="w-4 h-4" />
+            آموزش
+          </Button>
+        )}
         {dnsRegistrationExpired && (
           <Alert type="danger" extra="!mb-0 !rounded-lg">
             مهلت این سرویس به پایان رسیده است. برای ادامه استفاده، سرویس را تمدید کنید
diff --git a/src/types/props.d.ts b/src/types/props.d.ts
index cc520be..d142c82 100644
--- a/src/types/props.d.ts
+++ b/src/types/props.d.ts
@@ -154,6 +154,7 @@ export interface ModalDnsConfigProps {
   dnsRegistrationExpired?: boolean;
   dnsExpiresAt?: string | null;
   canRenew?: boolean;
+  categoryId?: number;
 }
 
 // نوع Item برای آیتم‌های داخل Dropdown