pinme 2.0.0-beta.2 → 2.0.0-beta.21

package/template/frontend/src/App.css

@@ -1,389 +0,0 @@
-* {
-  margin: 0;
-  padding: 0;
-  box-sizing: border-box;
-}
-
-body {
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
-  background: #f5f5f5;
-  color: #333;
-  min-height: 100vh;
-}
-
-.page {
-  max-width: 600px;
-  margin: 0 auto;
-  padding: 24px 16px;
-}
-
-.page-header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  margin-bottom: 32px;
-  padding-bottom: 16px;
-  border-bottom: 1px solid #eee;
-}
-
-.page-header h1 {
-  font-size: 20px;
-  font-weight: 700;
-  color: #111;
-}
-
-.page-header nav {
-  display: flex;
-  gap: 16px;
-}
-
-.page-header nav a {
-  color: #666;
-  text-decoration: none;
-  font-size: 14px;
-  padding: 4px 8px;
-  border-radius: 4px;
-  transition: all 0.2s;
-}
-
-.page-header nav a:hover {
-  color: #111;
-  background: #eee;
-}
-
-.page-header nav a.active {
-  color: #fff;
-  background: #0070f3;
-}
-
-/* Hero */
-.hero {
-  text-align: center;
-  padding: 40px 0;
-}
-
-.hero h2 {
-  font-size: 28px;
-  font-weight: 700;
-  margin-bottom: 12px;
-}
-
-.hero p {
-  color: #666;
-  font-size: 16px;
-}
-
-/* Features */
-.features {
-  display: grid;
-  grid-template-columns: repeat(3, 1fr);
-  gap: 16px;
-  margin: 32px 0;
-}
-
-.feature {
-  background: white;
-  padding: 20px;
-  border-radius: 12px;
-  text-align: center;
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
-}
-
-.feature h3 {
-  font-size: 14px;
-  font-weight: 600;
-  margin-bottom: 8px;
-  color: #111;
-}
-
-.feature p {
-  font-size: 12px;
-  color: #666;
-}
-
-/* CTA */
-.cta {
-  text-align: center;
-  margin: 32px 0;
-}
-
-.btn-primary {
-  display: inline-block;
-  padding: 12px 32px;
-  background: #0070f3;
-  color: white;
-  text-decoration: none;
-  border-radius: 8px;
-  font-weight: 600;
-  transition: background 0.2s;
-}
-
-.btn-primary:hover {
-  background: #0060df;
-}
-
-/* API Info */
-.api-info {
-  background: #f0f0f0;
-  padding: 12px;
-  border-radius: 6px;
-  margin-bottom: 24px;
-  overflow-x: auto;
-}
-
-.api-info code {
-  font-family: 'SF Mono', Monaco, 'Courier New', monospace;
-  font-size: 12px;
-  color: #666;
-}
-
-/* Message Form */
-.message-form {
-  display: flex;
-  gap: 12px;
-  margin-bottom: 24px;
-}
-
-.message-form input {
-  flex: 1;
-  padding: 12px 16px;
-  border: 1px solid #ddd;
-  border-radius: 8px;
-  font-size: 14px;
-  outline: none;
-  transition: border-color 0.2s;
-}
-
-.message-form input:focus {
-  border-color: #0070f3;
-}
-
-.message-form button {
-  padding: 12px 24px;
-  background: #0070f3;
-  color: white;
-  border: none;
-  border-radius: 8px;
-  font-size: 14px;
-  font-weight: 600;
-  cursor: pointer;
-  transition: background 0.2s;
-}
-
-.message-form button:hover:not(:disabled) {
-  background: #0060df;
-}
-
-.message-form button:disabled {
-  background: #ccc;
-  cursor: not-allowed;
-}
-
-/* Messages */
-.messages h2 {
-  font-size: 18px;
-  font-weight: 600;
-  margin-bottom: 16px;
-}
-
-.messages .empty {
-  color: #999;
-  text-align: center;
-  padding: 24px;
-}
-
-.messages ul {
-  list-style: none;
-}
-
-.messages li {
-  background: white;
-  padding: 16px;
-  border-radius: 8px;
-  margin-bottom: 12px;
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
-}
-
-.messages .content {
-  display: block;
-  margin-bottom: 8px;
-}
-
-.messages .time {
-  font-size: 12px;
-  color: #999;
-}
-
-/* About */
-.about h2 {
-  font-size: 24px;
-  font-weight: 700;
-  margin-bottom: 16px;
-}
-
-.about h3 {
-  font-size: 16px;
-  font-weight: 600;
-  margin: 24px 0 12px;
-  color: #111;
-}
-
-.about p {
-  color: #666;
-  line-height: 1.6;
-  margin-bottom: 16px;
-}
-
-.about ul {
-  list-style: none;
-  margin-bottom: 16px;
-}
-
-.about li {
-  color: #666;
-  padding: 8px 0;
-  border-bottom: 1px solid #eee;
-}
-
-.about li:last-child {
-  border-bottom: none;
-}
-
-.about li code {
-  background: #f0f0f0;
-  padding: 2px 6px;
-  border-radius: 4px;
-  font-family: 'SF Mono', Monaco, 'Courier New', monospace;
-  font-size: 12px;
-}
-
-.about .links {
-  margin-top: 32px;
-}
-
-.about .links a {
-  color: #0070f3;
-  text-decoration: none;
-  font-weight: 600;
-}
-
-.about .links a:hover {
-  text-decoration: underline;
-}
-
-/* Responsive */
-@media (max-width: 480px) {
-  .features {
-    grid-template-columns: 1fr;
-  }
-  
-  .page-header {
-    flex-direction: column;
-    gap: 12px;
-  }
-}
-
-/* Demo */
-.demo h2 {
-  font-size: 24px;
-  font-weight: 700;
-  margin-bottom: 8px;
-}
-
-.demo .desc {
-  color: #666;
-  margin-bottom: 24px;
-}
-
-.demo .api-box {
-  display: flex;
-  align-items: center;
-  background: #f0f0f0;
-  border-radius: 8px;
-  padding: 12px 16px;
-  margin-bottom: 16px;
-}
-
-.demo .api-method {
-  background: #0070f3;
-  color: white;
-  padding: 4px 12px;
-  border-radius: 4px;
-  font-size: 12px;
-  font-weight: 600;
-  margin-right: 12px;
-}
-
-.demo .api-url {
-  font-family: 'SF Mono', Monaco, 'Courier New', monospace;
-  font-size: 14px;
-  color: #333;
-}
-
-.demo .btn-fetch {
-  width: 100%;
-  padding: 12px;
-  background: #0070f3;
-  color: white;
-  border: none;
-  border-radius: 8px;
-  font-size: 14px;
-  font-weight: 600;
-  cursor: pointer;
-  margin-bottom: 16px;
-  transition: background 0.2s;
-}
-
-.demo .btn-fetch:hover:not(:disabled) {
-  background: #0060df;
-}
-
-.demo .btn-fetch:disabled {
-  background: #ccc;
-  cursor: not-allowed;
-}
-
-.demo .result {
-  background: white;
-  border-radius: 8px;
-  padding: 16px;
-  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
-}
-
-.demo .result h3 {
-  font-size: 14px;
-  font-weight: 600;
-  margin-bottom: 12px;
-  color: #333;
-}
-
-.demo .result pre {
-  background: #f5f5f5;
-  padding: 12px;
-  border-radius: 6px;
-  font-family: 'SF Mono', Monaco, 'Courier New', monospace;
-  font-size: 12px;
-  overflow-x: auto;
-  margin-bottom: 12px;
-}
-
-.demo .result.error {
-  background: #fff5f5;
-  color: #c00;
-  text-align: center;
-}
-
-.demo .domain-result {
-  margin-top: 12px;
-  padding-top: 12px;
-  border-top: 1px solid #eee;
-}
-
-.demo .domain-result span {
-  color: #666;
-}
-
-.demo .domain-result a {
-  color: #0070f3;
-  font-weight: 600;
-}

