ParagonSpace: цифровые активы на основе данных звезд

Зачем это нужно

Зачем это нужно

Как работает

Все звезды хранятся в таблице paragon_stars. Drizzle ORM — это TypeScript-обертка над SQL. Мы описываем таблицу в schema.ts, и Drizzle автоматически создает типы, запросы и проверки.

Код

// Таблица звезды (упрощенно)
export const paragonStars = pgTable("paragon_stars", {
  id: serial("id").primaryKey(),
  tokenId: integer("token_id").notNull(),
  name: text("name").notNull(),
  rarity: text("rarity").notNull(),
  x: real("x").notNull(),
  y: real("y").notNull(),
  z: real("z").notNull(),
  minted: boolean("minted").default(false),
  wallet: text("wallet"),
  txHash: text("tx_hash"),
});

Зачем это нужно

Зачем звездам характеристики

Как работает

Каждая звезда имеет спектральный класс (O — самый горячий, голубой, M — холодный, красный), звездную величину magnitude (чем меньше, тем ярче) и позицию x/y/z в условном пространстве карты.

Код

// Пример одной звезды
{
  tokenId: 1,
  name: "Astra Prime",
  constellation: "Genesis Ring",
  rarity: "Mythic",
  spectralClass: "O",
  magnitude: 1.2,
  x: -42, y: 30, z: 72,
  color: "#8fd3ff" // голубой
}

Зачем это нужно

Зачем нужна 3D визуализация

Как работает

React-компонент ParagonStarMap принимает массив звезд из базы и отрисовывает их как точки на 2D Canvas с 3D-трансформациями (perspective через CSS transform-style: preserve-3d).

Код

// Отрисовка одной звезды на карте
{localStars.map(star => (
  <button
    key={star.id}
    className="absolute rounded-full"
    style={{
      left: `${50 + star.x * 0.42}%`,
      top: `${50 - star.y * 0.42}%`,
      width: `${size}px`,
      backgroundColor: star.color,
      boxShadow: `0 0 ${size * 1.8}px ${star.color}`,
      transform: `translateZ(${star.z * 2.1}px)`,
    }}
  />
))}

Зачем это нужно

Что происходит при нажатии кнопки Mint

Как работает

Когда вы вводите EVM-адрес и нажимаете Mint, браузер отправляет POST-запрос на /api/stars/mint. Сервер находит ближайшую свободную звезду (minted = false), записывает ваш адрес в поле wallet, генерирует тестовый txHash и ставит minted = true.

Код

// Серверный код минта
export async function mintParagonStar(wallet: string) {
  const available = await db.select()
    .from(paragonStars)
    .where(eq(paragonStars.minted, false))
    .orderBy(asc(paragonStars.tokenId))
    .limit(1);          // берем первую свободную
  const star = available[0];
  const [minted] = await db.update(paragonStars)
    .set({ minted: true, wallet, txHash, mintedAt: new Date() })
    .where(eq(paragonStars.id, star.id))
    .returning();
  return minted;
}

Зачем это нужно

Как заполняется база звезд

Как работает

В файле paragon-space.ts зашит массив seedStars с 50 реальными звёздами. При первом запросе к базе функция ensureParagonSeed() проверяет, есть ли записи в таблице. Если нет — вставляет все 50 звёзд через INSERT.

Код

// Логика при старте
async function ensureParagonSeed() {
  const [{ value }] = await db
    .select({ value: count() })
    .from(paragonStars);
  if (value === 0) {
    await db.insert(paragonStars)
      .values(seedStars)
      .onConflictDoNothing();
  }
}

Зачем это нужно

Почему сервер рендерит звезды

Как работает

Главная страница — async серверный компонент, который прямо при запросе подключается к PostgreSQL, загружает звезды и статистику, после чего передает их клиентскому компоненту ParagonStarMap.

Код

// server component на главной
export default async function HomePage() {
  const [stars, stats] = await Promise.all([
    getParagonStars(),   // запрос в PostgreSQL
    getParagonStats(),   // запрос статистики
  ]);
  return <ParagonStarMap stars={stars} />;
}