antontranelis/utopia-ui
1
0
Fork 0
mirror of https://github.com/utopia-os/utopia-ui.git synced 2025-12-13 07:46:10 +00:00
Code Issues Packages Projects Releases Wiki Activity

delete loading spinner

Browse Source
This commit is contained in:
Anton 2023-08-23 00:11:54 +02:00
parent 539e460f84
commit b17efefda6
1 changed files with 54 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
src/Components/Map/Subcomponents/ItemPopupComponents/HeaderView.tsx
View File

@ -7,19 +7,22 @@ import { Item } from "../../../../types";
export function HeaderView({item, setItemFormPopup}: { export function HeaderView({ item, setItemFormPopup }: {
item : Item, item: Item,
setItemFormPopup?: React.Dispatch<React.SetStateAction<ItemFormPopupProps | null>> setItemFormPopup?: React.Dispatch<React.SetStateAction<ItemFormPopupProps | null>>
}) { }) {
const [loading, setLoading] = React.useState<boolean>(false);
const removeItem = useRemoveItem(); const removeItem = useRemoveItem();
const map = useMap(); const map = useMap();
const removeItemFromMap = (event: React.MouseEvent<HTMLElement>) => { const removeItemFromMap = (event: React.MouseEvent<HTMLElement>) => {
setLoading(true);
item.api?.deleteItem!(item.id) item.api?.deleteItem!(item.id)
.then( () => removeItem(item)) .then(() => removeItem(item))
.then(()=> map.closePopup()) .then(() => map.closePopup())
.then(()=>setLoading(false))
.catch(err => console.log(err)); .catch(err => console.log(err));
event.stopPropagation(); event.stopPropagation();
@ -56,9 +59,11 @@ export function HeaderView({item, setItemFormPopup}: {
{item.api.deleteItem && <li> {item.api.deleteItem && <li>
<a className='tw-bg-white hover:tw-bg-gray-300 !tw-text-red-800 hover:tw-text-red-950' onClick={removeItemFromMap}> <a className='tw-bg-white hover:tw-bg-gray-300 !tw-text-red-800 hover:tw-text-red-950' onClick={removeItemFromMap}>
{loading ? <span className="tw-loading tw-loading-spinner tw-loading-sm"></span>
:
<svg xmlns="http://www.w3.org/2000/svg" className="tw-h-5 tw-w-5" viewBox="0 0 20 20" fill="currentColor"> <svg xmlns="http://www.w3.org/2000/svg" className="tw-h-5 tw-w-5" viewBox="0 0 20 20" fill="currentColor">
<path fillRule="evenodd" d="M9 2a1 1 0 00-.894.553L7.382 4H4a1 1 0 000 2v10a2 2 0 002 2h8a2 2 0 002-2V6a1 1 0 100-2h-3.382l-.724-1.447A1 1 0 0011 2H9zM7 8a1 1 0 012 0v6a1 1 0 11-2 0V8zm5-1a1 1 0 00-1 1v6a1 1 0 102 0V8a1 1 0 00-1-1z" clipRule="evenodd" /> <path fillRule="evenodd" d="M9 2a1 1 0 00-.894.553L7.382 4H4a1 1 0 000 2v10a2 2 0 002 2h8a2 2 0 002-2V6a1 1 0 100-2h-3.382l-.724-1.447A1 1 0 0011 2H9zM7 8a1 1 0 012 0v6a1 1 0 11-2 0V8zm5-1a1 1 0 00-1 1v6a1 1 0 102 0V8a1 1 0 00-1-1z" clipRule="evenodd" />
</svg> </svg>}
</a> </a>
</li>} </li>}
</ul> </ul>