fix(ui): remove invalid MUI v5 Button loading prop project-wide
prop loading روی Button فقط در MUI v6+ پشتیبانی میشود؛ این پروژه v5 است و هشدار "Received false for a non-boolean attribute loading" میداد. - دکمههای login/verify: disabled + CircularProgress شرطی (بازخورد بصری حفظ شد) - بقیه دکمهها: loading → disabled (ادغام با disabled موجود در صورت وجود) Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -98,7 +98,7 @@ function ItemDoctor({ doctor, loading, setDoctors, priority = false }) {
|
||||
<Button
|
||||
variant="contained"
|
||||
onClick={handleLoading}
|
||||
loading={doctor?.loading}
|
||||
disabled={doctor?.loading}
|
||||
className="!p-[14px] !absolute !left-4 !bottom-4 !rounded-full !w-fit"
|
||||
>
|
||||
<div className={doctor && doctor.loading ? "opacity-0" : ""}>
|
||||
|
||||
@@ -42,7 +42,7 @@ function ModalLogout({ open, handleClose }) {
|
||||
</Button>
|
||||
<Button
|
||||
onClick={logout}
|
||||
loading={loading}
|
||||
disabled={loading}
|
||||
variant="contained"
|
||||
className="!py-[4px] md:!py-[6px] !min-h-[32px] md:!min-h-[39px] lg:!min-h-[46px] lg:!py-[8px] !px-[10px] md:!px-[14px] lg:!px-[18px] !rounded-[4px] !text-[12px] md:!text-[14px] lg:!text-[16px] !font-medium"
|
||||
>
|
||||
|
||||
@@ -50,7 +50,7 @@ function SendAnswer({ data }) {
|
||||
updateValue={(val) => setComment(val)}
|
||||
/>
|
||||
<Button
|
||||
loading={loading}
|
||||
disabled={loading}
|
||||
onClick={sendReq}
|
||||
variant="contained"
|
||||
className="!p-2 !h-10 !text-[12px] !font-medium sm:!py-[10px] md:!px-[12px] !rounded-[8px]
|
||||
|
||||
@@ -45,7 +45,7 @@ function SendAppo({ hour, setStep, setSelectedSlot, date, setSelectedDate }) {
|
||||
<Button
|
||||
className="!gap-[4px] !text-[16px] !font-medium !shadow-none !px-[12px] !py-[8px] md:!py-[9px] !w-full md:!w-fit !min-w-[157px]"
|
||||
variant="contained"
|
||||
loading={loading}
|
||||
disabled={loading}
|
||||
onClick={sendReq}
|
||||
disabled={!hour}
|
||||
>
|
||||
|
||||
@@ -74,7 +74,7 @@ function Content({
|
||||
</div>
|
||||
<div className="w-full flex justify-end">
|
||||
<Button
|
||||
loading={loading}
|
||||
disabled={loading}
|
||||
className="!w-full md:!w-fit !flex !px-3 items-center justify-center gap-1 mr-auto"
|
||||
onClick={handleClick}
|
||||
variant="contained"
|
||||
|
||||
@@ -129,7 +129,7 @@ function SubmitData({ setStep, data, prevData, setErrors, doctor, selectedSlot,
|
||||
return (
|
||||
<ButtonFixed>
|
||||
<Button
|
||||
loading={loading}
|
||||
disabled={loading}
|
||||
className={`
|
||||
!flex !w-full md:!w-fit !mt-0 md:!mt-[32px]
|
||||
!gap-[4px] md:!mr-auto !px-[12px] !py-[8px] md:!py-[9px] !min-w-[150px]
|
||||
|
||||
@@ -16,7 +16,7 @@ function ButtonApply({ sendReq, setOpen }) {
|
||||
return (
|
||||
<div className="flex justify-end w-full">
|
||||
<Button
|
||||
loading={loading}
|
||||
disabled={loading}
|
||||
variant="contained"
|
||||
onClick={handleClick}
|
||||
className="!px-3 !py-2 !text-[16px] !font-medium"
|
||||
|
||||
@@ -29,7 +29,7 @@ function SendReq({ filter, setFilter, setDataInURL, sendReq }) {
|
||||
};
|
||||
return (
|
||||
<Button
|
||||
loading={loading}
|
||||
disabled={loading}
|
||||
onClick={filterData}
|
||||
className="!flex !m-1 !rounded-[4px] !w-[36px] sm:!w-[42px] md:!w-[49px] lg:!w-[56px] !min-w-[36px] sm:!min-w-[42px] md:!min-w-[49px] lg:!min-w-[56px]
|
||||
!gap-2.5 !p-2.5 md:!p-4 !h-[calc(100%_-_8px)]"
|
||||
|
||||
@@ -21,7 +21,7 @@ function FilterButton({ limit, selected, filterData }) {
|
||||
return (
|
||||
<Button
|
||||
onClick={sendReq}
|
||||
loading={loading}
|
||||
disabled={loading}
|
||||
className="
|
||||
!rounded-[4px] !gap-2.5 !p-2 md:!p-3 lg:!p-4 !grid !place-items-center
|
||||
!w-[38px] sm:!w-[44px] md:!w-[50px] lg:!w-[56px]
|
||||
|
||||
@@ -73,7 +73,7 @@ function Content({
|
||||
<div className="w-full flex justify-end">
|
||||
<Button
|
||||
color="primary"
|
||||
loading={loading}
|
||||
disabled={loading}
|
||||
variant="contained"
|
||||
onClick={handleFilter}
|
||||
disabled={!selected.city || !selected.province}
|
||||
|
||||
@@ -68,7 +68,7 @@ function ItemClinic({ setFilteredClinics, data, loading }) {
|
||||
<Link href={`/clinic/${data.uuid}`}>
|
||||
<Button
|
||||
onClick={handleLoading}
|
||||
loading={data?.loading}
|
||||
disabled={data?.loading}
|
||||
className="!bg-[#5559CE] !p-[14px] !absolute !left-4 !bottom-4 !rounded-full !w-fit"
|
||||
>
|
||||
<div className={data && data.loading ? "opacity-0" : ""}>
|
||||
|
||||
@@ -90,8 +90,7 @@ function ButtonSendData({
|
||||
<Button
|
||||
variant="contained"
|
||||
onClick={sendReq}
|
||||
loading={loading}
|
||||
disabled={isDisabled()}
|
||||
disabled={loading || isDisabled()}
|
||||
className={`!gap-[4px] !mr-auto !text-nowrap !flex !flex-nowrap !py-[8px]
|
||||
!rounded-[4px] !text-[14px] md:!text-[16px] !font-medium
|
||||
!mt-[32px] sm:!mt-[38px] md:!mt-[43px] lg:!mt-[48px] !px-[16px] sm:!px-[19px] md:!px-[22px] lg:!px-[24px]
|
||||
|
||||
@@ -79,7 +79,7 @@ function Form({
|
||||
/>
|
||||
<Button
|
||||
onClick={sendReq}
|
||||
loading={loading}
|
||||
disabled={loading}
|
||||
variant="contained"
|
||||
className="!py-2.5 !mr-auto !px-4 gap-1 !text-[14px] !font-medium !mt-[32px] !shadownon"
|
||||
>
|
||||
|
||||
@@ -52,10 +52,9 @@ function SendReq({ img, data, resetData }) {
|
||||
<div className="mt-[40px] w-full flex justify-end">
|
||||
<Button
|
||||
className="!w-full md:!w-fit !shadow-none !rounded-[4px] !gap-[4px] !text-[#EFEFEF] !text-[14px] md:!text-[16px] !font-medium"
|
||||
disabled={!checkAllValues(data)}
|
||||
disabled={loading || !checkAllValues(data)}
|
||||
variant="contained"
|
||||
onClick={saveImg}
|
||||
loading={loading}
|
||||
>
|
||||
<p className={loading ? "opacity-0" : ""}>ثبت اطلاعات</p>
|
||||
<div className={!checkAllValues(data) ? "opacity-40" : "opacity-100"}>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import Field from "@/app/component/element/Field";
|
||||
import { validatePhoneNumber } from "@/helper";
|
||||
import { request } from "@/services/response";
|
||||
import { InputAdornment, Button } from "@mui/material";
|
||||
import { InputAdornment, Button, CircularProgress } from "@mui/material";
|
||||
import Link from "next/link";
|
||||
import { useState } from "react";
|
||||
import { toast } from "react-toastify";
|
||||
@@ -72,7 +72,7 @@ function LogInPage({ setIsSendMsg, num, setNum, setUuid, matchedCity, setStep })
|
||||
<Button
|
||||
fullWidth
|
||||
variant="contained"
|
||||
loading={loading}
|
||||
disabled={loading}
|
||||
onClick={() => {
|
||||
const checkedNum = validatePhoneNumber(num);
|
||||
if (!checkedNum.valid) {
|
||||
@@ -83,7 +83,7 @@ function LogInPage({ setIsSendMsg, num, setNum, setUuid, matchedCity, setStep })
|
||||
}}
|
||||
className="!rounded-[8px] !bg-[#5559CE] !py-[7.5px] md:!py-[8.5px] lg:!py-[10px]"
|
||||
>
|
||||
ورود
|
||||
{loading ? <CircularProgress size={22} sx={{ color: "#fff" }} /> : "ورود"}
|
||||
</Button>
|
||||
<p className="text-[#525252] text-[14px] font-normal text-center mt-[34px] sm:mt-[36px] md:mt-[38px] lg:mt-[40px]">
|
||||
<Link href="/">
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { Button } from "@mui/material";
|
||||
import { Button, CircularProgress } from "@mui/material";
|
||||
import { request } from "@/services/response";
|
||||
import Cookies from "js-cookie";
|
||||
import { handleTimeExpiresToken } from "@/helper";
|
||||
@@ -112,7 +112,7 @@ function SendReq({
|
||||
}}
|
||||
className="!rounded-[8px] !bg-[#5559CE]"
|
||||
>
|
||||
تایید
|
||||
{loading ? <CircularProgress size={22} sx={{ color: "#fff" }} /> : "تایید"}
|
||||
</Button>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user