I am writing a page to illustrate how to use a component I've developed and I'd like to build pairs of examples (rendered) with TSX source code that produces the example, ideally not having to repeat the code twice. I'd…
I am trying to make a simple task list (a to-do list with a different name). When I click a TaskAdder it calls the function add_task which is a string for now. This should update the effect in the TaskList…
I am trying to access nested JSON objects such as the code below, which works currently. <img id="inactive-drive2" src='/src/assets/image/InActiveDrive.png' className={info.data.drives[1]?.isActive ? "d-none" : ""} /> If I change my code to this : <img id="inactive-drive2" src='/src/assets/image/InActiveDrive.png' className={info.data.drives[1].isActive ? "d-none" :…
This is my code : import VideoPlayer from './VideoPlayer'; import dynamic from 'next/dynamic'; import Link from 'next/link'; const GSAPComponent = dynamic(() => import('./GSAPComponent'), { ssr: false }); export default function Hero() { return ( <section className="nav-height relative w-full bg-black"> <div…
i want to compare two react tsx elements. i am still new to react and tsx. but i am unale to do so even after copying and pasting the exact elements to compare. Can you tell me why and how…
This is my : login.tsx import { ViewConfig } from '@vaadin/hilla-file-router/types.js'; import { useSignal } from '@vaadin/hilla-react-signals'; import { LoginI18n, LoginOverlay, LoginOverlayElement } from '@vaadin/react-components/LoginOverlay.js'; import { useAuth } from 'Frontend/util/auth.js'; export const config: ViewConfig = { menu: { exclude:…
I have a Button which is disabled depending on an isSubmitDisabled function which is defined as async because it has an async part. <Button type="button" disabled={isSubmitDisabled()}>Submit</Button> const isSubmitDisabled = async () => { let result1 = await validatePart1(..); //... return…
Simple question: I have read a couple of answers such as this on the differences between Object.assign and the assignment operator (i.e. =) and understand all the points brought up such as that the first copies the object while the…
I have a question for a React file (I've just started). Do I have to put text in App.tsx for example: <h1>Hello World!</h1>, or do I have to create a separate file like Text.tsx and import it into App.tsx? Thanks…
I'm working on a React application using Tailwind CSS, and I'm facing an issue with text overflow within a dynamically sized container. I have a component (CenteredRectangle.tsx) that is intended to display a centered rectangle with text content. I want…