Compare commits

...

13 Commits

Author SHA1 Message Date
Severian
dceb65a529 google analytics 2025-10-04 05:32:58 +08:00
Severian
35522d935d colored code tags 2025-10-04 05:27:39 +08:00
Severian
875ace5b2d fix non-streaming 2025-10-04 05:22:04 +08:00
Severian
3a67baf48b updated directions 2025-10-04 05:05:44 +08:00
Severian
b0d5696a3a match token fix 2025-10-04 04:55:44 +08:00
Severian
ff9d5532da chore: test 2025-10-04 04:49:28 +08:00
Severian
e10fd80914 minor changes 2025-10-04 04:29:23 +08:00
Severian
d720ddcea5 2.0 2025-10-04 04:28:02 +08:00
Severian
624f9f264b formatting 2025-10-03 23:28:34 +08:00
Severian
936a8a7b62 notebook no longer needed 2025-10-03 23:27:28 +08:00
Severian
b61879e157 Merge pull request #4 from severian-dev/multiturn-sucker
feat: Added multiturn messaging and tracking of scenario/description …
2025-10-03 23:20:12 +08:00
Ema Park
0a39f1dbea Removing version attribute 2025-09-26 20:01:22 -04:00
Ema Park
5460082ead Initial dockerfile, docker-compose. 2025-09-26 19:50:31 -04:00
6 changed files with 865 additions and 668 deletions

View File

@@ -4,7 +4,8 @@ Check package.json for commands, I can't be bothered.
### Changelog
- 2.0: Multimessage support! Tracks changes to character descriptions and scenarios across multiple extractions. Shows version badges, message counts, and provides detailed change history viewer.
- 2.0: from Tui: Multimessage support! Tracks changes to character descriptions and scenarios across multiple extractions. Shows version badges, message counts, and provides detailed change history viewer.
- also 2.0: V2 charcard format and alternate greetings.
- 1.9: Not again. They changed stuff again. What is this?
- 1.8: Handling for new prompt structure, new instructions
- 1.7: Handling for nested XML character tags

View File