package/template/frontend/src/App.tsx

@@ -1,38 +0,0 @@
-import { Link } from 'react-router-dom';
-import Header from './components/Header';
-
-export default function App() {
-  return (
-    <div className="page">
-      <Header />
-
-      <main>
-        <section className="hero">
-          <h2>欢迎使用 Pinme</h2>
-          <p>一站式全栈部署工具，前端上 IPFS，后端上 Worker</p>
-        </section>
-
-        <section className="features">
-          <div className="feature">
-            <h3>🚀 快速部署</h3>
-            <p>一行命令部署前端到 IPFS，永久不可篡改</p>
-          </div>
-          <div className="feature">
-            <h3>⚡ 极速响应</h3>
-            <p>Cloudflare 全球 CDN，边缘计算</p>
-          </div>
-          <div className="feature">
-            <h3>💾 持久存储</h3>
-            <p>D1 SQLite 数据库，轻松存储数据</p>
-          </div>
-        </section>
-
-        <section className="cta">
-          <Link to="/home" className="btn-primary">
-            开始使用 →
-          </Link>
-        </section>
-      </main>
-    </div>
-  );
-}

package/template/frontend/src/components/Header.tsx

@@ -1,29 +0,0 @@
-import { Link, useLocation } from 'react-router-dom';
-
-const NAV_ITEMS = [
-  { path: '/', label: '首页' },
-  { path: '/home', label: '消息' },
-  { path: '/demo', label: 'Demo' },
-  { path: '/about', label: '关于' },
-];
-
-export default function Header() {
-  const location = useLocation();
-
-  return (
-    <header className="page-header">
-      <h1>Pinme App</h1>
-      <nav>
-        {NAV_ITEMS.map((item) => (
-          <Link
-            key={item.path}
-            to={item.path}
-            className={location.pathname === item.path ? 'active' : ''}
-          >
-            {item.label}
-          </Link>
-        ))}
-      </nav>
-    </header>
-  );
-}

