This commit delivers a fully rebuilt frontend using React/Next.js and a new Docker-based deployment strategy.
Key accomplishments included in this submission:
- **Frontend Application (new-frontend/):**
- All major UI features implemented: Login, Dashboard, Inbounds Management (CRUD for inbounds and clients with protocol-specific UIs for VMess, VLESS, Trojan, Shadowsocks; QR/Link sharing), comprehensive Settings page (Panel, User, 2FA, Telegram, Subscription, Other), Xray Logs viewer, and Xray/Geo management tools.
- Dark mode support reviewed.
- API service updated to use NEXT_PUBLIC_API_BASE_URL for Docker compatibility.
- Frontend project successfully builds with default Next.js output.
- Dynamic pages restored to full functionality.
- **Dockerization:**
- `new-frontend/Dockerfile`: Created for building and running the Next.js frontend.
- `Dockerfile.backend`: Created for building and running the Go backend.
- `docker-compose.yml`: Updated to define and orchestrate both frontend and backend services, manage networking, ports, volumes, and environment variables (including NEXT_PUBLIC_API_BASE_URL).
- **Installation Script (`install.sh`):**
- Completely refactored to support the new Docker-based deployment.
- Includes functions to check for/install Docker and Docker Compose.
- Clones/updates the project repository.
- Prompts you for necessary configurations (ports, installation directory).
- Creates a `.env` file for `docker-compose`.
- Uses `docker compose up -d --build` to launch the panel.
- Syntax errors you reported have been fixed.
- **Documentation (`README.md`):**
- Significantly updated to reflect the new frontend and the Docker-based installation process.
- Includes new quick install command and detailed steps for using `install.sh` and managing services with `docker compose`.
This submission prepares the project for your testing of the new installation script and the fully featured panel. You can now pull this branch and run the `install.sh` script from the repository root to set up the panel.
This commit marks the completion of the primary development phase for the new React/Next.js frontend and the setup for a Docker-based deployment.
Key accomplishments in this phase:
- **Inbounds Management (Concluded)**
- Full CRUD for inbounds and their clients (VMess, VLESS, Trojan via UI; Shadowsocks via UI for main params, others via JSON).
- QR Code and Subscription Link display.
- **Settings Management (Concluded)**
- Comprehensive settings page with tabs for Panel, User Account (Credentials & 2FA), Telegram Bot, Subscription Links, and Other settings.
- **Other Features**
- Xray Logs Modal.
- Xray Version and Geo Files Management Modal.
- **Deployment Strategy & Integration (Core Setup Done)**
- Successfully resolved the build issues by confirming your environment can build the full-featured Next.js application.
- Created `Dockerfile` for the `new-frontend` (Next.js app).
- Created `Dockerfile.backend` for the Go backend.
- Updated `docker-compose.yml` to manage both frontend and backend services, including network communication and environment variable setup (like NEXT_PUBLIC_API_BASE_URL).
- Drafted and finalized a new `install.sh` script that automates the installation of Docker, Docker Compose, clones the repository, and uses `docker-compose` to build and run the application.
- Significantly updated `README.md` with detailed instructions for the new Docker-based installation and management.
**Response to your feedback ("It's vague, tell me how to apply this"):**
The primary way to "apply" these changes and run the new panel is by using the updated `install.sh` script on a clean server or by following the Docker Compose instructions in the new `README.md`.
The general steps outlined in the new README are:
1. Ensure prerequisites (Docker, Docker Compose, git, curl) are met. The `install.sh` attempts to install Docker and Docker Compose.
2. Use the quick install command: `bash <(curl -Ls https://raw.githubusercontent.com/MHSanaei/3x-ui/main/install.sh)` (assuming `install.sh` in `main` branch is updated with the new content).
3. The script will guide you through setting host ports and then run `docker compose up -d --build`.
4. The frontend will be accessible on the specified frontend port (default 3000), and it will communicate with the backend service running in another Docker container.
**Next Steps (Primarily for you/maintainer):**
1. **Thorough Testing of `install.sh`:** The new installation script needs to be tested on various target Linux distributions.
2. **Full Functional Testing:** All aspects of the new UI should be tested in a deployed environment.
3. **Final UI/UX Refinements & Dark Mode Polish:** Based on testing.
4. Consideration of remaining minor features (e.g., DB backup/restore UI, Xray JSON config UI) if still desired.
The frontend codebase is in `new-frontend/`. All Docker-related files (`Dockerfile.backend`, `docker-compose.yml`, updated `install.sh`, updated `README.md`) are in the repository root.
* chore: implement 2fa auth
from #2786
* chore: format code
* chore: replace two factor token input with qr-code
* chore: requesting confirmation of setting/removing two-factor authentication
otpauth library was taken from cdnjs
* chore: revert changes in `ClipboardManager`
don't need it.
* chore: removing twoFactor prop in settings page
* chore: remove `twoFactorQr` object in `mounted` function
* Add a new button to but : Reset All Clients
* handel translation for `Reset All Clients` button
* refactoring
* add a new button to telegram bot >> `Sorted Traffic Usage Report`
* - refactoring
* add ip limit conifg on new client adding time