@@ -1,290 +0,0 @@
{
"cells": [
{
"cell_type": "markdown",
"metadata": {
"id": "zMVSOtXUASM8"
},
"source": [
"## **Card Definition Extractor**\n",
"\n",
"Standalone version with directions: https://sucker.severian.dev\n",
"\n",
"I've gotten into making models at [trashpanda-org](https://huggingface.co/trashpanda-org), check out hasnonname's [Mullein](https://huggingface.co/trashpanda-org/MS-24B-Mullein-v0)!\n",
"\n",
"> _lmk on Discord if you have any issues while using this - Severian_\n",
"\n",
"---\n",
"\n",
"**Changelog:**\n",
"- v0.2: fixed to handle Janitor making changes due to R1 handling.\n"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {
"colab": {
"background_save": true,
"base_uri": "https://localhost:8080/"
},
"id": "a0pFE9KCDh8P",
"outputId": "d647688d-e541-4e5f-e13d-4b385ee84d8b"
},
"outputs": [
{
"name": "stdout",
"output_type": "stream",
"text": [
"Requirement already satisfied: flask-cors in /usr/local/lib/python3.11/dist-packages (5.0.0)\n",
"Requirement already satisfied: Flask>=0.9 in /usr/local/lib/python3.11/dist-packages (from flask-cors) (3.1.0)\n",
"Requirement already satisfied: Werkzeug>=3.1 in /usr/local/lib/python3.11/dist-packages (from Flask>=0.9->flask-cors) (3.1.3)\n",
"Requirement already satisfied: Jinja2>=3.1.2 in /usr/local/lib/python3.11/dist-packages (from Flask>=0.9->flask-cors) (3.1.5)\n",
"Requirement already satisfied: itsdangerous>=2.2 in /usr/local/lib/python3.11/dist-packages (from Flask>=0.9->flask-cors) (2.2.0)\n",
"Requirement already satisfied: click>=8.1.3 in /usr/local/lib/python3.11/dist-packages (from Flask>=0.9->flask-cors) (8.1.8)\n",
"Requirement already satisfied: blinker>=1.9 in /usr/local/lib/python3.11/dist-packages (from Flask>=0.9->flask-cors) (1.9.0)\n",
"Requirement already satisfied: MarkupSafe>=2.0 in /usr/local/lib/python3.11/dist-packages (from Jinja2>=3.1.2->Flask>=0.9->flask-cors) (3.0.2)\n",
"Requirement already satisfied: flask-cors in /usr/local/lib/python3.11/dist-packages (5.0.0)\n",
"Requirement already satisfied: flask_cloudflared in /usr/local/lib/python3.11/dist-packages (0.0.14)\n",
"Requirement already satisfied: Flask>=0.9 in /usr/local/lib/python3.11/dist-packages (from flask-cors) (3.1.0)\n",
"Requirement already satisfied: requests in /usr/local/lib/python3.11/dist-packages (from flask_cloudflared) (2.32.3)\n",
"Requirement already satisfied: Werkzeug>=3.1 in /usr/local/lib/python3.11/dist-packages (from Flask>=0.9->flask-cors) (3.1.3)\n",
"Requirement already satisfied: Jinja2>=3.1.2 in /usr/local/lib/python3.11/dist-packages (from Flask>=0.9->flask-cors) (3.1.5)\n",
"Requirement already satisfied: itsdangerous>=2.2 in /usr/local/lib/python3.11/dist-packages (from Flask>=0.9->flask-cors) (2.2.0)\n",
"Requirement already satisfied: click>=8.1.3 in /usr/local/lib/python3.11/dist-packages (from Flask>=0.9->flask-cors) (8.1.8)\n",
"Requirement already satisfied: blinker>=1.9 in /usr/local/lib/python3.11/dist-packages (from Flask>=0.9->flask-cors) (1.9.0)\n",
"Requirement already satisfied: charset-normalizer<4,>=2 in /usr/local/lib/python3.11/dist-packages (from requests->flask_cloudflared) (3.4.1)\n",
"Requirement already satisfied: idna<4,>=2.5 in /usr/local/lib/python3.11/dist-packages (from requests->flask_cloudflared) (3.10)\n",
"Requirement already satisfied: urllib3<3,>=1.21.1 in /usr/local/lib/python3.11/dist-packages (from requests->flask_cloudflared) (2.3.0)\n",
"Requirement already satisfied: certifi>=2017.4.17 in /usr/local/lib/python3.11/dist-packages (from requests->flask_cloudflared) (2024.12.14)\n",
"Requirement already satisfied: MarkupSafe>=2.0 in /usr/local/lib/python3.11/dist-packages (from Jinja2>=3.1.2->Flask>=0.9->flask-cors) (3.0.2)\n",
" * Serving Flask app '__main__'\n",
" * Debug mode: off\n"
]
},
{
"name": "stderr",
"output_type": "stream",
"text": [
"INFO:werkzeug:\u001b[31m\u001b[1mWARNING: This is a development server. Do not use it in a production deployment. Use a production WSGI server instead.\u001b[0m\n",
" * Running on http://127.0.0.1:5000\n",
"INFO:werkzeug:\u001b[33mPress CTRL+C to quit\u001b[0m\n"
]
},
{
"name": "stdout",
"output_type": "stream",
"text": [
" * Running on https://little-disputes-posting-palmer.trycloudflare.com\n",
" * Traffic stats available on http://127.0.0.1:8396/metrics\n"
]
},
{
"name": "stderr",
"output_type": "stream",
"text": [
"INFO:werkzeug:127.0.0.1 - - [04/Feb/2025 22:53:13] \"OPTIONS / HTTP/1.1\" 200 -\n"
]
},
{
"name": "stdout",
"output_type": "stream",
"text": [
"Card definition JSON created at: /tmp/tmpynlda8kv.json\n"
]
},
{
"data": {
"application/javascript": "\n async function download(id, filename, size) {\n if (!google.colab.kernel.accessAllowed) {\n return;\n }\n const div = document.createElement('div');\n const label = document.createElement('label');\n label.textContent = `Downloading \"${filename}\": `;\n div.appendChild(label);\n const progress = document.createElement('progress');\n progress.max = size;\n div.appendChild(progress);\n document.body.appendChild(div);\n\n const buffers = [];\n let downloaded = 0;\n\n const channel = await google.colab.kernel.comms.open(id);\n // Send a message to notify the kernel that we're ready.\n channel.send({})\n\n for await (const message of channel.messages) {\n // Send a message to notify the kernel that we're ready.\n channel.send({})\n if (message.buffers) {\n for (const buffer of message.buffers) {\n buffers.push(buffer);\n downloaded += buffer.byteLength;\n progress.value = downloaded;\n }\n }\n }\n const blob = new Blob(buffers, {type: 'application/binary'});\n const a = document.createElement('a');\n a.href = window.URL.createObjectURL(blob);\n a.download = filename;\n div.appendChild(a);\n a.click();\n div.remove();\n }\n ",
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": "download(\"download_8462ad82-aca0-40a4-8cbb-0342ff5a7e1c\", \"tmpynlda8kv.json\", 14791)",
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"name": "stderr",
"output_type": "stream",
"text": [
"INFO:werkzeug:127.0.0.1 - - [04/Feb/2025 22:53:14] \"POST / HTTP/1.1\" 200 -\n"
]
}
],
"source": [
"# @title Card Definition Extractor\n",
"\n",
"# @markdown Directions for use:\n",
"# @markdown - If enabled, starts the proxy in character card extraction mode.\n",
"# @markdown - Use the proxy as normal, and start a new chat with your character of choice.\n",
"# @markdown - After sending the first message, the proxy will process the character card in v1 format\n",
"# @markdown - Stop the proxy and Colab will download the JSON file on your device\n",
"# @markdown - Your custom prompt will appear on the description field so this is best used with a cleared-out custom prompt section on janitor.ai\n",
"# @markdown - You can start multiple new chats and send messages for the extractor to capture cards, and when you stop the notebook, it will download all extracted files at once.\n",
"\n",
"# @markdown **Select Tunnel Provider**\n",
"tunnel_provider = \"Cloudflare\" # @param [\"Cloudflare\", \"Localtunnel\", \"Ngrok\"]\n",
"\n",
"# @markdown **Ngrok Auth Token**: If using ngrok, sign up for an auth token at https://dashboard.ngrok.com/signup\n",
"ngrok_auth_token = \"\" # @param {type:\"string\"}\n",
"\n",
"card_definition_extractor = True\n",
"!pip install flask-cors\n",
"\n",
"import json\n",
"import requests\n",
"import time\n",
"from flask import Flask, request, jsonify\n",
"from flask_cors import CORS\n",
"import re\n",
"import tempfile\n",
"import os\n",
"\n",
"app = Flask(__name__)\n",
"CORS(app)\n",
"\n",
"# Depending on the provider, set up the tunnel\n",
"if tunnel_provider == \"Cloudflare\":\n",
" !pip install flask-cors flask_cloudflared\n",
" from flask_cloudflared import run_with_cloudflared\n",
" run_with_cloudflared(app)\n",
"elif tunnel_provider == \"Localtunnel\":\n",
" !pip install flask-cors flask_localtunnel\n",
" from flask_lt import run_with_lt\n",
" run_with_lt(app)\n",
"elif tunnel_provider == \"Ngrok\":\n",
" !pip install flask-cors pyngrok==7.1.2\n",
" from pyngrok import ngrok\n",
" if ngrok_auth_token.strip():\n",
" ngrok.set_auth_token(ngrok_auth_token.strip())\n",
" public_url = ngrok.connect(5000).public_url\n",
" print(\"Public URL:\", public_url)\n",
"\n",
"def extract_between_tags(content, tag):\n",
" \"\"\"\n",
" Extracts content between XML-like tags.\n",
" Returns empty string if tag not found.\n",
" \"\"\"\n",
" start_tag = f\"<{tag}>\"\n",
" end_tag = f\"</{tag}>\"\n",
" start_idx = content.find(start_tag)\n",
" if start_idx == -1:\n",
" return \"\"\n",
" \n",
" end_idx = content.find(end_tag, start_idx)\n",
" if end_idx == -1:\n",
" return \"\"\n",
" \n",
" return content[start_idx + len(start_tag):end_idx].strip()\n",
"\n",
"def find_tags_between(content, start_marker, end_marker):\n",
" \"\"\"\n",
" Finds all XML-like tags and their content between two marker tags.\n",
" Returns list of {tag, content} dictionaries.\n",
" \"\"\"\n",
" start_idx = content.find(f\"<{start_marker}>\")\n",
" if start_idx == -1:\n",
" return []\n",
" \n",
" end_idx = content.find(f\"<{end_marker}>\")\n",
" if end_idx == -1:\n",
" return []\n",
" \n",
" section = content[start_idx + len(start_marker) + 2:end_idx]\n",
" tag_regex = r\"<([^/>]+)>([^<]+)</\\1>\"\n",
" matches = re.finditer(tag_regex, section)\n",
" \n",
" return [{\"tag\": match.group(1), \"content\": match.group(2).strip()} for match in matches]\n",
"\n",
"def extract_card_data(messages):\n",
" content0 = messages[0][\"content\"]\n",
" content1 = messages[2][\"content\"]\n",
"\n",
" # Find all persona tags between system and scenario, take the last one as character\n",
" personas = find_tags_between(content0, \"system\", \"scenario\")\n",
" char_persona = personas[-1] if personas else {\"tag\": \"\", \"content\": \"\"}\n",
" char_name = char_persona[\"tag\"]\n",
"\n",
" card_data = {\n",
" \"name\": char_name,\n",
" \"description\": char_persona[\"content\"],\n",
" \"scenario\": extract_between_tags(content0, \"scenario\"),\n",
" \"mes_example\": extract_between_tags(content0, \"example_dialogs\"),\n",
" \"personality\": \"\", # This field isn't used in the new format\n",
" \"first_mes\": content1\n",
" }\n",
"\n",
" # Replace character name with placeholder in all fields\n",
" def safe_replace(text, old, new):\n",
" return text.replace(old, new) if old else text\n",
"\n",
" for field in card_data:\n",
" if field != \"name\": # Exclude the \"name\" field\n",
" val = card_data[field]\n",
" val = safe_replace(val, char_name, \"{{char}}\")\n",
" card_data[field] = val\n",
"\n",
" return card_data\n",
"\n",
"@app.route('/', methods=['GET'])\n",
"def default():\n",
" return {\"status\": \"online\"}\n",
"\n",
"@app.route('/', methods=['POST'])\n",
"def process_card():\n",
" body = request.json\n",
" if 'messages' not in body:\n",
" return jsonify(error=\"Missing 'messages' in request body\"), 400\n",
"\n",
" if card_definition_extractor and len(body[\"messages\"]) >= 2:\n",
" card_data = extract_card_data(body[\"messages\"])\n",
" # If running in Colab, download the file\n",
" try:\n",
" from google.colab import files\n",
" import tempfile\n",
" temp_json = tempfile.NamedTemporaryFile(delete=False, suffix=\".json\")\n",
" with open(temp_json.name, 'w', encoding='utf-8') as f:\n",
" json.dump(card_data, f, ensure_ascii=False, indent=2)\n",
" print(\"Card definition JSON created at:\", temp_json.name)\n",
" files.download(temp_json.name)\n",
" except ImportError:\n",
" pass # Not in Colab, just return JSON\n",
"\n",
" return jsonify(card_data), 200\n",
" else:\n",
" return jsonify(status=\"Card definition extractor not enabled or insufficient messages\"), 200\n",
"\n",
"if __name__ == '__main__':\n",
" if tunnel_provider != \"Cloudflare\":\n",
" print('\\n Colab IP: ', end='')\n",
" !curl ipecho.net/plain\n",
" print('\\n')\n",
" app.run()\n"
]
}
],
"metadata": {
"colab": {
"provenance": []
},
"kernelspec": {
"display_name": "Python 3",
"name": "python3"
},
"language_info": {
"name": "python"
}
},
"nbformat": 4,
"nbformat_minor": 0
}

8
docker-compose.yml Normal file
View File

@@ -0,0 +1,8 @@
services:
web:
build: .
image: sucker
ports:
- "3000:3000"
environment:
NODE_ENV: production

34
dockerfile Normal file
View File

@@ -0,0 +1,34 @@
FROM node:18-alpine AS base
WORKDIR /app
FROM base AS deps
COPY package.json package-lock.json* yarn.lock* pnpm-lock.yaml* ./
RUN \
if [ -f package-lock.json ]; then npm ci; \
elif [ -f yarn.lock ]; then yarn install --frozen-lockfile; \
elif [ -f pnpm-lock.yaml ]; then npm install -g pnpm && pnpm install --frozen-lockfile; \
else echo "No lockfile found." && npm install; \
fi
FROM base AS builder
COPY --from=deps /app/node_modules ./node_modules
COPY . .
RUN npm run build
FROM base AS runner
ENV NODE_ENV=production
RUN addgroup --system --gid 1001 nodejs && adduser --system --uid 1001 nextjs
WORKDIR /app
COPY --from=builder /app/public ./public
COPY --from=builder /app/.next ./.next
COPY --from=builder /app/node_modules ./node_modules
COPY --from=builder /app/package.json ./package.json
USER nextjs
EXPOSE 3000
CMD ["npm", "start"]

File diff suppressed because it is too large Load Diff

View File

@@ -19,33 +19,49 @@ import {
} from "@/components/ui/dialog";
import { Input } from "@/components/ui/input";
import { Png } from "@/lib/png";
import { ChevronUp, ChevronDown, Copy } from "lucide-react";
import {
ChevronUp,
ChevronDown,
Copy,
ChevronLeft,
ChevronRight,
} from "lucide-react";
import {
CollapsibleContent,
Collapsible,
CollapsibleTrigger,
} from "@/components/ui/collapsible";
import Script from "next/script";
interface Card {
id: string;
interface CardDataV2 {
name: string;
first_mes: string;
alternate_greetings?: string[];
description: string;
personality: string;
mes_example: string;
scenario: string;
creator?: string;
creator_notes?: string;
system_prompt?: string;
post_history_instructions?: string;
tags?: string[];
character_version?: string;
extensions?: Record<string, unknown>;
}
interface Card {
id: string;
data: CardDataV2;
trackingName?: string;
spec?: string;
spec_version?: string;
avatarUrl?: string;
hasVersions?: boolean;
versionCount?: number;
messageCount?: number;
initialVersion?: {
name: string;
first_mes: string;
description: string;
personality: string;
mes_example: string;
scenario: string;
};
alternate_greetings?: string[];
initialVersion?: CardDataV2;
}
export default function Home() {
@@ -62,6 +78,11 @@ export default function Home() {
const [changesDialogOpen, setChangesDialogOpen] = useState(false);
const [selectedChanges, setSelectedChanges] = useState<any>(null);
const [showFullText, setShowFullText] = useState(false);
const [altGreetingIndexById, setAltGreetingIndexById] = useState<
Record<string, number>
>({});
const [proxyUrl, setProxyUrl] = useState("https://sucker.severian.dev/api/proxy");
const fetchCards = async () => {
try {
@@ -89,22 +110,36 @@ export default function Home() {
fetchCards();
}, []);
useEffect(() => {
if (typeof window !== "undefined") {
const origin = window.location.origin;
setProxyUrl(`${origin}/api/proxy`);
}
}, []);
const downloadJson = (card: Card) => {
// Use initial version for download, or current version if no initial version available
const downloadData = card.initialVersion ? {
name: card.initialVersion.name,
first_mes: card.initialVersion.first_mes,
description: card.initialVersion.description,
personality: card.initialVersion.personality,
mes_example: card.initialVersion.mes_example,
scenario: card.initialVersion.scenario,
} : {
name: card.name,
first_mes: card.first_mes,
description: card.description,
personality: card.personality,
mes_example: card.mes_example,
scenario: card.scenario,
const chosen = card.initialVersion || card.data;
const downloadData = {
data: {
name: chosen.name,
first_mes: chosen.first_mes,
alternate_greetings: chosen.alternate_greetings || [],
description: chosen.description,
personality: chosen.personality,
mes_example: chosen.mes_example,
scenario: chosen.scenario,
creator: (chosen as any).creator || "",
creator_notes: (chosen as any).creator_notes || "",
system_prompt: (chosen as any).system_prompt || "",
post_history_instructions:
(chosen as any).post_history_instructions || "",
tags: (chosen as any).tags || [],
character_version: (chosen as any).character_version || "1",
extensions: (chosen as any).extensions || {},
},
spec: card.spec || "chara_card_v2",
spec_version: card.spec_version || "2.0",
};
const element = document.createElement("a");
@@ -112,7 +147,10 @@ export default function Home() {
type: "application/json",
});
element.href = URL.createObjectURL(file);
element.download = `${card.name.replace(/[^a-zA-Z0-9\-_]/g, '_')}.json`;
element.download = `${(card.initialVersion?.name || card.data.name).replace(
/[^a-zA-Z0-9\-_]/g,
"_"
)}.json`;
document.body.appendChild(element);
element.click();
document.body.removeChild(element);
@@ -122,22 +160,26 @@ export default function Home() {
try {
const response = await fetch(`/api/proxy?changes=true&cardId=${card.id}`);
if (!response.ok) {
throw new Error('Failed to fetch changes');
throw new Error("Failed to fetch changes");
}
const changesData = await response.json();
const element = document.createElement("a");
const file = new Blob([JSON.stringify(changesData, null, 2)], {
type: "application/json",
});
element.href = URL.createObjectURL(file);
element.download = `${card.name.replace(/[^a-zA-Z0-9\-_]/g, '_')}_changes.json`;
element.download = `${(
card.initialVersion?.name || card.data.name
).replace(/[^a-zA-Z0-9\-_]/g, "_")}_changes.json`;
document.body.appendChild(element);
element.click();
document.body.removeChild(element);
} catch (error) {
console.error("Error downloading changes:", error);
alert("Failed to download changes. The card may not have version history.");
alert(
"Failed to download changes. The card may not have version history."
);
}
};
@@ -145,9 +187,9 @@ export default function Home() {
try {
const response = await fetch(`/api/proxy?changes=true&cardId=${card.id}`);
if (!response.ok) {
throw new Error('Failed to fetch changes');
throw new Error("Failed to fetch changes");
}
const changesData = await response.json();
setSelectedChanges(changesData);
setShowFullText(false); // Reset to diff view by default
@@ -187,29 +229,39 @@ export default function Home() {
const arrayBuffer = await pngBlob.arrayBuffer();
// Use initial version for PNG embedding, or current version if no initial version available
const pngData = card.initialVersion ? {
name: card.initialVersion.name,
first_mes: card.initialVersion.first_mes,
description: card.initialVersion.description,
personality: card.initialVersion.personality,
mes_example: card.initialVersion.mes_example,
scenario: card.initialVersion.scenario,
} : {
name: card.name,
first_mes: card.first_mes,
description: card.description,
personality: card.personality,
mes_example: card.mes_example,
scenario: card.scenario,
const chosen = card.initialVersion || card.data;
const pngData = {
data: {
name: chosen.name,
first_mes: chosen.first_mes,
alternate_greetings: chosen.alternate_greetings || [],
description: chosen.description,
personality: chosen.personality,
mes_example: chosen.mes_example,
scenario: chosen.scenario,
creator: (chosen as any).creator || "",
creator_notes: (chosen as any).creator_notes || "",
system_prompt: (chosen as any).system_prompt || "",
post_history_instructions:
(chosen as any).post_history_instructions || "",
tags: (chosen as any).tags || [],
character_version: (chosen as any).character_version || "1",
extensions: (chosen as any).extensions || {},
},
spec: card.spec || "chara_card_v2",
spec_version: card.spec_version || "2.0",
};
const cardData = JSON.stringify(pngData);
const newImageData = Png.Generate(arrayBuffer, cardData);
const newFileName = `${
card.name.replace(/[^a-zA-Z0-9\-_]/g, '_') || "character"
(card.initialVersion?.name || card.data.name).replace(
/[^a-zA-Z0-9\-_]/g,
"_"
) || "character"
}.png`;
const newFile = new File([newImageData], newFileName, {
const newFile = new File([new Uint8Array(newImageData)], newFileName, {
type: "image/png",
});
@@ -269,12 +321,19 @@ export default function Home() {
return (
<main className="min-h-screen bg-background text-foreground">
<Script src="https://www.googletagmanager.com/gtag/js?id=G-YVD6QFSR71" strategy="afterInteractive" />
<Script id="gtag-init" strategy="afterInteractive">
{`window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-YVD6QFSR71');`}
</Script>
<div className="container mx-auto px-4 py-8">
<div className="flex justify-between items-center mb-4">
<div>
<h1 className="text-3xl font-bold">Sucker v2.0</h1>
<p className="text-sm text-muted-foreground">
Now with multimessage support! Tracks changes to character descriptions and scenarios across multiple extractions.
A couple of updates, see below.
</p>
</div>
<Button
@@ -291,10 +350,24 @@ export default function Home() {
<div className="bg-blue-50 dark:bg-blue-950 border border-blue-200 dark:border-blue-800 rounded-lg p-4">
<div className="flex flex-col justify-between">
<span className="text-lg font-semibold text-blue-800 dark:text-blue-200">
New: Multimessage Support
V2 charcard format, multi-turn support for scripts/lorebooks,
alternate greetings.
</span>
<p className="text-sm text-muted-foreground">
Sucker now tracks changes to character descriptions and scenarios across multiple messages. Cards with multiple versions show a version badge and offer a "Download Changes" button to get the change history.
Sucker now tracks changes to character descriptions and
scenarios across multiple messages. Cards with multiple versions
show a version badge and offer a "Download Changes" button to
get the change history.
<br />
Alternate greetings are also supported. Sucker will provide you
with a conversation ID that you can use to start off a new chat
when capturing alternate greetings, send it as first message
instead of the character name.
<br />
Directions are updated below. Make sure you read 'em.
<br />
If you're interested in hosting your own sucker instance, lmk
via Discord: @lyseverian, I've made the GH repo private for now.
</p>
</div>
</div>
@@ -326,28 +399,39 @@ export default function Home() {
</p>
<ol className="list-decimal list-inside">
<li className="mb-2">
Put <code>https://sucker.severian.dev/api/proxy</code> in your
Put <code style={{ color: "#fff0b9" }}>{proxyUrl}</code> in your
API settings, any value for model and key.
</li>
<li className="mb-2">
REQUIRED: Set your custom prompt to <code>&lt;.&gt;</code>
REQUIRED: Set your custom prompt to <code style={{ color: "#fff0b9" }}>&lt;.&gt;</code>
</li>
<li className="mb-2">
REQUIRED: Set your persona (or create a new one) with the name <code>&#123;user&#125;</code> and the description should only have <code>.</code> in it.
REQUIRED: Set your persona (or create a new one) with the name{" "}
<code style={{ color: "#fff0b9" }}>&#123;user&#125;</code> and the description should only
have <code style={{ color: "#fff0b9" }}>.</code> in it.
</li>
<li className="mb-2">
Save settings and refresh the page. Not this page. <i>That</i>{" "}
page.
</li>
<li className="mb-2">Start a new chat with a character.</li>
<li className="mb-2">
Start a new chat with a character or multiple.
</li>
<li className="mb-2">
You can either send a dot to let sucker make a best guess about the char name, or send the char name yourself and it'll be used instead.
Char name inference is implemented: if you send just a dot: <code style={{ color: "#fff0b9" }}>.</code>, sucker will use the inferred name from the persona tag, or you can send the character name yourself.
</li>
<li className="mb-2">
Hit the Refresh button here, and the cards should appear here.
</li>
<li className="mb-2">
If you're interested in capturing alternate greetings, start a
new chat and send the conversation ID as first message instead
of the character name. The format is{" "}
<code style={{ color: "#fff0b9" }}>[sucker:conv=conversationId]</code> which you'll be
given when creating a new card.
</li>
<li className="mb-2">
You can also send more messages with possible keywords to trigger scripts/lorebooks. Sucker will track changes to the description and scenario fields. Cards with multiple versions will show a version badge and offer a "Download Changes" button to get a detailed change
history with timestamps. Unfortunately, lorebook creation is out of scope at the moment, but you can use the changes detected to modify the character card yourself post-export.
</li>
<li className="mb-2">
Download the JSON files or go through a little more effort to
get PNGs instead.
@@ -358,12 +442,6 @@ export default function Home() {
discarded. Reloading the page will remove any attached avatars.
I'm not storing shit.
</p>
<p className="mb-2">
<strong>New:</strong> If you send multiple messages with the same character name,
Sucker will track changes to the description and scenario fields. Cards with
multiple versions will show a version badge and offer a "Download Changes"
button to get a detailed change history with timestamps.
</p>
</div>
</CollapsibleContent>
</Collapsible>
@@ -383,7 +461,9 @@ export default function Home() {
<AccordionItem value={`card-${index}`}>
<AccordionTrigger className="text-xl font-semibold">
<div className="flex items-center gap-2">
{card.name || "Unnamed Card"}
{card.initialVersion?.name ||
card.data?.name ||
"Unnamed Card"}
<div className="flex gap-1">
{card.hasVersions && (
<span className="text-sm bg-blue-100 dark:bg-blue-900 text-blue-800 dark:text-blue-200 px-2 py-1 rounded-full">
@@ -400,19 +480,26 @@ export default function Home() {
</AccordionTrigger>
<AccordionContent>
<div id={`card-${index}`} className="space-y-4 mt-4">
{(card.initialVersion?.description || card.description) && (
{(card.initialVersion?.description ||
card.data?.description) && (
<Accordion type="single" collapsible>
<AccordionItem value="description">
<AccordionTrigger>Description</AccordionTrigger>
<AccordionContent>
<div className="flex justify-between">
<pre className="whitespace-pre-wrap font-sans text-sm">{card.initialVersion?.description || card.description}</pre>
<Button
variant="ghost"
size="icon"
onClick={(e) => {
e.stopPropagation();
copyToClipboard(card.initialVersion?.description || card.description);
<pre className="whitespace-pre-wrap font-sans text-sm">
{card.initialVersion?.description ||
card.data.description}
</pre>
<Button
variant="ghost"
size="icon"
onClick={(e) => {
e.stopPropagation();
copyToClipboard(
card.initialVersion?.description ||
card.data.description
);
}}
>
<Copy className="h-4 w-4" />
@@ -422,7 +509,8 @@ export default function Home() {
</AccordionItem>
</Accordion>
)}
{(card.initialVersion?.first_mes || card.first_mes) && (
{(card.initialVersion?.first_mes ||
card.data?.first_mes) && (
<Accordion type="single" collapsible>
<AccordionItem value="first-message">
<AccordionTrigger>
@@ -430,13 +518,19 @@ export default function Home() {
</AccordionTrigger>
<AccordionContent>
<div className="flex justify-between">
<pre className="whitespace-pre-wrap font-sans text-sm">{card.initialVersion?.first_mes || card.first_mes}</pre>
<Button
variant="ghost"
size="icon"
onClick={(e) => {
e.stopPropagation();
copyToClipboard(card.initialVersion?.first_mes || card.first_mes);
<pre className="whitespace-pre-wrap font-sans text-sm">
{card.initialVersion?.first_mes ||
card.data.first_mes}
</pre>
<Button
variant="ghost"
size="icon"
onClick={(e) => {
e.stopPropagation();
copyToClipboard(
card.initialVersion?.first_mes ||
card.data.first_mes
);
}}
>
<Copy className="h-4 w-4" />
@@ -446,19 +540,99 @@ export default function Home() {
</AccordionItem>
</Accordion>
)}
{(card.initialVersion?.scenario || card.scenario) && (
{card.alternate_greetings &&
card.alternate_greetings.length > 0 && (
<div className="mt-4">
<div className="flex items-center justify-between mb-2">
<h4 className="font-medium">{`Alternate Greetings (${
card.alternate_greetings?.length || 0
})`}</h4>
<div className="flex items-center gap-2">
<Button
variant="ghost"
size="icon"
onClick={() => {
const greetings =
card.alternate_greetings || [];
if (greetings.length === 0) return;
setAltGreetingIndexById((prev) => {
const current = prev[card.id] ?? 0;
const next =
(current - 1 + greetings.length) %
greetings.length;
return { ...prev, [card.id]: next };
});
}}
>
<ChevronLeft className="h-4 w-4" />
</Button>
<Button
variant="ghost"
size="icon"
onClick={() => {
const greetings =
card.alternate_greetings || [];
if (greetings.length === 0) return;
setAltGreetingIndexById((prev) => {
const current = prev[card.id] ?? 0;
const next =
(current + 1) % greetings.length;
return { ...prev, [card.id]: next };
});
}}
>
<ChevronRight className="h-4 w-4" />
</Button>
</div>
</div>
{(() => {
const greetings =
card.alternate_greetings || [];
const index =
altGreetingIndexById[card.id] ?? 0;
const current = greetings.length
? greetings[index % greetings.length]
: "";
return (
<div className="flex justify-between">
<pre className="whitespace-pre-wrap font-sans text-sm">
{current}
</pre>
<Button
variant="ghost"
size="icon"
onClick={() => {
if (!current) return;
copyToClipboard(current);
}}
>
<Copy className="h-4 w-4" />
</Button>
</div>
);
})()}
</div>
)}
{(card.initialVersion?.scenario ||
card.data?.scenario) && (
<Accordion type="single" collapsible>
<AccordionItem value="scenario">
<AccordionTrigger>Scenario</AccordionTrigger>
<AccordionContent>
<div className="flex justify-between">
<pre className="whitespace-pre-wrap font-sans text-sm">{card.initialVersion?.scenario || card.scenario}</pre>
<Button
variant="ghost"
size="icon"
onClick={(e) => {
e.stopPropagation();
copyToClipboard(card.initialVersion?.scenario || card.scenario);
<pre className="whitespace-pre-wrap font-sans text-sm">
{card.initialVersion?.scenario ||
card.data.scenario}
</pre>
<Button
variant="ghost"
size="icon"
onClick={(e) => {
e.stopPropagation();
copyToClipboard(
card.initialVersion?.scenario ||
card.data.scenario
);
}}
>
<Copy className="h-4 w-4" />
@@ -468,7 +642,8 @@ export default function Home() {
</AccordionItem>
</Accordion>
)}
{(card.initialVersion?.mes_example || card.mes_example) && (
{(card.initialVersion?.mes_example ||
card.data?.mes_example) && (
<Accordion type="single" collapsible>
<AccordionItem value="example-messages">
<AccordionTrigger>
@@ -476,13 +651,19 @@ export default function Home() {
</AccordionTrigger>
<AccordionContent>
<div className="flex justify-between">
<pre className="whitespace-pre-wrap font-sans text-sm">{card.initialVersion?.mes_example || card.mes_example}</pre>
<Button
variant="ghost"
size="icon"
onClick={(e) => {
e.stopPropagation();
copyToClipboard(card.initialVersion?.mes_example || card.mes_example);
<pre className="whitespace-pre-wrap font-sans text-sm">
{card.initialVersion?.mes_example ||
card.data.mes_example}
</pre>
<Button
variant="ghost"
size="icon"
onClick={(e) => {
e.stopPropagation();
copyToClipboard(
card.initialVersion?.mes_example ||
card.data.mes_example
);
}}
>
<Copy className="h-4 w-4" />
@@ -492,19 +673,26 @@ export default function Home() {
</AccordionItem>
</Accordion>
)}
{(card.initialVersion?.personality || card.personality) && (
{(card.initialVersion?.personality ||
card.data?.personality) && (
<Accordion type="single" collapsible>
<AccordionItem value="personality">
<AccordionTrigger>Personality</AccordionTrigger>
<AccordionContent>
<div className="flex justify-between">
<pre className="whitespace-pre-wrap font-sans text-sm">{card.initialVersion?.personality || card.personality}</pre>
<Button
variant="ghost"
size="icon"
onClick={(e) => {
e.stopPropagation();
copyToClipboard(card.initialVersion?.personality || card.personality);
<pre className="whitespace-pre-wrap font-sans text-sm">
{card.initialVersion?.personality ||
card.data.personality}
</pre>
<Button
variant="ghost"
size="icon"
onClick={(e) => {
e.stopPropagation();
copyToClipboard(
card.initialVersion?.personality ||
card.data.personality
);
}}
>
<Copy className="h-4 w-4" />
@@ -620,13 +808,16 @@ export default function Home() {
Change History: {selectedChanges?.cardName}
</DialogTitle>
<DialogDescription className="flex items-center justify-between">
<span>Version history showing changes to description and scenario fields</span>
<span>
Version history showing changes to description and scenario
fields
</span>
<Button
variant="outline"
size="sm"
onClick={() => setShowFullText(!showFullText)}
>
{showFullText ? 'Show Changes Only' : 'Show Full Text'}
{showFullText ? "Show Changes Only" : "Show Full Text"}
</Button>
</DialogDescription>
</DialogHeader>
@@ -635,16 +826,20 @@ export default function Home() {
<div className="space-y-4">
<div className="grid grid-cols-2 gap-4 text-sm">
<div>
<strong>Total Versions:</strong> {selectedChanges.totalVersions}
<strong>Total Versions:</strong>{" "}
{selectedChanges.totalVersions}
</div>
<div>
<strong>Current Version:</strong> {selectedChanges.currentVersion}
<strong>Current Version:</strong>{" "}
{selectedChanges.currentVersion}
</div>
<div>
<strong>Description Changes:</strong> {selectedChanges.summary.descriptionChanges}
<strong>Description Changes:</strong>{" "}
{selectedChanges.summary.descriptionChanges}
</div>
<div>
<strong>Scenario Changes:</strong> {selectedChanges.summary.scenarioChanges}
<strong>Scenario Changes:</strong>{" "}
{selectedChanges.summary.scenarioChanges}
</div>
</div>
@@ -660,16 +855,20 @@ export default function Home() {
</h4>
<div className="text-sm text-muted-foreground">
{new Date(version.timestamp).toLocaleString()}
{version.messageCount && ` • Message ${version.messageCount}`}
{version.messageCount &&
` • Message ${version.messageCount}`}
</div>
</div>
{version.changes.description && (
<div className="mb-3">
<h5 className="font-medium text-sm mb-1">Description Change:</h5>
{version.changeType === 'initial' ? (
<h5 className="font-medium text-sm mb-1">
Description Change:
</h5>
{version.changeType === "initial" ? (
<div className="bg-blue-50 dark:bg-blue-950 p-2 rounded text-sm">
<strong>Initial Content:</strong> {version.changes.description.new}
<strong>Initial Content:</strong>{" "}
{version.changes.description.new}
</div>
) : (
<div className="space-y-2">
@@ -677,15 +876,18 @@ export default function Home() {
<div className="bg-green-50 dark:bg-green-950 p-2 rounded text-sm">
<div className="flex justify-between items-start">
<div>
<strong>Added:</strong> {version.addedText.description}
<strong>Added:</strong>{" "}
{version.addedText.description}
</div>
<Button
variant="ghost"
size="icon"
<Button
variant="ghost"
size="icon"
className="ml-2 h-6 w-6"
onClick={(e) => {
e.stopPropagation();
copyToClipboard(version.addedText.description);
onClick={(e) => {
e.stopPropagation();
copyToClipboard(
version.addedText.description
);
}}
>
<Copy className="h-3 w-3" />
@@ -695,16 +897,19 @@ export default function Home() {
)}
{version.removedText?.description && (
<div className="bg-red-50 dark:bg-red-950 p-2 rounded text-sm">
<strong>Removed:</strong> {version.removedText.description}
<strong>Removed:</strong>{" "}
{version.removedText.description}
</div>
)}
{showFullText && (
<div className="space-y-1 mt-2 pt-2 border-t">
<div className="bg-gray-50 dark:bg-gray-950 p-2 rounded text-xs">
<strong>Full Old:</strong> {version.changes.description.old}
<strong>Full Old:</strong>{" "}
{version.changes.description.old}
</div>
<div className="bg-gray-50 dark:bg-gray-950 p-2 rounded text-xs">
<strong>Full New:</strong> {version.changes.description.new}
<strong>Full New:</strong>{" "}
{version.changes.description.new}
</div>
</div>
)}
@@ -712,13 +917,16 @@ export default function Home() {
)}
</div>
)}
{version.changes.scenario && (
<div>
<h5 className="font-medium text-sm mb-1">Scenario Change:</h5>
{version.changeType === 'initial' ? (
<h5 className="font-medium text-sm mb-1">
Scenario Change:
</h5>
{version.changeType === "initial" ? (
<div className="bg-blue-50 dark:bg-blue-950 p-2 rounded text-sm">
<strong>Initial Content:</strong> {version.changes.scenario.new}
<strong>Initial Content:</strong>{" "}
{version.changes.scenario.new}
</div>
) : (
<div className="space-y-2">
@@ -726,15 +934,18 @@ export default function Home() {
<div className="bg-green-50 dark:bg-green-950 p-2 rounded text-sm">
<div className="flex justify-between items-start">
<div>
<strong>Added:</strong> {version.addedText.scenario}
<strong>Added:</strong>{" "}
{version.addedText.scenario}
</div>
<Button
variant="ghost"
size="icon"
<Button
variant="ghost"
size="icon"
className="ml-2 h-6 w-6"
onClick={(e) => {
e.stopPropagation();
copyToClipboard(version.addedText.scenario);
onClick={(e) => {
e.stopPropagation();
copyToClipboard(
version.addedText.scenario
);
}}
>
<Copy className="h-3 w-3" />
@@ -744,16 +955,19 @@ export default function Home() {
)}
{version.removedText?.scenario && (
<div className="bg-red-50 dark:bg-red-950 p-2 rounded text-sm">
<strong>Removed:</strong> {version.removedText.scenario}
<strong>Removed:</strong>{" "}
{version.removedText.scenario}
</div>
)}
{showFullText && (
<div className="space-y-1 mt-2 pt-2 border-t">
<div className="bg-gray-50 dark:bg-gray-950 p-2 rounded text-xs">
<strong>Full Old:</strong> {version.changes.scenario.old}
<strong>Full Old:</strong>{" "}
{version.changes.scenario.old}
</div>
<div className="bg-gray-50 dark:bg-gray-950 p-2 rounded text-xs">
<strong>Full New:</strong> {version.changes.scenario.new}
<strong>Full New:</strong>{" "}
{version.changes.scenario.new}
</div>
</div>
)}