Fix sonarqube issues
This commit is contained in:
@@ -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 (
|
||||
|
||||
@@ -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"
|
||||
|
||||
@@ -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}
|
||||
|
||||
@@ -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"
|
||||
|
||||
+27
-78
@@ -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>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -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"
|
||||
|
||||
Reference in New Issue
Block a user