Merge Space

Dockerfile

@@ -0,0 +1,107 @@
+FROM nvidia/cuda:12.5.1-cudnn-devel-ubuntu20.04
+
+ENV DEBIAN_FRONTEND=noninteractive \
+	TZ=Europe/Paris
+
+# Remove any third-party apt sources to avoid issues with expiring keys.
+# Install some basic utilities
+RUN rm -f /etc/apt/sources.list.d/*.list && \
+    apt-get update && apt-get install -y --no-install-recommends \
+    curl \
+    ca-certificates \
+    sudo \
+    git \
+    wget \
+    procps \
+    git-lfs \
+    zip \
+    unzip \
+    htop \
+    vim \
+    nano \
+    bzip2 \
+    libx11-6 \
+    build-essential \
+    libsndfile-dev \
+    software-properties-common \
+    gnupg \
+ && rm -rf /var/lib/apt/lists/*
+
+RUN add-apt-repository ppa:flexiondotorg/nvtop && \
+    apt-get upgrade -y && \
+    apt-get install -y --no-install-recommends nvtop
+
+RUN curl -sL https://deb.nodesource.com/setup_21.x  | bash - && \
+    apt-get install -y nodejs && \
+    npm install -g configurable-http-proxy
+
+# Install VSCode Server
+RUN curl -fsSL https://code-server.dev/install.sh | sh
+
+# Create a working directory
+WORKDIR /app
+
+# Create a non-root user and switch to it
+RUN adduser --disabled-password --gecos '' --shell /bin/bash user \
+ && chown -R user:user /app
+RUN echo "user ALL=(ALL) NOPASSWD:ALL" > /etc/sudoers.d/90-user
+USER user
+
+# All users can use /home/user as their home directory
+ENV HOME=/home/user
+RUN mkdir $HOME/.cache $HOME/.config \
+ && chmod -R 777 $HOME
+
+# Set up the Conda environment
+ENV CONDA_AUTO_UPDATE_CONDA=false \
+    PATH=$HOME/miniconda/bin:$PATH
+RUN curl -sLo ~/miniconda.sh https://repo.continuum.io/miniconda/Miniconda3-py39_4.10.3-Linux-x86_64.sh \
+ && chmod +x ~/miniconda.sh \
+ && ~/miniconda.sh -b -p ~/miniconda \
+ && rm ~/miniconda.sh \
+ && conda clean -ya
+
+WORKDIR $HOME/app
+
+#######################################
+# Start root user section
+#######################################
+
+USER root
+
+# User Debian packages
+## Security warning : Potential user code executed as root (build time)
+RUN --mount=target=/root/packages.txt,source=packages.txt \
+    apt-get update && \
+    xargs -r -a /root/packages.txt apt-get install -y --no-install-recommends \
+    && rm -rf /var/lib/apt/lists/*
+
+RUN --mount=target=/root/on_startup.sh,source=on_startup.sh,readwrite \
+	bash /root/on_startup.sh
+
+RUN mkdir /data && chown user:user /data
+
+#######################################
+# End root user section
+#######################################
+
+USER user
+
+# Python packages
+RUN --mount=target=requirements.txt,source=requirements.txt \
+    pip install --no-cache-dir --upgrade -r requirements.txt
+
+# Copy the current directory contents into the container at $HOME/app setting the owner to the user
+COPY --chown=user . $HOME/app
+
+RUN chmod +x start_server.sh
+
+ENV PYTHONUNBUFFERED=1 \
+	GRADIO_ALLOW_FLAGGING=never \
+	GRADIO_NUM_PORTS=1 \
+	GRADIO_SERVER_NAME=0.0.0 \
+	GRADIO_THEME=huggingface \
+	SYSTEM=spaces \
+	SHELL=/bin/bash
+
+CMD ["./start_server.sh"]

README.md

@@ -1,10 +1,29 @@
 ---
-title: Vscode
-emoji: 🔥
-colorFrom: pink
-colorTo: blue
+title: VSCode
+emoji: 💻🐳
+colorFrom: blue
+colorTo: purple
 sdk: docker
 pinned: false
+tags:
+- vscode
+- ide
+suggested_storage: small
 ---
 
+# VSCode on Hugging Face Spaces
+
+This space runs VSCode in a Docker container with a web interface.
+
+## Features
+- Full VSCode web interface
+- Pre-installed development tools
+- GPU support (if available)
+- Customizable environment
+
+## Usage
+1. Click the "Run" button to start the space
+2. Access VSCode through the generated URL
+3. Default password/token is `huggingface`
+
 Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

login.html

@@ -0,0 +1,212 @@
+{% extends "page.html" %}
+
+{% block stylesheet %}
+<style>
+    body {
+        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+        margin: 0;
+        padding: 0;
+        min-height: 100vh;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+    }
+    
+    .login-container {
+        background: white;
+        border-radius: 10px;
+        box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
+        padding: 40px;
+        text-align: center;
+        max-width: 400px;
+        width: 90%;
+    }
+    
+    .logo {
+        margin-bottom: 30px;
+    }
+    
+    .logo img {
+        max-width: 200px;
+    }
+    
+    h4 {
+        color: #333;
+        margin-bottom: 10px;
+        font-size: 24px;
+        font-weight: 600;
+    }
+    
+    h5 {
+        color: #666;
+        margin-bottom: 30px;
+        font-size: 16px;
+        font-weight: 400;
+    }
+    
+    .token-info {
+        background: #f8f9fa;
+        border-radius: 8px;
+        padding: 15px;
+        margin: 20px 0;
+        border-left: 4px solid #667eea;
+    }
+    
+    .token-value {
+        color: #667eea;
+        font-weight: 600;
+        font-size: 18px;
+        letter-spacing: 1px;
+    }
+    
+    .form-group {
+        margin-bottom: 20px;
+        text-align: left;
+    }
+    
+    label {
+        display: block;
+        margin-bottom: 8px;
+        color: #333;
+        font-weight: 500;
+    }
+    
+    input[type="password"] {
+        width: 10%;
+        padding: 12px 15px;
+        border: 2px solid #e9ecef;
+        border-radius: 6px;
+        font-size: 16px;
+        transition: border-color 0.3s;
+        box-sizing: border-box;
+    }
+    
+    input[type="password"]:focus {
+        outline: none;
+        border-color: #667eea;
+    }
+    
+    .btn {
+        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+        color: white;
+        border: none;
+        padding: 12px 30px;
+        border-radius: 6px;
+        font-size: 16px;
+        font-weight: 500;
+        cursor: pointer;
+        width: 100%;
+        transition: transform 0.2s, box-shadow 0.2s;
+    }
+    
+    .btn:hover {
+        transform: translateY(-2px);
+        box-shadow: 0 5px 15px rgba(102, 126, 234, 0.4);
+    }
+    
+    .info-text {
+        margin-top: 25px;
+        color: #666;
+        font-size: 14px;
+        line-height: 1.5;
+    }
+    
+    .info-text a {
+        color: #667eea;
+        text-decoration: none;
+    }
+    
+    .info-text a:hover {
+        text-decoration: underline;
+    }
+    
+    .footer {
+        margin-top: 30px;
+        color: #888;
+        font-size: 12px;
+    }
+</style>
+{% endblock %}
+
+{% block site %}
+<div class="login-container">
+    <div class="logo">
+        <svg width="120" height="120" viewBox="0 0 120 120" xmlns="http://www.w3.org/2000/svg">
+            <rect x="20" y="20" width="80" height="80" rx="8" fill="#24AEF9"/>
+            <path d="M40 40 L80 40 L80 80 L40 80 Z" fill="#1E90FF"/>
+            <path d="M50 50 L70 50 L70 70 L50 70 Z" fill="white"/>
+            <circle cx="60" cy="60" r="8" fill="#24AEF9"/>
+        </svg>
+    </div>
+    
+    <h4>Welcome to VSCode</h4>
+    <h5>Code Anywhere, Anytime</h5>
+    
+    <div class="token-info">
+        <strong>Default Token:</strong>
+        <div class="token-value">huggingface</div>
+    </div>
+    
+    {% if login_available %}
+    <div class="row">
+        <div class="col-sm-12">
+            <form action="{{base_url}}login?next={{next}}" method="post" class="form">
+                {{ xsrf_form_html() | safe }}
+                <div class="form-group">
+                    {% if token_available %}
+                    <label for="password_input">Enter VSCode Token <span title="This is the secret you set up when deploying your VSCode space">ⓘ</span></label>
+                    {% else %}
+                    <label for="password_input">VSCode Password:</label>
+                    {% endif %}
+                    <input type="password" name="password" id="password_input" class="form-control" placeholder="Enter your token..." required>
+                </div>
+                <button type="submit" class="btn" id="login_submit">Access VSCode</button>
+            </form>
+        </div>
+    {% else %}
+    <p>No login available, you shouldn't be seeing this page.</p>
+    {% endif %}
+    
+    <div class="info-text">
+        <p>If you don't have the credentials for this VSCode space, 
+           <a href="https://huggingface.co/spaces/SpacesExamples/vscode?duplicate=true" target="_blank">create your own.</a>
+        </p>
+    </div>
+    
+    <div class="footer">
+        <p>Powered by Hugging Face Spaces</p>
+    </div>
+    
+    {% if message %}
+    <div class="row">
+        {% for key in message %}
+        <div class="message {{key}}">
+            {{message[key]}}
+        </div>
+        {% endfor %}
+    </div>
+    {% endif %}
+</div>
+{% endblock %}
+
+{% block script %}
+<script>
+    document.addEventListener('DOMContentLoaded', function() {
+        const passwordInput = document.getElementById('password_input');
+        const loginForm = document.querySelector('form');
+        
+        loginForm.addEventListener('submit', function(e) {
+            if (!passwordInput.value.trim()) {
+                e.preventDefault();
+                alert('Please enter a token');
+                passwordInput.focus();
+                return false;
+            }
+        });
+        
+        // Auto-focus on password field
+        passwordInput.focus();
+    });
+</script>
+{% endblock %}

on_startup.sh

@@ -0,0 +1,4 @@
+#!/bin/bash
+# Write some commands here that will run on root user before startup.
+# For example, to install additional system packages or set up environment:
+# apt-get update && apt-get install -y some-package

packages.txt

@@ -0,0 +1,9 @@
+tree
+git
+wget
+curl
+vim
+nano
+htop
+zip
+unzip

requirements.txt

@@ -0,0 +1 @@
+# Python packages for VSCode environment

start_server.sh

@@ -0,0 +1,22 @@
+#!/bin/bash
+VSCODE_TOKEN="${VSCODE_TOKEN:=huggingface}"
+
+# Create data directory if it doesn't exist
+mkdir -p /data
+
+# Generate code-server config
+mkdir -p ~/.config/code-server
+cat > ~/.config/code-server/config.yaml << EOF
+bind-addr: 0.0.0.0:7860
+auth: password
+password: $VSCODE_TOKEN
+cert: false
+EOF
+
+# Start code-server with proper configuration
+code-server \
+    --bind-addr 0.0.0.0:7860 \
+    --auth password \
+    --password $VSCODE_TOKEN \
+    --cert false \
+    /data