import React from 'react';
import { Icons } from '../components/IconSet';

const CodeBlock = ({ label, lang, code }: { label: string, lang: string, code: string }) => (
  <div className="mb-8">
    <div className="flex justify-between items-center mb-2">
      <span className="text-sm font-medium text-textMain flex items-center gap-2">
        <Icons.Terminal className="w-4 h-4 text-accentInfo" /> {label}
      </span>
      <span className="text-xs text-textMuted uppercase bg-surfaceHighlight px-2 py-1 rounded">{lang}</span>
    </div>
    <div className="bg-[#0b0b0d] border border-border rounded-lg p-4 overflow-x-auto shadow-inner group relative">
      <pre className="text-xs font-mono text-gray-300 leading-relaxed">
        <code>{code}</code>
      </pre>
      <button 
        onClick={() => navigator.clipboard.writeText(code)}
        className="absolute top-2 right-2 opacity-0 group-hover:opacity-100 bg-surfaceHighlight border border-border text-xs px-2 py-1 rounded text-textMain hover:bg-white/10 transition-all"
      >
        Kopieren
      </button>
    </div>
  </div>
);

const SetupGuide: React.FC = () => {
  return (
    <div className="max-w-3xl mx-auto space-y-8 pb-20">
      <div>
        <h1 className="text-3xl font-bold mb-4">Installationsanleitung</h1>
        <p className="text-textMuted leading-relaxed">
          Die Obsidian-Plattform nutzt einen leichtgewichtigen, serverunabhängigen Ansatz. 
          Der Minecraft-Server generiert Daten über Vanilla-Befehle, und ein einfaches Shell-Skript lädt diese auf den Webserver hoch.
        </p>
      </div>

      <div className="p-4 bg-surfaceHighlight/20 border border-accentInfo/20 rounded-lg text-sm text-textMuted">
        <strong className="text-accentInfo">Hinweis:</strong> Kein Python oder schweres Backend erforderlich. Funktioniert unter Windows (Batch) und Linux (Bash).
      </div>

      <CodeBlock 
        label="1. Datapack Funktion (export.mcfunction)" 
        lang="mcfunction"
        code={`# File: data/obsidian/functions/export_player.mcfunction
# Triggered by: execute as @a run function obsidian:export_player

# 1. Store Inventory Data to Storage
data modify storage obsidian:temp Inventory set from entity @s Inventory

# 2. Log formatted JSON to server console
# We use tellraw/log tricks or simply "data get" to print to log, which the script scrapes.
# Ideally, use a macro to format this into a single line string.

# Simplified concept for log scraping:
tellraw @a[tag=admin] [{"text":"JSON_EXPORT_START|"},{"selector":"@s"},{"text":"|"},{"nbt":"Inventory","entity":"@s"}]
`} 
      />

      <CodeBlock 
        label="2. Upload Skript (Linux/Bash)" 
        lang="bash"
        code={`#!/bin/bash
# obsidian_sync.sh
# Scrapes logs for JSON markers and uploads to Web Server

LOG_FILE="/path/to/minecraft/logs/latest.log"
WEB_DIR="./web_data"
FTP_HOST="ftp.yourserver.com"
FTP_USER="user"
FTP_PASS="pass"

mkdir -p $WEB_DIR

# 1. Parse Log (Simple Grep/Sed extraction)
# Look for lines starting with JSON_EXPORT_START
grep "JSON_EXPORT_START" $LOG_FILE | tail -n 10 > temp_extract.txt

while read p; do
  # Extract Name and JSON data (simplified regex)
  # In production, use 'jq' if available, otherwise pure bash string manipulation
  PLAYER_NAME=$(echo $p | cut -d'|' -f2)
  JSON_DATA=$(echo $p | cut -d'|' -f3)
  
  echo "{ \"username\": \"$PLAYER_NAME\", \"inventory\": $JSON_DATA }" > "$WEB_DIR/$PLAYER_NAME.json"
done < temp_extract.txt

# 2. Upload via lftp (High performance, parallel)
lftp -u $FTP_USER,$FTP_PASS $FTP_HOST <<EOF
mirror -R -v $WEB_DIR /public_html/api/players
bye
EOF

echo "Sync Complete at $(date)"
`} 
      />

      <CodeBlock 
        label="3. Upload Skript (Windows Batch)" 
        lang="batch"
        code={`@echo off
:: obsidian_sync.bat
:: Uses standard Windows FTP command

set LOCAL_DIR=C:\\Minecraft\\web_data
set FTP_SCRIPT=ftp_script.txt

:: Create FTP script dynamically
echo open ftp.yourserver.com > %FTP_SCRIPT%
echo myuser >> %FTP_SCRIPT%
echo mypassword >> %FTP_SCRIPT%
echo cd public_html/api/players >> %FTP_SCRIPT%
echo lcd %LOCAL_DIR% >> %FTP_SCRIPT%
echo mput *.json >> %FTP_SCRIPT%
echo disconnect >> %FTP_SCRIPT%
echo quit >> %FTP_SCRIPT%

:: Run FTP
ftp -i -s:%FTP_SCRIPT%
del %FTP_SCRIPT%

echo Sync Complete.
`} 
      />
    </div>
  );
};

export default SetupGuide;