Questions tagged [react-tsx]

A TypeScript XML syntax transform recommended for use with React.

TSX is an embeddable XML-like syntax. It is meant to be transformed into valid JavaScript, though the semantics of that transformation are implementation-specific. TSX rose to popularity with the React framework, but has since seen other implementations as well. TypeScript supports embedding, type checking, and compiling TSX directly to JavaScript.

563 questions
3
votes
5 answers

React Uncaught ReferenceError: process is not defined?

My app in react.ts contains the .env file to store variables with confidential data. But when using process.env.REACT_APP_CLIENT_ID an error appears in the console. Uncaught ReferenceError: process is not defined How to solve? Help me…
Study
  • 85
  • 1
  • 3
  • 8
3
votes
2 answers

React .NET - Display all active connections with SignalR

I am working with a application using React as frontend and .net as backend. Right now I am trying to add the connections as a number to show users how many people there is active on the application right now, I want the number to update in…
Joro
  • 311
  • 4
  • 15
3
votes
1 answer

How do I implement the `fromObject` method for customize objects in Fabric JS

I am trying to make a customize object just like in the tutorial http://fabricjs.com/fabric-intro-part-3 (the LabeledRect). The object needs to be cloned, so I would have to implement the fromObject method. I am using react with typescript and I am…
JadeDuck
  • 51
  • 5
3
votes
1 answer

How to use i18n library with React Vite?

In my developer console I get the following: i18next::translator: missingKey en translation suche suche my file project file structure looks like this: vite.config.ts i18n.js test/ src/ components/InputSearch.tsx routes/ public/ …
rowen
  • 49
  • 6
3
votes
0 answers

Customization MUI theme.palette insufficient : 10 hues of Primary not accepted?

I work on react-typescript and I have to create a rather complex MUI theme.palette. Besides the inbuild primary/secondary/error/warning/info/success I manage to create a customized entries such as interactive/positive/danger ... To do so I used…
Lyly
  • 43
  • 7
3
votes
2 answers

Typescript complex Generics with Components

I was asking this question with a more complex version of this basic concept Rel: Can Generic JSX.Elements work in Typescript I narrowed it down to the core Elements: This is Object A that takes parameters from TypeA type TypeA = { label: string …
3
votes
3 answers

How to convert ReactNode to an array?

I'm trying to create a component where certain HTMLElements or ReactComponents are passed to it like this: Hi // Passed child No. 1 Hi2 // Passed child No. 2
3
votes
2 answers

How to assign two refs to same element

Here I am trying to assign React dnd "drag" ref to existing ref but it is not happening, can any one please help me. const refs = useRef<(HTMLDivElement | null)[][]>([]); const [{ isDragging }, drag] = useDrag(() => ({ type: ItemType.item, …
3
votes
1 answer

Using a handle with React DND

I am using React-dnd, and trying to create a table with sortable rows, which can only be dragged from a handle, which is a small span on the right hand side. The example they give…
Michael
  • 8,229
  • 20
  • 61
  • 113
3
votes
3 answers

How to pass boolean into Material UI MenuItem value in react ts?

I am new to react and am having some trouble passing a simple boolean value as a prop for the MenuItem in the material UI library. I don't think the solution is too complicated. Can someone let me know how I can resolve this error? The Line that…
Kevin Wu
  • 59
  • 1
  • 6
3
votes
1 answer

Getting Cypress to correctly login to Auth0

Im setting up a suite of E2E tests using cypress. I have a react typescript app and I am trying to get this working with cypress. My major problem that I am facing is that I am using Auth0 as my authentication provider. This means I need to…
bradley plater
  • 1,272
  • 2
  • 9
  • 16
3
votes
1 answer

How to fixed Type 'unknown' is not assignable to type 'Country[] in React typescript

I got error TS2322: Type 'unknown' is not assignable to type 'Country[]' pages/Countries/index.tsx Full code: https://gitlab.com/fResult/countries-workshop/-/blob/bug/src/pages/Countries/index.tsx import * as ApiCountries from…
fResult
  • 477
  • 1
  • 5
  • 17
3
votes
1 answer

login and register in One page using React

i'm trying to use login and register in one page in react tsx and this is my code but when i click to show login it's show for like 1 second and then return to signup i don't know why the state change import React, { ReactElement, Fragment,…
mahyarmadad
  • 45
  • 1
  • 5
3
votes
1 answer

Highlight the selected item of a navigation pane

Referring to the example "Nav with nested links" under https://developer.microsoft.com/en-us/fabric#/controls/web/nav , On click of a nav item, I want to highlight this item. I have set url as ' ' so that clicking on an item doesn't do anything.…
Putta
  • 67
  • 7
3
votes
1 answer

How do I include a namespace with a react tsx import?

When I try to import the component 'deleteButton', the compiler claims the class does not exist. I have tried using an export default, and importing it under an alias. import React from 'react'; import deleteButton from…
Ryan Bircham
  • 67
  • 1
  • 6