fix: add missing tutorial access to DNS service modal in profile
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>
This commit is contained in:
@@ -146,6 +146,7 @@ const ConfigItem = ({
|
|||||||
dnsRegistrationExpired={dnsRegistrationExpired}
|
dnsRegistrationExpired={dnsRegistrationExpired}
|
||||||
dnsExpiresAt={dnsExpiresAt}
|
dnsExpiresAt={dnsExpiresAt}
|
||||||
canRenew={canRenew}
|
canRenew={canRenew}
|
||||||
|
categoryId={categoryId}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
<div className="relative w-full h-full rounded-md">
|
<div className="relative w-full h-full rounded-md">
|
||||||
|
|||||||
@@ -1,11 +1,13 @@
|
|||||||
import { useState } from "react";
|
import { useState } from "react";
|
||||||
import toast from "react-hot-toast";
|
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 { MdOutlineDns } from "react-icons/md";
|
||||||
import { FaBolt } from "react-icons/fa6";
|
import { FaBolt } from "react-icons/fa6";
|
||||||
import { BsShieldExclamation } from "react-icons/bs";
|
import { BsShieldExclamation } from "react-icons/bs";
|
||||||
import { useMutation } from "@tanstack/react-query";
|
import { useMutation } from "@tanstack/react-query";
|
||||||
import { AxiosError } from "axios";
|
import { AxiosError } from "axios";
|
||||||
|
import { useDispatch } from "react-redux";
|
||||||
|
import { useNavigate } from "react-router-dom";
|
||||||
import MuiModal from "../../../../common/modal";
|
import MuiModal from "../../../../common/modal";
|
||||||
import Button from "../../../../components/button";
|
import Button from "../../../../components/button";
|
||||||
import Input from "../../../../components/input";
|
import Input from "../../../../components/input";
|
||||||
@@ -13,6 +15,7 @@ import Alert from "../../../../components/alert/Alert";
|
|||||||
import { ModalDnsConfigProps } from "../../../../types/props";
|
import { ModalDnsConfigProps } from "../../../../types/props";
|
||||||
import useAxios from "../../../../hooks/useAxios";
|
import useAxios from "../../../../hooks/useAxios";
|
||||||
import { queryClient } from "../../../../main";
|
import { queryClient } from "../../../../main";
|
||||||
|
import { setCategoryId } from "../../../../redux/slices/categoryId";
|
||||||
|
|
||||||
const IPV4_ADDRESS_REGEX = /^(\d{1,3}\.){3}\d{1,3}$/;
|
const IPV4_ADDRESS_REGEX = /^(\d{1,3}\.){3}\d{1,3}$/;
|
||||||
|
|
||||||
@@ -50,11 +53,21 @@ const ModalDnsConfig = ({
|
|||||||
dnsRegistrationExpired,
|
dnsRegistrationExpired,
|
||||||
dnsExpiresAt,
|
dnsExpiresAt,
|
||||||
canRenew,
|
canRenew,
|
||||||
|
categoryId,
|
||||||
}: ModalDnsConfigProps) => {
|
}: ModalDnsConfigProps) => {
|
||||||
const axios = useAxios();
|
const axios = useAxios();
|
||||||
|
const dispatch = useDispatch();
|
||||||
|
const navigate = useNavigate();
|
||||||
const [ip, setIp] = useState("");
|
const [ip, setIp] = useState("");
|
||||||
const [isDetecting, setIsDetecting] = useState(false);
|
const [isDetecting, setIsDetecting] = useState(false);
|
||||||
|
|
||||||
|
const goToTutorial = () => {
|
||||||
|
if (!categoryId) return;
|
||||||
|
dispatch(setCategoryId(categoryId));
|
||||||
|
setIsOpen(false);
|
||||||
|
navigate("/tutorial");
|
||||||
|
};
|
||||||
|
|
||||||
const renewMutation = useMutation({
|
const renewMutation = useMutation({
|
||||||
mutationKey: ["renewDnsOrder", orderId],
|
mutationKey: ["renewDnsOrder", orderId],
|
||||||
mutationFn: () => {
|
mutationFn: () => {
|
||||||
@@ -158,6 +171,15 @@ const ModalDnsConfig = ({
|
|||||||
return (
|
return (
|
||||||
<MuiModal isOpenModal={isOpen} setIsOpenModal={setIsOpen} nameService={nameConfig}>
|
<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">
|
<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 && (
|
{dnsRegistrationExpired && (
|
||||||
<Alert type="danger" extra="!mb-0 !rounded-lg">
|
<Alert type="danger" extra="!mb-0 !rounded-lg">
|
||||||
مهلت این سرویس به پایان رسیده است. برای ادامه استفاده، سرویس را تمدید کنید
|
مهلت این سرویس به پایان رسیده است. برای ادامه استفاده، سرویس را تمدید کنید
|
||||||
|
|||||||
1
src/types/props.d.ts
vendored
1
src/types/props.d.ts
vendored
@@ -154,6 +154,7 @@ export interface ModalDnsConfigProps {
|
|||||||
dnsRegistrationExpired?: boolean;
|
dnsRegistrationExpired?: boolean;
|
||||||
dnsExpiresAt?: string | null;
|
dnsExpiresAt?: string | null;
|
||||||
canRenew?: boolean;
|
canRenew?: boolean;
|
||||||
|
categoryId?: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
// نوع Item برای آیتمهای داخل Dropdown
|
// نوع Item برای آیتمهای داخل Dropdown
|
||||||
|
|||||||
Reference in New Issue
Block a user