use
String(dropdownActive) instead.66 </fieldset>
67 <fieldset className="grid grid-cols-3 lg:grid-cols-4 p-2 mx-auto">
68 <label className="text-xl lg:text-2xl my-auto p-1">Category</label>
69 <div id="dropdown" class={`relative ${dropdownStyles.dropdown} bg-zinc-300 dark:bg-zinc-600 rounded-lg px-3 dark:text-gray-200 dark:text-zinc-300 text-neutral-700 col-span-2 lg:col-span-3 p-0`} active={"" + dropdownActive}>70 <p className="text-lg transition ease-in-out duration-100 p-1 leading-loose hover:cursor-pointer select-none rounded-none" onClick={dropdownClick}>{category}</p>
71 <ul className="grid grid-col-1 py-1 text-sm bg-zinc-300 dark:bg-zinc-600 rounded-b-lg pr-5 pl-3 dark:text-gray-200 dark:text-neutral-300 text-neutral-700 w-full max-h-32 overflow-y-auto mx-auto" aria-labelledby="dropdownMenu">
72 <p className="text-lg transition ease-in-out duration-100 p-1 hover:text-sky-500 dark:hover:text-sky-400 leading-loose hover:cursor-pointer" onClick={dropdownClickBug}>Bug</p>use
String(dropdownActive) instead.18 </svg>
19 </button>
20
21 <div id="dropdown" className={dropdownStyles.dropdown} active={"" + dropdownActive} style={{ position: "absolute", top: "3.5rem" }}>22 <ul aria-labelledby="dropdownMenu">
23 <Link href="/download">
24 <a className={styles["nav-link"]}>Download</a>use
String(dropdownActive) instead.13 <nav className={styles.nav}>
14 <span></span>
15 <button id="dropdownMenu" data-dropdown-toggle="dropdown" type="button" className={dropdownStyles.dropdownToggle} onClick={dropdownClick}>
16 <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" strokeWidth="1.5" stroke="currentColor" aria-hidden="true" className="w-8" active={"" + dropdownActive}>17 <path strokeLinecap="round" strokeLinejoin="round" d="M19.5 8.25l-7.5 7.5-7.5-7.5" />
18 </svg>
19 </button>
Description
Prefer using explicit casts by calling Number, Boolean, or String over using operators like +, !! or "" +.
This is considered best practice as it improves readability.
Bad Practice
const b = !!foo;
// The `+` operator does not change the value of its operand
// unless it's already a number.
let n = +foo;
n = 1 * foo;
const s = "" + foo;
Recommended
const b = Boolean(foo);
const n = Number(foo);
const s = String(foo);