Category "reactjs"

React MUI: theme color custom prop not applied

I have 2 themes, dark mode and light mode: import { styled, alpha, ThemeProvider, createTheme } from '@mui/material/styles'; //I use the dark theme only const

Tree shaking of shared dependencies in webpack 5 module federation

I am working on an architecture for a dynamic dashboard with components fetched from different remote react bundles using webpack 5 module federation. I do have

Vite support for decorators

My code has some .js and .jsx files that use Mobx decorators. I tried adding the babel plugin, but it seems that it's being ignored. My vite config is import {

Adding inline stylesheets in HEAD on Next.js blog

I have a blog (http://minid.net) in Jekyll that I want to migrate to Next.js. My blog doesn't use an external file for styles. I embedded all the styles in the

OpenID Connect + Django DRF + React: How to use?

I have a web application made up of two parts: back-end which is implemented using Django + Django Rest Framework (DRF), and front-end which is a React App proj

Why component doesn't rerender?

const [dammy, setDammy] = useState({ name: "any", status: { "1.0.1": "Successfylly installed", "1.0.2": "Successfylly installed", "1.0.3": "Succ

How to pass a File JS object to Rails controller

I have a JS file object (like the one below) that I'd like to pass to my rails controller. File {name: 'undefined', lastModified: 1652457009460, lastModifi

React useTable hook with typescript

So I have a JavaScript class with useTable. In Java script its been used like below import {useTable, useFilters,useAsyncDebounce,useSortBy,usePagination,} from

"Uncaught SyntaxError: Cannot use import statement outside a module" When Importing ReactJS

Today I decided to try to learn React, but whenever I try to import the two modules below: import React from "react" import ReactDOM from "react-dom" I get the

MUI v5 : How to pass css classes to components using className prop? Also I want to use theme in those classes?

MUI v5 : How to pass css classes to components using className prop? Also I want to use theme in those classes? I was trying to do it using styled in MUIv5, bu

New React app failed to compile immediatly following install

I have been using React Native for a while but figured I would try out React on the web. So I followed this guide: https://reactjs.org/docs/create-a-new-react-a

Error: Prevent writing to file that only differs in casing or query string from already written file. reactjs laravel

I am working on a laravel reactjs project and when I run the command npm run dev the compilation stuck at 95% and give the following error. I checked in the wh

How to have a loading screen until all my components are mounted in React

I do not have any API calls for my react app, I want to have a loading page while all my components are being mounted (including all children). My page does tak

How to delete an item from a list using input in form (React using states)?

I want to delete an object from an array using its name. const [formDataRemoval, setFormDataRemoval] = React.useState({ name: "", }); When input change

Material UI Lab v5: How to style DateRangePicker calendar?

I'm using the DateRangePicker component from @mui/lab (v5.0.0-alpha.62) and I want to add a border around the calendar to make it stand out more from the backgr

React is not defined when using SystemJS

I was trying using SystemJS to load React but it didn't loaded instead throwing an error message in Console > 'React is not defined' I've read their documen

Define React Router Routes In Another Components

I am using react-router-dom 5.2.0. I want 2 files that define all of my routes. 1 file for public routes, 1 file for private. The right component renders when I

How to deploy SSR react app with latest react18 streaming?

The latest version of react(18) comes with SSR streaming which allows to selectively render/hydrate elements. The deployment of such application could be done i

Notistack enqueueSnackbar usage outside component

Is there any way to use enqueueSnackbar() outside the react component? For example, I want to show an alert on the service API request error. Api service reques

sidebar menu with dropdown in react js

i am trying to create a sidebar with drop down like this example in react js https://www.w3schools.com/howto/howto_js_dropdown_sidenav.asp i was able to design