For the development of a Ract component I used MUI Autocomplete. I got the array of objects from SharePoint list and used this data as a parameter for options. Actually, you can use any source.
But I had a lot of warnings in console.

MUI: The value provided to Autocomplete is invalid.
None of the options match with {"Id":0,"Title":"","ProjectDescription":"","AvailableObjects":[]}.
You can use the isOptionEqualToValue prop to customize the equality test.

Here I will write down the steps for creating projects for SPFX solutions. The prerequisites - Node, Yo and spfx-fast-serve are already installed.

Today I talked to my colleague about the speed of Hot Reload when developing React applications. I told him that I tried launching from WSL and that everything updates faster. This is about pure React, not for SPFX. I was asked how I created a project and how it works for me. And it turns out that it's not always good to use old tried and tested methods.

I used a TextField component in MUI and wanted to make a label always visible. By default, it hides, when cursor is out (onBlur) and the value is empty. Very strange and not what I wanted to.

I used Material UI DataGrid (@mui/x-data-grid": "^7.12.1") in SharePoint spfx webpart solution. Obviously, that wasn’t a good decision, but too much was already done.

To pass parameters via Get, it was necessary to assemble a string from the selected Checkbox values. In the project, I used Checkbox from Fluent UI, but the approach is similar for another component. Actually, this is not even about React, but about TypeScript.

As it turned out, FluentUI DatePicker for React doesn't contain a built-in German localization. If you need one, you can use my version.

Below you can find a small snippet to calculate the difference between 2 times in string format in TypeScript. If you use JavaScript, remove the types.

The code of the React component to scroll DIV content by axe X. It can be useful when you have a wide table and a narrow screen. Or a designer had a very cool idea of the interface.

In HTML tag 'input type = number' is not very user friendly. So, I always implement it as a text with transformation text to number.