&emoji=&slug=caioricciuti&button_colour=FFDD00&font_colour=000000&font_family=Poppins&outline_colour=000000&coffee_colour=ffffff)
+
+
+
+## Getting Started
+
+### Using npm and building from scratch
+
+```bash
+git https://github.com/caioricciuti/ch-ui.git
+cd ch-ui
+cp .env.example .env (and fill the variables)
+npm install
+npm start
+
+** debug **
+npm run dev
+```
+
+### Using using Docker
+
+```bash
+docker run -p 5521:5521 ghcr.io/caioricciuti/ch-ui:latest
+```
+
+### Prerequisites
+
+What things you need to install the software and how to install them:
+
+```bash
+nodejs >= 20.x
+npm >= 10.x
+```
+
+## Security
+
+This project is not intended for production use and should not be exposed to the public internet. It is recommended to run this application on a local machine or a secure network. The application does not provide any authentication or authorization mechanisms and does not encrypt data in transit or at rest. It is recommended to use a VPN or secure network to access ClickHouse databases.
+
+## Limitations
+
+I don't quite know what happens if there are more than 6 tabs open, since it caches on indexedDB (browser), all the times it will be limited by the browser's capacity. Also if something happens you can go manually to the indexedDB and delete the databases.
+
+## Authors
+
+Caio Ricciuti (caioricciuti) - hoping to get some help from the community! :)
+
+## License
+
+This project is licensed under the MIT License - see the LICENSE.md file for details
+
+## Disclaimer
+
+This project is a work in progress and is not yet ready for production use. It is intended for educational purposes and as a starting point for building a more robust application. My motivation for creating this project is to learn and experiment with ClickHouse databases and learn more about building web applications. I didn't find any modern UI for ClickHouse databases, so I decided to create one. It was made for me to use on my personal projects, so I didn't followed any design guidelines or best practices. Feel free to use it, modify it, and contribute to it. I'm open sourcing it in the hope that it will be useful to others, and I welcome any feedback or contributions. Keep in mind that this project is not affiliated with ClickHouse or Yandex or any other company, there is no official support or guarantee, and it is provided as-is (see the license for more details).
+
+### Support
+
+If you find this project useful, please consider supporting it by starring the repository, sharing it with others, or contributing to it. Your support is greatly appreciated! Also if you can and are willing to help me with the project, I would be very grateful, I develop this project in my spare time and I am not a software engineer. I'm a data engineer and I'm learning to develop web applications. I'm open to any suggestions, criticisms, and contributions. Thank you very much for your support! :D Some day hopefully I will be able to have more time to dedicate on this and other projects. Any financial support is also welcome, I have a buymeacoffee account, you can donate there, it will help me to keep this project alive. Thank you very much! :D
+
+
diff --git a/components.json b/components.json
new file mode 100644
index 0000000..79145dc
--- /dev/null
+++ b/components.json
@@ -0,0 +1,17 @@
+{
+ "$schema": "https://ui.shadcn.com/schema.json",
+ "style": "default",
+ "rsc": false,
+ "tsx": false,
+ "tailwind": {
+ "config": "tailwind.config.js",
+ "css": "src/index.css",
+ "baseColor": "zinc",
+ "cssVariables": true,
+ "prefix": ""
+ },
+ "aliases": {
+ "components": "@/components",
+ "utils": "@/lib/utils"
+ }
+}
\ No newline at end of file
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..f57148b
--- /dev/null
+++ b/index.html
@@ -0,0 +1,13 @@
+
+
+
+
+
+
+ + The page you are looking for does not exist. +
++ {project.description} +
+ {project.cta && ( + + )} +No results to display
++ Error: {tab.tab_errors} +
+
+ Rows Read:
+ {isLoadingQuery ? (
+
+ Elapsed:
+ {isLoadingQuery ? (
+
+ Data Read:
+ {isLoadingQuery ? (
+
+ Last Run:
+ {isLoadingQuery ? (
+
+ No tables found in the selected database +
+ )} ++ {children} +
+ ); +}; diff --git a/src/components/ui/card.jsx b/src/components/ui/card.jsx new file mode 100644 index 0000000..dd79b51 --- /dev/null +++ b/src/components/ui/card.jsx @@ -0,0 +1,50 @@ +import * as React from "react" + +import { cn } from "@/lib/utils" + +const Card = React.forwardRef(({ className, ...props }, ref) => ( + +)) +Card.displayName = "Card" + +const CardHeader = React.forwardRef(({ className, ...props }, ref) => ( + +)) +CardHeader.displayName = "CardHeader" + +const CardTitle = React.forwardRef(({ className, ...props }, ref) => ( + +)) +CardTitle.displayName = "CardTitle" + +const CardDescription = React.forwardRef(({ className, ...props }, ref) => ( + +)) +CardDescription.displayName = "CardDescription" + +const CardContent = React.forwardRef(({ className, ...props }, ref) => ( + +)) +CardContent.displayName = "CardContent" + +const CardFooter = React.forwardRef(({ className, ...props }, ref) => ( + +)) +CardFooter.displayName = "CardFooter" + +export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent } diff --git a/src/components/ui/collapsible.jsx b/src/components/ui/collapsible.jsx new file mode 100644 index 0000000..a23e7a2 --- /dev/null +++ b/src/components/ui/collapsible.jsx @@ -0,0 +1,9 @@ +import * as CollapsiblePrimitive from "@radix-ui/react-collapsible" + +const Collapsible = CollapsiblePrimitive.Root + +const CollapsibleTrigger = CollapsiblePrimitive.CollapsibleTrigger + +const CollapsibleContent = CollapsiblePrimitive.CollapsibleContent + +export { Collapsible, CollapsibleTrigger, CollapsibleContent } diff --git a/src/components/ui/command.jsx b/src/components/ui/command.jsx new file mode 100644 index 0000000..a17b9ee --- /dev/null +++ b/src/components/ui/command.jsx @@ -0,0 +1,116 @@ +import * as React from "react" +import { Command as CommandPrimitive } from "cmdk" +import { Search } from "lucide-react" + +import { cn } from "@/lib/utils" +import { Dialog, DialogContent } from "@/components/ui/dialog" + +const Command = React.forwardRef(({ className, ...props }, ref) => ( ++ Check the status of the ClickHouse server and its version. +
++ Server Status:{" "} + {isLoading + ? "Loading..." + : isServerAvailable + ? "Online" + : "Offline"} +
+Server Version: {version}
+
+ {resetStep || "reseting..."}{" "}
+
+ Plase don't leave this page +
++ If it's the first time this is running it takes a while!{" "} +
+
+ {isServerAvailable ? (
+
+ Server is available and ready to use.
+
+ Go back to the home page.
+
+
+ ) : (
+ "Server is not available"
+ )}
+