52f567fded
* dbeaver/pro#5553 feat: add column sorting functionality to DataGrid
* dbeaver/pro#5553 feat: enhance column sorting functionality to support multiple selection
* dbeaver/pro#5553 feat: add keyboard navigation to order button
* dbeaver/pro#5553 feat: add constraints handling logic for column sorting in DataGrid
* Revert "dbeaver/pro#5553 feat: add constraints handling logic for column sorting in DataGrid"
This reverts commit 6028a48b13.
* dbeaver/pro#5553 feat: add icon generation script to UIKit, add sample icons
* dbeaver/pro#5553 refactor: use inner react-data-grid API for column sorting
* dbeaver/pro#5553 feat: add IconCross component and update icon-related files
* dbeaver/pro#5553 feat: replace Button with IconButton in OrderButton component
* dbeaver/pro#5553 style: update foreground color variables for IconButton component
* dbeaver/pro#5553 refactor: add normalization rules to layers, use IconButton in Common DialogHeader
checked if new IconButton works well in light and dark mode by using in CommonDialogHeader
* dbeaver/pro#5553 style: format code and update dependencies in CommonDialogHeader and DataGridTable components
* dbeaver/pro#5553 style: move onColumnSort prop to correct position in DataGridTable component
* dbeaver/pro#5553 refactor: remove icons component generation, use svg sprite
* dbeaver/pro#5553 refactor: update OrderButton component and inline icons sprite in Body
we decided to go with this solution for now just adding icons to a sprite and use them by id. Imports by ?url don't work in VSCode if try to use them in <use> href, so we need to find another solution or stick to that approach.
* dbeaver/pro#5553 refactor: update column sorting and sortable logic in DataGrid components
* dbeaver/pro#5553 style: format whitespace in Body component
* dbeaver/pro#5553 feat: add new sorting icons for ascending, descending, and unsorted states
* dbeaver/pro#5553 refactor:styling for header cell and order button components
* dbeaver/pro#5553 refactor: update sorting logic in DataGrid and OrderButton components
* dbeaver/pro#5553 refactor: value deps
* dbeaver/pro#5553 feat: update sorting icons for ascending, descending, and unsorted states
* dbeaver/pro#5553 style: update aria-label and title for OrderButton component
* dbeaver/pro#5553 fix: double focus
* dbeaver/pro#5553 fix: after merge
* dbeaver/pro#5553 refactor: removed outline offset for sort button
* dbeaver/pro#5553 refactor: update Tailwind CSS import to use layer directive
---------
Co-authored-by: Evgenia <139753579+EvgeniaBzzz@users.noreply.github.com>
Co-authored-by: Alexey <wrouds@gmail.com>
Steps to Run
Welcome! Follow these steps to install and run the frontend dev server.
Prerequisites:
-
Ensure you have the correct Node.js version
We recommend using the latest LTS (Long-Term Support) version. Check the official Node.js website: https://nodejs.org/ The minimum supported version is v22.15.0
-
Ensure you have Yarn installed
If not, see the instructions on the official website: https://yarnpkg.com/getting-started/install
-
Enable Corepack
To ensure that Corepack is enabled, run the following command:
corepack enableMore about corepack you can find here: https://yarnpkg.com/corepack
Installation Steps:
-
Build the Backend Server
Navigate to the
deploydirectory and execute the build script. This script will handle cloning necessary repositories and building the backend. It also installs all frontend dependencies and builds it as well.For macOS/Linux:
cd deploy ./build.shFor Windows:
cd deploy ./build.bat -
Navigate to the Directory with Build Artifacts
Change your current directory to the
cloudbeaverfolder within thedeploydirectory.cd cloudbeaver -
Run the Backend Server
Start the backend server by running the execution script.
For macOS/Linux:
./run-server.shFor Windows:
./run-server.bat -
Navigate to the Webapp Directory
Open a new terminal window or tab, and change your directory to the web application's product folder.
cd webapp/packages/product-default -
Run the Web Application
Start the web application development server, specifying the backend server's URL. The default URL is
http://localhost:8978/.For macOS/Linux:
server=http://localhost:8978/ yarn devFor Windows Command Prompt:
set server=http://localhost:8978/ && yarn devFor Windows PowerShell:
$env:server="http://localhost:8978/"; yarn dev
You should see a message with URL of your running dev server like below
➜ Local: http://localhost:8080/
Developing in VSCode
VSCode offers dedicated tasks to streamline development with our project, making it the recommended environment for working on the CloudBeaver Frontend.
To access these tasks, press F1 (or Cmd/Ctrl + Shift + P) in VSCode, select "Tasks: Run Task" from the command palette, and then choose the desired task from the list.
To start the local development server, follow these steps:
- Execute the Build CE task. This task builds both the backend and frontend.
- Run the Run Backend CE task to start the backend server.
- Run the Run DevServer CE task.
These steps will launch the frontend in development mode and proxy API requests to your locally running backend, accessible at http://localhost:8080/.