Fix sonarqube issues

This commit is contained in:
2026-02-26 21:18:37 -05:00
parent 94f0f3ca13
commit 434a27d90d
6 changed files with 41 additions and 91 deletions

View File

@@ -1,4 +1,5 @@
import type { LoadingWifiProps } from "$/types/LoadingTypes";
import { useId } from "react";
export default function Wifi({
@@ -9,9 +10,9 @@ export default function Wifi({
fadeDuration = 0.001,
stroke,
fill
}: LoadingWifiProps){
}: Readonly<LoadingWifiProps>){
//https://github.com/n3r4zzurr0/svg-spinners/blob/main/svg-smil/wifi.svg
const id = crypto.randomUUID().replaceAll("-", "");
const id = useId();
return (

View File

@@ -120,10 +120,10 @@ function generateTabContent(Fn: (props: ButtonProps) => JSX.Element, onClick: ()
function ButtonDisplay({
title,
children
}:{
}: Readonly<{
title: React.ReactNode;
children: React.ReactNode;
}){
}>){
return (
<div
className="flex flex-col items-center justify-center gap-y-2"

View File

@@ -77,10 +77,10 @@ function ModalPage(){
function DemoCenteredModal({
display,
onClose
}:{
}: Readonly<{
display: boolean;
onClose: () => void;
}){
}>){
return (
<Modal
display={display}
@@ -97,10 +97,10 @@ function DemoCenteredModal({
function DemoTopModal({
display,
onClose
}:{
}: Readonly<{
display: boolean;
onClose: () => void;
}){
}>){
return (
<Modal
display={display}

View File

@@ -128,13 +128,13 @@ function ProgressPage() {
function ProgressBlock({
label,
children
}:{
}: Readonly<{
label: string;
children: React.ReactNode;
}){
}>){
return (
<div
className="flex flex-col items-center justify-center w-128 gap-y-2"
className="flex flex-col items-center justify-center w-lg gap-y-2"
>
<h3
className="font-bold text-2xl"

View File

@@ -579,13 +579,13 @@ export function TextContent(){
<div
className="flex flex-col items-center justify-center gap-y-8 mt-8 w-full"
>
<TextDisplay title="Text Input">
<GeneralInputDisplay title="Text Input">
<TextInput placeholder="Text Input" labelClassName="bg-(--bg-color) peer-focus:bg-(--bg-color)"/>
</TextDisplay>
<TextDisplay title="Text Area">
</GeneralInputDisplay>
<GeneralInputDisplay title="Text Area">
<TextArea placeholder="Textarea" className="resize" labelClassName="bg-(--bg-color) peer-focus:bg-(--bg-color)"/>
</TextDisplay>
<TextDisplay title="Select">
</GeneralInputDisplay>
<GeneralInputDisplay title="Select">
<SelectInput placeholder={selected.label} onChange={(newValue) => setSelected(selectOptions.find((option) => option.value === newValue) || selectOptions[0])}>
{
selectOptions.map((option) => (
@@ -599,8 +599,8 @@ export function TextContent(){
))
}
</SelectInput>
</TextDisplay>
<TextDisplay
</GeneralInputDisplay>
<GeneralInputDisplay
title="Number Input"
>
<NumberInput
@@ -610,9 +610,9 @@ export function TextContent(){
>
Number Test
</NumberInput>
</TextDisplay>
</GeneralInputDisplay>
{/* */
<TextDisplay
<GeneralInputDisplay
title="Number Slider"
>
<NumberSlider
@@ -621,13 +621,13 @@ export function TextContent(){
value={numberValue}
onChange={setNumberValue}
/>
</TextDisplay>
</GeneralInputDisplay>
/* */}
</div>
);
}
function TextDisplay({
function GeneralInputDisplay({
title,
children
}:Readonly<{
@@ -649,13 +649,13 @@ export function FileContent(){
<div
className="flex flex-col items-center justify-center gap-y-8 mt-8 w-full"
>
<FileDisplay title="File Input">
<GeneralInputDisplay title="File Input">
<FileInput
showFileName={true}
showSize={true}
/>
</FileDisplay>
<FileDisplay title="Drag and Drop File Input">
</GeneralInputDisplay>
<GeneralInputDisplay title="Drag and Drop File Input">
<DragAndDropFileInput
showFileName={true}
showSize={true}
@@ -664,24 +664,7 @@ export function FileContent(){
>
Drag And Drop File Input
</DragAndDropFileInput>
</FileDisplay>
</div>
);
}
function FileDisplay({
title,
children
}:Readonly<{
title: React.ReactNode;
children: React.ReactNode;
}>){
return (
<div
className="flex flex-col items-center justify-center gap-y-2 w-full"
>
<h2 className="text-2xl">{title}</h2>
{children}
</GeneralInputDisplay>
</div>
);
}
@@ -691,7 +674,7 @@ export function CheckboxContent(){
<div
className="flex flex-col items-center justify-center gap-y-8 mt-8 w-full"
>
<CheckboxDisplay title="Checkbox">
<GeneralInputDisplay title="Checkbox">
<div className="flex flex-row items-center justify-center gap-x-8">
<MattrixwvCheckbox className="group-data-checked:stroke-white group-data-checked:bg-amber-400" defaultChecked={true}>Default</MattrixwvCheckbox>
<PrimaryCheckbox defaultChecked={true} >Primary</PrimaryCheckbox>
@@ -705,8 +688,8 @@ export function CheckboxContent(){
<LightCheckbox defaultChecked={true}>Light</LightCheckbox>
<DarkCheckbox defaultChecked={true}>Dark</DarkCheckbox>
</div>
</CheckboxDisplay>
<CheckboxDisplay title="Checks">
</GeneralInputDisplay>
<GeneralInputDisplay title="Checks">
<div className="flex flex-row items-center justify-center gap-x-8">
<MattrixwvCheckbox className="group-data-checked:stroke-amber-400" defaultChecked={true} showBox={false}>Default</MattrixwvCheckbox>
<PrimaryCheckbox defaultChecked={true} showBox={false}>Primary</PrimaryCheckbox>
@@ -720,24 +703,7 @@ export function CheckboxContent(){
<LightCheckbox defaultChecked={true} showBox={false}>Light</LightCheckbox>
<DarkCheckbox defaultChecked={true} showBox={false}>Dark</DarkCheckbox>
</div>
</CheckboxDisplay>
</div>
);
}
function CheckboxDisplay({
title,
children
}:Readonly<{
title: React.ReactNode;
children: React.ReactNode;
}>){
return (
<div
className="flex flex-col items-center justify-center gap-y-2 w-full"
>
<h2 className="text-2xl">{title}</h2>
{children}
</GeneralInputDisplay>
</div>
);
}
@@ -747,7 +713,7 @@ export function RadioContent(){
<div
className="flex flex-col items-center justify-center gap-y-8 mt-8 w-full"
>
<RadioDisplay title="Sizes">
<GeneralInputDisplay title="Sizes">
<RadioList
>
<PrimaryRadioButton size="xs" value="xs">Extra Small</PrimaryRadioButton>
@@ -756,8 +722,8 @@ export function RadioContent(){
<PrimaryRadioButton size="lg" value="lg">Large</PrimaryRadioButton>
<PrimaryRadioButton size="xl" value="xl">Extra Large</PrimaryRadioButton>
</RadioList>
</RadioDisplay>
<RadioDisplay title="Radio Checked">
</GeneralInputDisplay>
<GeneralInputDisplay title="Radio Checked">
<div
className="flex flex-row items-center justify-center gap-x-8"
>
@@ -772,8 +738,8 @@ export function RadioContent(){
<RadioList value="Light"><LightRadioButton value="Light">Light</LightRadioButton></RadioList>
<RadioList value="Dark"><DarkRadioButton value="Dark">Dark</DarkRadioButton></RadioList>
</div>
</RadioDisplay>
<RadioDisplay title="Radio Horizontal">
</GeneralInputDisplay>
<GeneralInputDisplay title="Radio Horizontal">
<RadioList
direction="horizontal"
>
@@ -789,8 +755,8 @@ export function RadioContent(){
<LightRadioButton value="light">Light</LightRadioButton>
<DarkRadioButton value="dark">Dark</DarkRadioButton>
</RadioList>
</RadioDisplay>
<RadioDisplay title="Radio Vertical">
</GeneralInputDisplay>
<GeneralInputDisplay title="Radio Vertical">
<RadioList
direction="vertical"
>
@@ -806,24 +772,7 @@ export function RadioContent(){
<LightRadioButton value="light">Light</LightRadioButton>
<DarkRadioButton value="dark">Dark</DarkRadioButton>
</RadioList>
</RadioDisplay>
</div>
);
}
function RadioDisplay({
title,
children
}:Readonly<{
title: React.ReactNode;
children: React.ReactNode;
}>){
return (
<div
className="flex flex-col items-center justify-center gap-y-2 w-full"
>
<h2 className="text-2xl">{title}</h2>
{children}
</GeneralInputDisplay>
</div>
);
}

View File

@@ -47,10 +47,10 @@ import type { JSX } from "react";
function LoadingGroup({
label,
elements
}:{
}: Readonly<{
label: React.ReactNode;
elements: JSX.Element[];
}){
}>){
return (
<div
className="flex flex-col items-center justify-center"