diff --git a/src/components/CreateProfileModal/CreateProfileModal.tsx b/src/components/CreateProfileModal/CreateProfileModal.tsx index 9fda54b2..d7a2854a 100644 --- a/src/components/CreateProfileModal/CreateProfileModal.tsx +++ b/src/components/CreateProfileModal/CreateProfileModal.tsx @@ -41,6 +41,7 @@ export default function CreateProfileModal({ setIsOpen, isOpen }: NewRepoModalPr }) function closeModal() { + if (isSubmitting) return setIsOpen(false) } diff --git a/src/components/DragonDeploy/ArNSUpdateModal.tsx b/src/components/DragonDeploy/ArNSUpdateModal.tsx index 2f6c9192..354fa0a4 100644 --- a/src/components/DragonDeploy/ArNSUpdateModal.tsx +++ b/src/components/DragonDeploy/ArNSUpdateModal.tsx @@ -7,6 +7,7 @@ import SVG from 'react-inlinesvg' import CloseCrossIcon from '@/assets/icons/close-cross.svg' import { Button } from '@/components/common/buttons' +import useCursorNotAllowed from '@/helpers/hooks/useCursorNotAllowded' import { withAsync } from '@/helpers/withAsync' import { getANT, getDomainStatus, updateArNSDomain } from '@/lib/dragondeploy/arns' import { useGlobalStore } from '@/stores/globalStore' @@ -19,7 +20,7 @@ export default function ArNSDomainModal() { const [isLoading, setIsLoading] = useState(false) const [domainTxId, setDomainTxId] = useState('') const [intervalValue, setIntervalValue] = useState() - + const { cursorNotAllowed, closeModalCursor } = useCursorNotAllowed(isLoading) const [connectedAddress, selectedRepo, updateDomain] = useGlobalStore((state) => [ state.authState.address, state.repoCoreState.selectedRepo.repo, @@ -41,6 +42,7 @@ export default function ArNSDomainModal() { }, [deployment, domainTxId, domain]) function closeModal() { + if (isLoading) return setIsOpen(false) } @@ -145,7 +147,7 @@ export default function ArNSDomainModal() { ArNS Domain - + ArNS Domain - +
@@ -198,12 +200,16 @@ export default function ArNSDomainModal() {
{!updateNeeded && !isUpdated && isOnline && Update in progress...} {updateNeeded && Update to latest deployment?} - {!isOnline && Note: It might take ~30 minutes for the domain to go live.} + {!isOnline && ( + + Note: It might take ~30 minutes for the domain to go live. + + )}
diff --git a/src/components/DragonDeploy/DragonDeploy.tsx b/src/components/DragonDeploy/DragonDeploy.tsx index ebd85ed8..bde28894 100644 --- a/src/components/DragonDeploy/DragonDeploy.tsx +++ b/src/components/DragonDeploy/DragonDeploy.tsx @@ -1,4 +1,5 @@ import { Dialog, Transition } from '@headlessui/react' +import clsx from 'clsx' import { useEffect, useState } from 'react' import { Fragment } from 'react' import toast from 'react-hot-toast' @@ -7,6 +8,7 @@ import SVG from 'react-inlinesvg' import CloseCrossIcon from '@/assets/icons/close-cross.svg' import { Button } from '@/components/common/buttons' import CostEstimatesToolTip from '@/components/CostEstimatesToolTip' +import useCursorNotAllowed from '@/helpers/hooks/useCursorNotAllowded' import { type Commit, type File, @@ -28,6 +30,7 @@ export default function DragonDeploy() { const [currentDeployment, setCurrentDeployment] = useState() const [uploadPercent, setUploadPercent] = useState(0) const [branchToRestore, setBranchToRestore] = useState('') + const { cursorNotAllowed, closeModalCursor } = useCursorNotAllowed(isDeploying) const [currentBranch, selectedRepo, branchState, branchActions, addDeployment] = useGlobalStore((state) => [ state.branchState.currentBranch, state.repoCoreState.selectedRepo.repo, @@ -53,6 +56,7 @@ export default function DragonDeploy() { }, [isOpen]) function closeModal() { + if (isDeploying) return setIsOpen(false) } @@ -115,7 +119,7 @@ export default function DragonDeploy() { Dragon Deploy - + Dragon Deploy - +
@@ -188,7 +192,7 @@ export default function DragonDeploy() {
@@ -146,9 +152,11 @@ export default function NewRepoModal({ setIsOpen, isOpen }: NewRepoModalProps) { {...register('title')} className={clsx( 'bg-white border-[1px] text-gray-900 text-base rounded-lg hover:shadow-[0px_2px_4px_0px_rgba(0,0,0,0.10)] focus:border-primary-500 focus:border-[1.5px] block w-full px-3 py-[10px] outline-none', - errors.title ? 'border-red-500' : 'border-gray-300' + errors.title ? 'border-red-500' : 'border-gray-300', + cursorNotAllowed )} placeholder="my-cool-repo" + disabled={isSubmitting} /> {errors.title &&

{errors.title?.message}

}
@@ -161,9 +169,11 @@ export default function NewRepoModal({ setIsOpen, isOpen }: NewRepoModalProps) { {...register('description')} className={clsx( 'bg-white border-[1px] text-gray-900 text-base rounded-lg hover:shadow-[0px_2px_4px_0px_rgba(0,0,0,0.10)] focus:border-primary-500 focus:border-[1.5px] block w-full px-3 py-[10px] outline-none', - errors.description ? 'border-red-500' : 'border-gray-300' + errors.description ? 'border-red-500' : 'border-gray-300', + cursorNotAllowed )} placeholder="A really cool repo fully decentralized" + disabled={isSubmitting} /> {errors.description && (

{errors.description?.message}

@@ -179,7 +189,10 @@ export default function NewRepoModal({ setIsOpen, isOpen }: NewRepoModalProps) { onChange={handleRepositoryVisibilityChange} value="public" defaultChecked - className="mr-2 rounded-full h-4 w-4 checked:accent-primary-700 accent-primary-600 bg-white focus:ring-primary-600 outline-none" + className={clsx( + 'mr-2 rounded-full h-4 w-4 checked:accent-primary-700 accent-primary-600 bg-white focus:ring-primary-600 outline-none', + cursorNotAllowed + )} /> Public @@ -190,7 +203,10 @@ export default function NewRepoModal({ setIsOpen, isOpen }: NewRepoModalProps) { disabled={authState.method === 'othent'} onChange={handleRepositoryVisibilityChange} value="private" - className="mr-2 rounded-full h-4 w-4 checked:accent-primary-700 accent-primary-600 bg-white focus:ring-primary-600 outline-none" + className={clsx( + 'mr-2 rounded-full h-4 w-4 checked:accent-primary-700 accent-primary-600 bg-white focus:ring-primary-600 outline-none', + cursorNotAllowed + )} /> Private @@ -205,7 +221,7 @@ export default function NewRepoModal({ setIsOpen, isOpen }: NewRepoModalProps) {
@@ -115,12 +119,14 @@ export default function NewBountyModal({ isOpen, setIsOpen }: NewBountyModalProp {...register('amount')} className={clsx( 'bg-white border-[1px] text-gray-900 text-base rounded-lg hover:shadow-[0px_2px_4px_0px_rgba(0,0,0,0.10)] focus:border-primary-500 focus:border-[1.5px] block w-full px-3 py-[10px] outline-none', - errors.amount ? 'border-red-500' : 'border-gray-300' + errors.amount ? 'border-red-500' : 'border-gray-300', + cursorNotAllowed )} step="0.5" type="number" placeholder="2" min={'0'} + disabled={isSubmitting} />
AR @@ -137,11 +143,13 @@ export default function NewBountyModal({ isOpen, setIsOpen }: NewBountyModalProp {...register('expiry')} className={clsx( 'bg-white border-[1px] text-gray-900 text-base rounded-lg hover:shadow-[0px_2px_4px_0px_rgba(0,0,0,0.10)] focus:border-primary-500 focus:border-[1.5px] block w-full px-3 py-[10px] outline-none', - errors.expiry ? 'border-red-500' : 'border-gray-300' + errors.expiry ? 'border-red-500' : 'border-gray-300', + cursorNotAllowed )} type="date" min={new Date().toISOString().split('T')[0]} placeholder="2" + disabled={isSubmitting} />
{errors.expiry &&

{errors.expiry.message}

} @@ -151,7 +159,7 @@ export default function NewBountyModal({ isOpen, setIsOpen }: NewBountyModalProp
@@ -107,7 +119,8 @@ export default function ReadBountyModal({ isOpen, setIsOpen, bounty, author }: N setBountyComplete(evt.target.checked)} + disabled={isSubmitting} /> Mark this bounty complete?
@@ -149,18 +163,20 @@ export default function ReadBountyModal({ isOpen, setIsOpen, bounty, author }: N setPayTxId(evt.target.value)} + disabled={isSubmitting} />
)}
@@ -146,9 +149,11 @@ export default function ForkModal({ setIsOpen, isOpen, repo }: NewRepoModalProps {...register('title')} className={clsx( 'bg-white border-[1px] text-gray-900 text-base rounded-lg hover:shadow-[0px_2px_4px_0px_rgba(0,0,0,0.10)] focus:border-primary-500 focus:border-[1.5px] block w-full px-3 py-[10px] outline-none', - errors.title ? 'border-red-500' : 'border-gray-300' + errors.title ? 'border-red-500' : 'border-gray-300', + cursorNotAllowed )} placeholder="my-cool-repo" + disabled={isSubmitting} /> {errors.title &&

{errors.title?.message}

}
@@ -161,9 +166,11 @@ export default function ForkModal({ setIsOpen, isOpen, repo }: NewRepoModalProps {...register('description')} className={clsx( 'bg-white border-[1px] text-gray-900 text-base rounded-lg hover:shadow-[0px_2px_4px_0px_rgba(0,0,0,0.10)] focus:border-primary-500 focus:border-[1.5px] block w-full px-3 py-[10px] outline-none', - errors.description ? 'border-red-500' : 'border-gray-300' + errors.description ? 'border-red-500' : 'border-gray-300', + cursorNotAllowed )} placeholder="A really cool repo fully decentralized" + disabled={isSubmitting} /> {errors.description && (

{errors.description?.message}

@@ -175,7 +182,7 @@ export default function ForkModal({ setIsOpen, isOpen, repo }: NewRepoModalProps
@@ -148,9 +151,11 @@ export default function CommitFilesModal({ setIsOpen, setIsCommited, isOpen, fil {...register('commit')} className={clsx( 'bg-white border-[1px] text-gray-900 text-base rounded-lg hover:shadow-[0px_2px_4px_0px_rgba(0,0,0,0.10)] focus:border-primary-500 focus:border-[1.5px] block w-full px-3 py-[10px] outline-none', - errors.commit ? 'border-red-500' : 'border-gray-300' + errors.commit ? 'border-red-500' : 'border-gray-300', + cursorNotAllowed )} placeholder="Example: Add README.md file" + disabled={isSubmitting} /> {errors.commit &&

{errors.commit?.message}

}
@@ -162,7 +167,7 @@ export default function CommitFilesModal({ setIsOpen, setIsCommited, isOpen, fil
Upload files
- + {files.length === 0 && (
{!isDragActive && ( @@ -201,9 +210,11 @@ export default function AddFilesModal({ setIsOpen, isOpen }: NewBranchModal) { {...register('commit')} className={clsx( 'bg-white border-[1px] text-gray-900 text-base rounded-lg hover:shadow-[0px_2px_4px_0px_rgba(0,0,0,0.10)] focus:border-primary-500 focus:border-[1.5px] block w-full px-3 py-[10px] outline-none', - errors.commit ? 'border-red-500' : 'border-gray-300' + errors.commit ? 'border-red-500' : 'border-gray-300', + cursorNotAllowed )} placeholder="Example: Add README.md file" + disabled={isSubmitting} /> {errors.commit &&

{errors.commit?.message}

}
@@ -215,7 +226,7 @@ export default function AddFilesModal({ setIsOpen, isOpen }: NewBranchModal) {
@@ -141,9 +144,11 @@ export default function NewBranchModal({ setIsOpen, isOpen, addNewBranch }: NewB {...register('name')} className={clsx( 'bg-white border-[1px] text-gray-900 text-base rounded-lg hover:shadow-[0px_2px_4px_0px_rgba(0,0,0,0.10)] focus:border-primary-500 focus:border-[1.5px] block w-full px-3 py-[10px] outline-none', - errors.name ? 'border-red-500' : 'border-gray-300' + errors.name ? 'border-red-500' : 'border-gray-300', + cursorNotAllowed )} placeholder="feature/my-cool-feature" + disabled={isSubmitting} /> {errors.name &&

{errors.name?.message}

}
@@ -152,7 +157,7 @@ export default function NewBranchModal({ setIsOpen, isOpen, addNewBranch }: NewB