{
- const [isOpen, setIsOpen] = useState(false);
- const [isClosing, setIsClosing] = useState(false);
+ const [open, setOpen] = useState(false);
+ const [closing, setClosing] = useState(false);
const [menuPosition, setMenuPosition] = useState({ top: 0, left: 0, width: 0 });
const [viewDate, setViewDate] = useState(props.value || new Date());
const containerRef = useRef(null);
@@ -14,10 +14,10 @@ const DatePicker = memo((props) => {
const menuRef = useRef(null);
const closeDropdown = useCallback(() => {
- setIsClosing(true);
+ setClosing(true);
setTimeout(() => {
- setIsOpen(false);
- setIsClosing(false);
+ setOpen(false);
+ setClosing(false);
}, 200);
}, []);
@@ -61,7 +61,7 @@ const DatePicker = memo((props) => {
const openDropdown = useCallback(() => {
const position = calculatePosition();
setMenuPosition(position);
- setIsOpen(true);
+ setOpen(true);
}, [calculatePosition]);
const formatDate = (date) => {
@@ -147,7 +147,7 @@ const DatePicker = memo((props) => {
ref={controlRef}
className="datepicker-control"
onClick={() => {
- if (isOpen) {
+ if (open) {
closeDropdown();
} else {
openDropdown();
@@ -155,13 +155,13 @@ const DatePicker = memo((props) => {
}}
>
{formatDate(props.value)}
-
+
- {(isOpen || isClosing) &&
+ {(open || closing) &&
createPortal(
{
const [value, setValue] = useState(localStorage.getItem(props.name) || props.items[0]?.value);
- const [isOpen, setIsOpen] = useState(false);
- const [isClosing, setIsClosing] = useState(false);
+ const [open, setOpen] = useState(false);
+ const [closing, setClosing] = useState(false);
const [focusedIndex, setFocusedIndex] = useState(-1);
const [menuPosition, setMenuPosition] = useState({ top: 0, left: 0, width: 0 });
const [searchQuery, setSearchQuery] = useState('');
@@ -22,10 +22,10 @@ const Dropdown = memo((props) => {
const searchInputRef = useRef(null);
const closeDropdown = useCallback(() => {
- setIsClosing(true);
+ setClosing(true);
setTimeout(() => {
- setIsOpen(false);
- setIsClosing(false);
+ setOpen(false);
+ setClosing(false);
setFocusedIndex(-1);
setSearchQuery('');
}, 200);
@@ -76,11 +76,11 @@ const Dropdown = memo((props) => {
const openDropdown = useCallback(() => {
const position = calculatePosition();
setMenuPosition(position);
- setIsOpen(true);
+ setOpen(true);
}, [calculatePosition]);
useEffect(() => {
- if (!isOpen) return;
+ if (!open) return;
let rafId = null;
@@ -116,32 +116,32 @@ const Dropdown = memo((props) => {
window.removeEventListener('resize', updatePosition);
scrollableElements.forEach((el) => el.removeEventListener('scroll', updatePosition));
};
- }, [isOpen, calculatePosition]);
+ }, [open, calculatePosition]);
useEffect(() => {
- if (isOpen && props.searchable && searchInputRef.current) {
+ if (open && props.searchable && searchInputRef.current) {
setTimeout(() => searchInputRef.current?.focus(), 0);
}
- }, [isOpen, props.searchable]);
+ }, [open, props.searchable]);
const handleSearchChange = useCallback(
(e) => {
setSearchQuery(e.target.value);
- if (!isOpen) {
+ if (!open) {
openDropdown();
}
},
- [isOpen, openDropdown],
+ [open, openDropdown],
);
const handleInputClick = useCallback(
(e) => {
e.stopPropagation();
- if (!isOpen) {
+ if (!open) {
openDropdown();
}
},
- [isOpen, openDropdown],
+ [open, openDropdown],
);
const handleInputFocus = useCallback(() => {
@@ -193,7 +193,7 @@ const Dropdown = memo((props) => {
case 'Enter':
case ' ':
e.preventDefault();
- if (isOpen) {
+ if (open) {
closeDropdown();
} else {
openDropdown();
@@ -204,7 +204,7 @@ const Dropdown = memo((props) => {
break;
case 'ArrowDown':
e.preventDefault();
- if (!isOpen) {
+ if (!open) {
openDropdown();
} else {
setFocusedIndex((prev) =>
@@ -214,13 +214,13 @@ const Dropdown = memo((props) => {
break;
case 'ArrowUp':
e.preventDefault();
- if (isOpen) {
+ if (open) {
setFocusedIndex((prev) => (prev > 0 ? prev - 1 : prev));
}
break;
}
},
- [isOpen, props.items, props.disabled, openDropdown, closeDropdown],
+ [open, props.items, props.disabled, openDropdown, closeDropdown],
);
const handleOptionKeyDown = useCallback(
@@ -287,11 +287,11 @@ const Dropdown = memo((props) => {
)}
{
e.stopPropagation();
if (props.disabled) return;
- if (isOpen) {
+ if (open) {
closeDropdown();
} else {
openDropdown();
@@ -300,7 +300,7 @@ const Dropdown = memo((props) => {
onKeyDown={handleKeyDown}
role="button"
aria-haspopup="listbox"
- aria-expanded={isOpen}
+ aria-expanded={open}
aria-label={label || props.name}
tabIndex={props.disabled ? -1 : 0}
>
@@ -335,13 +335,13 @@ const Dropdown = memo((props) => {
) : (
{selectedItem?.text || value}
)}
-
+
- {(isOpen || isClosing) &&
+ {(open || closing) &&
createPortal(
{
return null;
});
- const [isOpen, setIsOpen] = useState(false);
- const [isClosing, setIsClosing] = useState(false);
+ const [open, setOpen] = useState(false);
+ const [closing, setClosing] = useState(false);
const [searchQuery, setSearchQuery] = useState('');
const [suggestions, setSuggestions] = useState([]);
- const [isLoading, setIsLoading] = useState(false);
+ const [loading, setLoading] = useState(false);
const [focusedIndex, setFocusedIndex] = useState(-1);
const [menuPosition, setMenuPosition] = useState({ top: 0, left: 0, width: 0 });
@@ -41,10 +41,10 @@ const LocationSearch = memo((props) => {
const abortControllerRef = useRef(null);
const closeDropdown = useCallback(() => {
- setIsClosing(true);
+ setClosing(true);
setTimeout(() => {
- setIsOpen(false);
- setIsClosing(false);
+ setOpen(false);
+ setClosing(false);
setFocusedIndex(-1);
}, 200);
}, []);
@@ -91,11 +91,11 @@ const LocationSearch = memo((props) => {
const openDropdown = useCallback(() => {
const position = calculatePosition();
setMenuPosition(position);
- setIsOpen(true);
+ setOpen(true);
}, [calculatePosition]);
useEffect(() => {
- if (!isOpen) return;
+ if (!open) return;
let rafId = null;
const updatePosition = () => {
@@ -129,18 +129,18 @@ const LocationSearch = memo((props) => {
window.removeEventListener('resize', updatePosition);
scrollableElements.forEach((el) => el.removeEventListener('scroll', updatePosition));
};
- }, [isOpen, calculatePosition]);
+ }, [open, calculatePosition]);
useEffect(() => {
- if (isOpen && searchInputRef.current) {
+ if (open && searchInputRef.current) {
setTimeout(() => searchInputRef.current?.focus(), 0);
}
- }, [isOpen]);
+ }, [open]);
const debouncedSearch = useDebouncedCallback(async (query) => {
if (query.length < 2) {
setSuggestions([]);
- setIsLoading(false);
+ setLoading(false);
return;
}
@@ -165,7 +165,7 @@ const LocationSearch = memo((props) => {
setSuggestions([]);
}
} finally {
- setIsLoading(false);
+ setLoading(false);
}
}, 300);
@@ -173,23 +173,23 @@ const LocationSearch = memo((props) => {
(e) => {
const value = e.target.value;
setSearchQuery(value);
- setIsLoading(value.length >= 2);
+ setLoading(value.length >= 2);
debouncedSearch(value);
- if (!isOpen && value.length > 0) {
+ if (!open && value.length > 0) {
openDropdown();
}
},
- [isOpen, debouncedSearch, openDropdown],
+ [open, debouncedSearch, openDropdown],
);
const handleInputClick = useCallback(
(e) => {
e.stopPropagation();
- if (!isOpen) {
+ if (!open) {
openDropdown();
}
},
- [isOpen, openDropdown],
+ [open, openDropdown],
);
const selectLocation = useCallback(
@@ -271,7 +271,7 @@ const LocationSearch = memo((props) => {
switch (e.key) {
case 'Enter':
e.preventDefault();
- if (isOpen && focusedIndex >= 0 && suggestions[focusedIndex]) {
+ if (open && focusedIndex >= 0 && suggestions[focusedIndex]) {
selectLocation(suggestions[focusedIndex]);
}
break;
@@ -285,7 +285,7 @@ const LocationSearch = memo((props) => {
break;
case 'ArrowDown':
e.preventDefault();
- if (!isOpen && searchQuery.length >= 2) {
+ if (!open && searchQuery.length >= 2) {
openDropdown();
} else {
setFocusedIndex((prev) => (prev < suggestions.length - 1 ? prev + 1 : prev));
@@ -293,14 +293,14 @@ const LocationSearch = memo((props) => {
break;
case 'ArrowUp':
e.preventDefault();
- if (isOpen) {
+ if (open) {
setFocusedIndex((prev) => (prev > 0 ? prev - 1 : prev));
}
break;
}
},
[
- isOpen,
+ open,
suggestions,
focusedIndex,
disabled,
@@ -340,18 +340,18 @@ const LocationSearch = memo((props) => {
)}
{
e.stopPropagation();
if (disabled) return;
- if (!isOpen) {
+ if (!open) {
openDropdown();
}
}}
onKeyDown={handleKeyDown}
role="combobox"
aria-haspopup="listbox"
- aria-expanded={isOpen}
+ aria-expanded={open}
aria-label={label || name}
tabIndex={disabled ? -1 : 0}
>
@@ -366,17 +366,17 @@ const LocationSearch = memo((props) => {
onKeyDown={handleKeyDown}
/>
{searchQuery && }
- {isLoading ? (
+ {loading ? (
) : (
-
+
)}
- {(isOpen || isClosing) &&
+ {(open || closing) &&
createPortal(
{
))
- ) : searchQuery.length >= 2 && !isLoading ? (
+ ) : searchQuery.length >= 2 && !loading ? (
{variables.getMessage('widgets.weather.not_found')}
diff --git a/src/features/background/components/BackgroundImage.jsx b/src/features/background/components/BackgroundImage.jsx
index 7dc18286..71a52fc0 100644
--- a/src/features/background/components/BackgroundImage.jsx
+++ b/src/features/background/components/BackgroundImage.jsx
@@ -11,7 +11,7 @@ import { getAllBackgrounds } from 'utils/customBackgroundDB';
function BackgroundImage({ photoInfo, currentAPI, url }) {
const isCustomType = localStorage.getItem('backgroundType') === 'custom';
const [customBackgrounds, setCustomBackgrounds] = useState([]);
- const [isLoading, setIsLoading] = useState(true);
+ const [loading, setLoading] = useState(true);
useEffect(() => {
const loadCustomBackgrounds = async () => {
@@ -24,14 +24,14 @@ function BackgroundImage({ photoInfo, currentAPI, url }) {
setCustomBackgrounds([]);
}
}
- setIsLoading(false);
+ setLoading(false);
};
loadCustomBackgrounds();
}, [isCustomType]);
const hasNoCustomImages =
- isCustomType && !isLoading && (!customBackgrounds || customBackgrounds.length === 0);
+ isCustomType && !loading && (!customBackgrounds || customBackgrounds.length === 0);
const handleOpenSettings = () => {
updateHash('#settings/background/source');
diff --git a/src/features/background/options/Custom.jsx b/src/features/background/options/Custom.jsx
index da2cabfd..3e82e51e 100644
--- a/src/features/background/options/Custom.jsx
+++ b/src/features/background/options/Custom.jsx
@@ -51,10 +51,10 @@ const CustomSettings = memo(() => {
const [folderTaggingModal, setFolderTaggingModal] = useState(false);
const [pendingFiles, setPendingFiles] = useState([]);
const [urlError, setUrlError] = useState('');
- const [isLoading, setIsLoading] = useState(true);
- const [isUploading, setIsUploading] = useState(false);
+ const [loading, setLoading] = useState(true);
+ const [uploading, setUploading] = useState(false);
const [uploadProgress, setUploadProgress] = useState({ current: 0, total: 0 });
- const [isDragging, setIsDragging] = useState(false);
+ const [dragging, setDragging] = useState(false);
const [selectedImages, setSelectedImages] = useState(new Set());
const [sortBy, setSortBy] = useState(localStorage.getItem('customImageSort') || 'date_desc');
const [storageQuotaModal, setStorageQuotaModal] = useState(false);
@@ -109,7 +109,7 @@ const CustomSettings = memo(() => {
console.error('Error loading backgrounds:', error);
toast(variables.getMessage('toasts.error'));
} finally {
- setIsLoading(false);
+ setLoading(false);
}
};
@@ -246,7 +246,7 @@ const CustomSettings = memo(() => {
};
const handleBatchUpload = async (files, folderName = '') => {
- setIsUploading(true);
+ setUploading(true);
setUploadProgress({ current: 0, total: files.length });
const errors = [];
@@ -271,7 +271,7 @@ const CustomSettings = memo(() => {
EventBus.emit('refresh', 'background');
- setIsUploading(false);
+ setUploading(false);
setUploadProgress({ current: 0, total: 0 });
};
@@ -463,7 +463,7 @@ const CustomSettings = memo(() => {
e.stopPropagation();
dragCounter.current++;
if (e.dataTransfer.items && e.dataTransfer.items.length > 0) {
- setIsDragging(true);
+ setDragging(true);
}
};
@@ -472,14 +472,14 @@ const CustomSettings = memo(() => {
e.stopPropagation();
dragCounter.current--;
if (dragCounter.current === 0) {
- setIsDragging(false);
+ setDragging(false);
}
};
const handleDrop = async (e) => {
e.preventDefault();
e.stopPropagation();
- setIsDragging(false);
+ setDragging(false);
dragCounter.current = 0;
const files = Array.from(e.dataTransfer.files);
@@ -513,7 +513,7 @@ const CustomSettings = memo(() => {
const hasVideo = sortedBackgrounds.filter((bg) => bg && videoCheck(bg.url)).length > 0;
- if (isLoading) {
+ if (loading) {
return (
@@ -524,7 +524,7 @@ const CustomSettings = memo(() => {
);
}
- if (isUploading) {
+ if (uploading) {
return (
@@ -546,10 +546,10 @@ const CustomSettings = memo(() => {
return (
<>
{
setCustomURLModal(false)}
- isOpen={customURLModal}
+ open={customURLModal}
className="Modal resetmodal mainModal"
overlayClassName="Overlay resetoverlay"
ariaHideApp={false}
@@ -941,7 +941,7 @@ const CustomSettings = memo(() => {
setFolderTaggingModal(false);
setPendingFiles([]);
}}
- isOpen={folderTaggingModal}
+ open={folderTaggingModal}
className="Modal resetmodal mainModal"
overlayClassName="Overlay resetoverlay"
ariaHideApp={false}
@@ -959,7 +959,7 @@ const CustomSettings = memo(() => {
setStorageQuotaModal(false)}
- isOpen={storageQuotaModal}
+ open={storageQuotaModal}
className="Modal resetmodal mainModal"
overlayClassName="Overlay resetoverlay"
ariaHideApp={false}
diff --git a/src/features/marketplace/components/Items/Items.jsx b/src/features/marketplace/components/Items/Items.jsx
index 781199ea..da545d96 100644
--- a/src/features/marketplace/components/Items/Items.jsx
+++ b/src/features/marketplace/components/Items/Items.jsx
@@ -73,7 +73,7 @@ function ItemCard({
const isPhotoPack = item.type === 'photos' || item.type === 'photo_packs';
const hasSettings = isPhotoPack && item.settings_schema && item.settings_schema.length > 0;
- const [isEnabled, setIsEnabled] = useState(() => {
+ const [enabled, setEnabled] = useState(() => {
const enabledPacks = JSON.parse(localStorage.getItem('enabledPacks') || '{}');
return enabledPacks[packId] !== false;
});
@@ -89,9 +89,9 @@ function ItemCard({
const handleTogglePack = (e) => {
e.stopPropagation();
- const newState = !isEnabled;
+ const newState = !enabled;
- setIsEnabled(newState);
+ setEnabled(newState);
const enabledPacks = JSON.parse(localStorage.getItem('enabledPacks') || '{}');
enabledPacks[packId] = newState;
@@ -117,7 +117,7 @@ function ItemCard({
return (
@@ -130,17 +130,17 @@ function ItemCard({
- {isLoading && (
+ {loading && (
{
width: '100%',
height: '100%',
border: 'none',
- opacity: isLoading ? 0 : 1,
+ opacity: loading ? 0 : 1,
transition: 'opacity 0.2s ease-in-out',
}}
title="Changelog"
diff --git a/src/features/misc/views/Discover.jsx b/src/features/misc/views/Discover.jsx
index 97218af3..50711f03 100644
--- a/src/features/misc/views/Discover.jsx
+++ b/src/features/misc/views/Discover.jsx
@@ -10,7 +10,7 @@ import Lightbox from 'features/marketplace/components/Elements/Lightbox/Lightbox
function DiscoverContent({ category, onBreadcrumbsChange, deepLinkData }) {
const iframeRef = useRef(null);
- const [isLoading, setIsLoading] = useState(true);
+ const [loading, setLoading] = useState(true);
const [showLightbox, setShowLightbox] = useState(false);
const [lightboxImg, setLightboxImg] = useState(null);
const { installItem, uninstallItem } = useMarketplaceInstall();
@@ -43,7 +43,7 @@ function DiscoverContent({ category, onBreadcrumbsChange, deepLinkData }) {
return;
}
- setIsLoading(true);
+ setLoading(true);
if (onBreadcrumbsChange) {
onBreadcrumbsChange([]);
}
@@ -67,7 +67,7 @@ function DiscoverContent({ category, onBreadcrumbsChange, deepLinkData }) {
const itemId = urlParams.get('item');
if (itemId && iframeRef.current) {
- setIsLoading(true);
+ setLoading(true);
const theme = getResolvedTheme();
const themeParam = `&theme=${theme}`;
@@ -105,7 +105,7 @@ function DiscoverContent({ category, onBreadcrumbsChange, deepLinkData }) {
useEffect(() => {
if (deepLinkData?.itemId && iframeRef.current) {
- setIsLoading(true);
+ setLoading(true);
const theme = getResolvedTheme();
const themeParam = `&theme=${theme}`;
@@ -232,7 +232,7 @@ function DiscoverContent({ category, onBreadcrumbsChange, deepLinkData }) {
}, [installItem, uninstallItem, onBreadcrumbsChange]);
const handleLoad = () => {
- setIsLoading(false);
+ setLoading(false);
if (onBreadcrumbsChange) {
onBreadcrumbsChange([]);
@@ -269,14 +269,14 @@ function DiscoverContent({ category, onBreadcrumbsChange, deepLinkData }) {
setShowLightbox(false)}
- isOpen={showLightbox}
+ open={showLightbox}
className="Modal lightBoxModal"
overlayClassName="Overlay"
ariaHideApp={false}
>
setShowLightbox(false)} img={lightboxImg} />
- {isLoading && (
+ {loading && (
{
const NavbarButton = ({ icon, messageKey, settingName }) => {
- const [isDisabled, setIsDisabled] = useState(localStorage.getItem(settingName) !== 'true');
+ const [disabled, setDisabled] = useState(localStorage.getItem(settingName) !== 'true');
const handleClick = () => {
- localStorage.setItem(settingName, isDisabled);
+ localStorage.setItem(settingName, disabled);
if (settingName === 'refresh') {
setShowRefreshOptions(!showRefreshOptions);
@@ -50,11 +50,11 @@ function NavbarOptions() {
setAppsEnabled(!appsEnabled);
}
- setIsDisabled(!isDisabled);
+ setDisabled(!disabled);
variables.stats.postEvent(
'setting',
- `${settingName} ${!isDisabled === true ? 'enabled' : 'disabled'}`,
+ `${settingName} ${!disabled === true ? 'enabled' : 'disabled'}`,
);
EventBus.emit('refresh', 'navbar');
@@ -63,7 +63,7 @@ function NavbarOptions() {
return (