Category "reactjs"

How to use Apollo/Graphql hooks within external React.js component library

I have 3 React.js projects and I'm trying to consolidate the reused components across all 3 projects into one shared component library. This component library i

Redirect to 404 page if url is incorrect or if a 404 error is got from BE

I need to redirect to a custom page in case if the entered URl does not exist or in case if I receive a 404 error from BE. To catch the BE error I do a navigati

React onclick pass button api id to state

I have a simple aip with an array with 4 different ids. In react I've made an <ul> with a button for each of the ids. When I click the button, I want to c

How to properly implement useQueries in react-query?

I'm using react-query to make two separate queries in the same React component. I originally tried using two useQuery hooks: export default function Component()

Javascript Filter Method

I am trying to filter an array of objects to display some content and for some reason it does not display anything . App.js <BrowserRouter> <Routes&g

warning from test with jasmine and react testing library

I started a project in react and I implemented some tests (first time I ever did test) using jasmine and react-testing-library (they are not useful for the mome

How to prepopulate a react formik form

I have a table tha stores Students with an edit buttom tha opens a formik form. const EditStudentFrom = (props) => ( <Formik initialValues={{s

I want to enable crypto payment on my site [closed]

I want to enable crypto payment by giving the customer an wallet address and the send the amount of crypto to my wallet lets say 10USDT but I

React Testing Library with userEvent.click wrong act() warning

I have several tests written with Jest and React Testing Library. They all mock fetch and use a userEvent.click call to fire a submit button which makes a fetch

how to use "leaflet-buffer" in react-leaflet?

I want to buffer the shapes I drew on the react-leaflet. But I can't find any npm library to react like "leaflet-buffer". Please help me.

Frontend/Backend Serving on Ubuntu Server 20.04

I am working on my first web-project and therefore use an Ubuntu Server 20.04 with apache2. Now i struggle with the correct frontend/backend-serving of my websi

why am i not getting the data from Rapidapi

i want to use rapidapi to get some data using redux, but when i console.log the data i will be getting GET https://coinranking1.p.rapidapi.com/coins/coins 401

Why are cookies not sent to the server via getServerSideProps in Next.js?

Cookies are not sent to the server via getServerSideProps, here is the code in the front-end: export async function getServerSideProps() { const res = await a

JSSIP + React + Asterisk - No audio in Safari

I have set up an asterisk PBX with a simple dial plan that plays the 'hello world' audio when extension 9000 is dialled. I have then created a react application

protected router with react-router v6

this Protected route is works well for profile page. but i want to make a protected route for multiple page. in my project , i want to implement protected route

React + Gsap loop scroll

I just want to know wether someone knows how to create an loop vertical scroll using react and gsap. Thank you in advance!! i tried to use some links but didn't

Deprecation notice: ReactDOM.render is no longer supported in React 18

I get this error every time I create a new React app: Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until you switch to

Not able to create theme using Material UI's ThemeProvider and createTheme

I kept getting a failed to compile error: Attempted import error: 'createTheme' is not exported from '@material-ui/core/styles'. Code: import React, { Suspens

Set bootstrap switch component to 'checked' if mode is Dark

I have a theme for my web App in my localStorage and I want to add the checked value to the Switch component if the mode is set to 'dark',or unchecked, if the m

Why isn't the spacebar working in react-quill

I've setup react-quill in my React app, but for some reason the spacebar isn't working. import React from 'react' import ReactQuill from 'react-quill' import 'r