package/template/frontend/src/main.tsx

@@ -1,21 +0,0 @@
-import React from 'react';
-import ReactDOM from 'react-dom/client';
-import { BrowserRouter, Routes, Route } from 'react-router-dom';
-import App from './App';
-import Home from './pages/Home';
-import About from './pages/About';
-import Demo from './pages/Demo';
-import './App.css';
-
-ReactDOM.createRoot(document.getElementById('root')!).render(
-  <React.StrictMode>
-    <BrowserRouter>
-      <Routes>
-        <Route path="/" element={<App />} />
-        <Route path="/home" element={<Home />} />
-        <Route path="/about" element={<About />} />
-        <Route path="/demo" element={<Demo />} />
-      </Routes>
-    </BrowserRouter>
-  </React.StrictMode>
-);

package/template/frontend/src/pages/About/index.tsx

@@ -1,39 +0,0 @@
-import Header from '../../components/Header';
-
-export default function About() {
-  return (
-    <div className="page">
-      <Header />
-
-      <main>
-        <section className="about">
-          <h2>关于 Pinme</h2>
-          <p>
-            Pinme 是一个一站式全栈部署工具，整合了去中心化静态托管（IPFS）和无服务器后端（Cloudflare Workers + D1 数据库）。
-          </p>
-          
-          <h3>核心功能</h3>
-          <ul>
-            <li><code>pinme upload</code> - 前端静态文件 → IPFS，永久可访问</li>
-            <li><code>pinme worker deploy</code> - 后端 Worker → {`{name}.pinme.pro`}</li>
-            <li><code>pinme db migrate</code> - SQL 迁移文件 → D1 数据库</li>
-          </ul>
-
-          <h3>技术栈</h3>
-          <ul>
-            <li>前端: React + TypeScript + Vite</li>
-            <li>后端: Cloudflare Workers</li>
-            <li>数据库: Cloudflare D1 (SQLite)</li>
-            <li>部署: Pinme (IPFS + Workers)</li>
-          </ul>
-
-          <div className="links">
-            <a href="https://pinme.eth.limo" target="_blank" rel="noopener noreferrer">
-              访问 Pinme →
-            </a>
-          </div>
-        </section>
-      </main>
-    </div>
-  );
-}

package/template/frontend/src/pages/Demo/index.tsx

