updated the frontend and backend

README.md

@@ -0,0 +1,164 @@
+<div align="center">
+
+# **CommuneAI Frontend**
+
+[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
+[![Discord Chat](https://img.shields.io/badge/discord-join%20chat-blue.svg)](https://discord.com/invite/DgjvQXvhqf)
+[![Website Uptime](https://img.shields.io/website-up-down-green-red/http/monip.org.svg)](https://www.Commune Frontendai.org/)
+[![Twitter Follow](https://img.shields.io/twitter/follow/Commune Frontendaidotorg.svg?style=social&label=Follow)](https://twitter.com/Commune Frontendaidotorg)
+
+</div>
+
+Commune Frontend is a website that aims to show all features of Commune Frontend community.
+Here you can know the aim of Commune Frontend community through whitepaper and several features like Commune Frontend modules, staking, huggingface modules, telemetry.
+
+By embracing an unopinionated approach, Commune Frontend acknowledges the diverse needs and preferences of developers. It provides a flexible framework that allows developers to integrate specific tools seamlessly while avoiding imposing rigid structures or constraints. This adaptability enables developers to leverage Commune Frontend's capabilities in a manner that best aligns with their individual projects and workflows.
+
+The overarching goal of Commune Frontend is to create a collaborative ecosystem where developers can easily share, connect, and extend their tools, ultimately fostering innovation and efficiency within the development community. By providing a network that encourages openness and accessibility, Commune Frontend empowers developers to leverage the collective knowledge and resources of the community to enhance their own projects.
+
+# Install
+### Frontend
+
+```
+    npm install
+```
+
+```
+    npm run dev
+```
+
+For build
+```
+    npm run build
+```
+
+### Setting Up With setup.py for backend
+
+Install setuptools:
+If you haven't already installed setuptools, you can do so using pip:
+
+```bash
+pip install -r requirements; pip install -e .
+```
+### Setting Up Commune Frontend With Docker
+
+Install Docker: If you don't have Docker installed on your system, download and install it from the official Docker website: [https://www.docker.com/get-started](https://www.docker.com/get-started).
+
+Clone the Commune Frontend Repository: Open your terminal or command prompt and clone the Commune Frontend repository from GitHub:
+
+# Get started with docker
+
+## Frontend container: 
+### Build your frontend container
+
+```
+docker build -t commune-frontend ..
+```
+
+### Run your container: 
+
+```
+docker run -p 3000:3000 commune-frontend.
+```
+
+## Backend container:
+
+## Installation
+
+1. Clone this repository to your local machine:
+
+   ```bash
+   git clone https://github.com/commune-ai/frontend
+
+2. Navigate to the cloned repository:
+
+   ```bash
+    cd backend
+
+3. Build the Docker image:
+   ```bash
+    docker build -t backend .
+
+
+## Running with docker 
+### Frontend
+    ```bash
+    make up 
+    ```
+    or 
+
+    ```bash
+    docker-compose build
+    ```
+
+    Start Commune Frontend: Once the Docker container is built, start Commune Frontend by running the following command:
+
+    ```bash
+    make start
+    ```
+    or 
+    ```bash
+    docker-compose up -d # -d for detached mode
+    ```
+
+    To enter the docker container do, and do the following
+
+    ```bash
+    make enter
+    ```
+    or 
+    ```bash
+    docker exec -it Commune Frontend bash
+    ```
+
+    Then run the following command to run frontend
+
+    ```bash
+    npm run dev
+    ```
+
+    To exit the container
+
+    ```bash
+    exit
+    ```
+### Backend
+    ```bash
+    make up 
+    ```
+    or 
+
+    ```bash
+    docker-compose build
+    ```
+
+    Start Commune backend: Once the Docker container is built, start Commune backend by running the following command:
+
+    ```bash
+    make start
+    ```
+    or 
+    ```bash
+    docker-compose up -d # -d for detached mode
+    ```
+
+    To enter the docker container do, and do the following
+
+    ```bash
+    make enter
+    ```
+    or 
+    ```bash
+    docker exec -it Commune backend bash
+    ```
+
+    Then run the following command to run frontend
+
+    ```bash
+    uvicorn main:app --reload
+    ```
+
+    To exit the container
+
+    ```bash
+    exit

backend/dockerfile

@@ -0,0 +1,15 @@
+# Use Python as the base image
+FROM python:3.10.7 AS builder
+
+# Set working directory in the container
+WORKDIR /app
+
+# Copy and install dependencies
+COPY requirements.txt .
+RUN pip install --no-cache-dir -r requirements.txt
+
+# Copy the rest of the application code
+COPY . .
+
+# Use uvicorn as the ASGI server for FastAPI
+CMD ["uvicorn", "main:app", "--host", "0.0.0.0", "--port", "8000"]

frontend/.env

@@ -10,4 +10,4 @@ NEXT_APP_PROJECT_ID="a0dd23157746b39315f34b62eb614eae"
 NEXT_PUBLIC_BITTENSOR_KEY='e2ee4b7e-a375-439e-a4be-aa3de030ff52'
 NEXT_PUBLIC_BACKEND_API='https://api.comstats.org/'
 NEXT_PUBLIC_COMMUNE_API='wss://commune-api-node-1.communeai.net'
-NEXT_PUBLIC_COMSTAT_VALIDATOR='5H9YPS9FJX6nbFXkm9zVhoySJBX9RRfWF36abisNz5Ps9YaX'
+NEXT_PUBLIC_COMSTAT_VALIDATOR='5H9YPS9FJX6nbFXkm9zVhoySJBX9RRfWF36abisNz5Ps9YaX'

frontend/README.md

@@ -1,36 +1,123 @@
-This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
+<div align="center">
 
-## Getting Started
+# **Commune Frontend AI**
 
-First, run the development server:
+[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
+[![Discord Chat](https://img.shields.io/badge/discord-join%20chat-blue.svg)](https://discord.com/invite/DgjvQXvhqf)
+[![Website Uptime](https://img.shields.io/website-up-down-green-red/http/monip.org.svg)](https://www.Commune Frontendai.org/)
+[![Twitter Follow](https://img.shields.io/twitter/follow/Commune Frontendaidotorg.svg?style=social&label=Follow)](https://twitter.com/Commune Frontendaidotorg)
+
+</div>
+
+Commune Frontend is a website that aims to show all features of Commune Frontend community.
+Here you can know the aim of Commune Frontend community through whitepaper and several features like Commune Frontend modules, staking, huggingface modules, telemetry.
+
+By embracing an unopinionated approach, Commune Frontend acknowledges the diverse needs and preferences of developers. It provides a flexible framework that allows developers to integrate specific tools seamlessly while avoiding imposing rigid structures or constraints. This adaptability enables developers to leverage Commune Frontend's capabilities in a manner that best aligns with their individual projects and workflows.
+
+The overarching goal of Commune Frontend is to create a collaborative ecosystem where developers can easily share, connect, and extend their tools, ultimately fostering innovation and efficiency within the development community. By providing a network that encourages openness and accessibility, Commune Frontend empowers developers to leverage the collective knowledge and resources of the community to enhance their own projects.
+
+# Install
+### Frontend
+
+```
+    npm install
+```
+
+```
+    npm run dev
+```
+
+For build
+```
+    npm run build
+```
+
+### Setting Up With setup.py for backend
+
+Install setuptools:
+If you haven't already installed setuptools, you can do so using pip:
 
 ```bash
-npm run dev
-# or
-yarn dev
-# or
-pnpm dev
-# or
-bun dev
+pip install -r requirements; pip install -e .
 ```
+### Setting Up Commune Frontend With Docker
+
+Install Docker: If you don't have Docker installed on your system, download and install it from the official Docker website: [https://www.docker.com/get-started](https://www.docker.com/get-started).
+
+Clone the Commune Frontend Repository: Open your terminal or command prompt and clone the Commune Frontend repository from GitHub:
+
+# Get started with docker
 
-Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
+## Frontend container: 
+### Build your frontend container
 
-You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
+```
+docker build -t commune-frontend ..
+```
+
+### Run your container: 
+
+```
+docker run -p 3000:3000 commune-frontend.
+```
 
-This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
+## Backend container:
 
-## Learn More
+## Installation
 
-To learn more about Next.js, take a look at the following resources:
+1. Clone this repository to your local machine:
 
-- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
-- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
+   ```bash
+   git clone https://github.com/commune-ai/frontend
 
-You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
+2. Navigate to the cloned repository:
 
-## Deploy on Vercel
+   ```bash
+    cd backend
 
-The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
+3. Build the Docker image:
+   ```bash
+    docker build -t backend .
 
-Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
+
+# Running with docker
+```bash
+make up 
+```
+or 
+
+```bash
+docker-compose build
+```
+
+Start Commune Frontend: Once the Docker container is built, start Commune Frontend by running the following command:
+
+```bash
+make start
+```
+or 
+```bash
+docker-compose up -d # -d for detached mode
+```
+
+To enter the docker container do, and do the following
+
+```bash
+make enter
+```
+or 
+```bash
+docker exec -it Commune Frontend bash
+```
+
+Then run the following command to sync the network
+
+```bash
+npm run dev
+```
+
+To exit the container
+
+```bash
+exit
+```

frontend/dockerfile

@@ -1,5 +1,5 @@
 # Use an official Node.js runtime as a base image
-FROM node:14
+FROM node:latest
 
 # Set the working directory in the container
 WORKDIR /usr/src/app

frontend/global.css

@@ -12,10 +12,19 @@ nextjs-portal {
     /* Add other font properties as needed */
 }
 
+.card-validator-heading {
+    @apply text-sm leading-6 font-medium tracking-tight flex items-center gap-x-2 text-textSecondary;
+}
+
 body {
     font-family: 'CommuneFont', sans-serif;
 }
 
+#card {
+    background: radial-gradient(ellipse farthest-corner at right bottom, #FEDB37 0%, #FDB931 8%, #9f7928 30%, #8A6E2F 40%, transparent 80%),
+        radial-gradient(ellipse farthest-corner at left top, #FFFFFF 0%, #FFFFAC 8%, #D1B464 25%, #5d4a1f 62.5%, #5d4a1f 100%);
+}
+
 @tailwind base;
 @tailwind components;
 @tailwind utilities;

frontend/modules.json

@@ -88,8 +88,8 @@
         ]
     },
     {
-        "name": "Staking",
-        "url": "/staking",
+        "name": "Hyperspace",
+        "url": "/hyperspace",
         "image": "/img/frontpage/comai-logo.png",
         "description": "coming soon",
         "registerKey": "5EJ9AUpSGafWeagdP5nwc5AwcYBkagYSZyx2BmLKWJrGBZUZ",

frontend/next-env.d.ts

@@ -1,6 +1,5 @@
 /// <reference types="next" />
 /// <reference types="next/image-types/global" />
-/// <reference types="next/navigation-types/compat/navigation" />
 
 // NOTE: This file should not be edited
 // see https://nextjs.org/docs/basic-features/typescript for more information.