@@ -1,87 +0,0 @@
-import { useEffect, useState } from 'react';
-import Header from '../../components/Header';
-import { getApiUrl } from '../../utils/api';
-
-interface RootDomainData {
-  code: number;
-  msg: string;
-  data?: {
-    domain: string;
-  };
-}
-
-export default function Demo() {
-  const [loading, setLoading] = useState(false);
-  const [result, setResult] = useState<RootDomainData | null>(null);
-  const [error, setError] = useState<string | null>(null);
-
-  async function fetchRootDomain() {
-    setLoading(true);
-    setError(null);
-    try {
-      const res = await fetch(getApiUrl('/api/root-domain'));
-      const data = await res.json();
-      setResult(data);
-    } catch (err) {
-      setError('请求失败，请稍后重试');
-      console.error(err);
-    } finally {
-      setLoading(false);
-    }
-  }
-
-  useEffect(() => {
-    fetchRootDomain();
-  }, []);
-
-  return (
-    <div className="page">
-      <Header />
-
-      <main>
-        <section className="demo">
-          <h2>API Demo</h2>
-          <p className="desc">
-            示例：调用 Pinme API 获取用户的 Root Domain
-          </p>
-
-          <div className="api-box">
-            <div className="api-method">GET</div>
-            <div className="api-url">/api/root-domain</div>
-          </div>
-
-          <button 
-            className="btn-fetch" 
-            onClick={fetchRootDomain}
-            disabled={loading}
-          >
-            {loading ? '请求中...' : '重新获取'}
-          </button>
-
-          {error && (
-            <div className="result error">{error}</div>
-          )}
-
-          {result && (
-            <div className="result">
-              <h3>响应结果：</h3>
-              <pre>{JSON.stringify(result, null, 2)}</pre>
-              {result.data?.domain && (
-                <div className="domain-result">
-                  <span>你的 Root Domain: </span>
-                  <a 
-                    href={`https://${result.data.domain}`} 
-                    target="_blank" 
-                    rel="noopener noreferrer"
-                  >
-                    {result.data.domain} →
-                  </a>
-                </div>
-              )}
-            </div>
-          )}
-        </section>
-      </main>
-    </div>
-  );
-}

package/template/frontend/src/pages/Home/index.tsx

@@ -1,94 +0,0 @@
-import { useEffect, useState } from 'react';
-import Header from '../../components/Header';
-import { API, getApiUrl } from '../../utils/api';
-
-interface Message {
-  id: number;
-  content: string;
-  created_at: string;
-}
-
-export default function Home() {
-  const [messages, setMessages] = useState<Message[]>([]);
-  const [input, setInput] = useState('');
-  const [loading, setLoading] = useState(false);
-
-  useEffect(() => {
-    fetchMessages();
-  }, []);
-
-  async function fetchMessages() {
-    try {
-      const res = await fetch(getApiUrl('/api/hello'));
-      const data = await res.json();
-      setMessages(data.data || []);
-    } catch (error) {
-      console.error('Failed to fetch messages:', error);
-    }
-  }
-
-  async function handleSubmit(e: React.FormEvent) {
-    e.preventDefault();
-    if (!input.trim()) return;
-
-    setLoading(true);
-    try {
-      const res = await fetch(getApiUrl('/api/messages'), {
-        method: 'POST',
-        headers: { 'Content-Type': 'application/json' },
-        body: JSON.stringify({ message: input }),
-      });
-      if (res.ok) {
-        setInput('');
-        fetchMessages();
-      }
-    } catch (error) {
-      console.error('Failed to send message:', error);
-    } finally {
-      setLoading(false);
-    }
-  }
-
-  return (
-    <div className="page">
-      <Header />
-
-      <main>
-        <section className="api-info">
-          <code>API: {API}</code>
-        </section>
-
-        <form onSubmit={handleSubmit} className="message-form">
-          <input
-            type="text"
-            value={input}
-            onChange={(e) => setInput(e.target.value)}
-            placeholder="输入消息..."
-            disabled={loading}
-          />
-          <button type="submit" disabled={loading || !input.trim()}>
-            {loading ? '发送中...' : '发送'}
-          </button>
-        </form>
-
-        <section className="messages">
-          <h2>消息列表</h2>
-          {messages.length === 0 ? (
-            <p className="empty">暂无消息</p>
-          ) : (
-            <ul>
-              {messages.map((msg) => (
-                <li key={msg.id}>
-                  <span className="content">{msg.content}</span>
-                  <span className="time">
-                    {new Date(msg.created_at).toLocaleString()}
-                  </span>
-                </li>
-              ))}
-            </ul>
-          )}
-        </section>
-      </main>
-    </div>
-  );
-}

package/template/frontend/src/utils/api.ts

@@ -1,6 +0,0 @@
-// API 配置
-export const API = import.meta.env.VITE_API_URL || '';
-
-export function getApiUrl(path: string): string {
-  return API ? `${API}${path}` : path;
-}

package/template/frontend/src/vite-env.d.ts

@@ -1 +0,0 @@
-/// <reference types="vite/client" />