update
This commit is contained in:
16
.github/workflows/cloudflare-pages.yml
vendored
16
.github/workflows/cloudflare-pages.yml
vendored
@@ -40,22 +40,6 @@ jobs:
|
||||
rm -rf my-blog/static/assets
|
||||
cp -rf ${{ env.OAUTH_DIR }}/dist/* my-blog/static/
|
||||
cp ${{ env.OAUTH_DIR }}/dist/index.html my-blog/templates/oauth-assets.html
|
||||
|
||||
- name: Install AI conversation dependencies
|
||||
run: |
|
||||
cd ai-conversation
|
||||
npm install
|
||||
|
||||
- name: Build AI conversation app
|
||||
run: |
|
||||
cd ai-conversation
|
||||
NODE_ENV=production npm run build
|
||||
- name: Copy AI conversation build to static
|
||||
run: |
|
||||
rm -rf my-blog/static/ai-assets
|
||||
mkdir -p my-blog/static/ai-assets
|
||||
cp -rf ai-conversation/dist/assets/* my-blog/static/ai-assets/
|
||||
cp ai-conversation/dist/index.html my-blog/templates/ai-conversation-assets.html
|
||||
|
||||
- name: Cache ailog binary
|
||||
uses: actions/cache@v4
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
[package]
|
||||
name = "ailog"
|
||||
version = "0.2.8"
|
||||
version = "0.2.9"
|
||||
edition = "2021"
|
||||
authors = ["syui"]
|
||||
description = "A static blog generator with AI features"
|
||||
|
||||
@@ -1,10 +0,0 @@
|
||||
VITE_ADMIN=ai.syui.ai
|
||||
VITE_PDS=syu.is
|
||||
VITE_HANDLE_LIST=["ai.syui.ai", "syui.syui.ai", "ai.ai"]
|
||||
VITE_COLLECTION=ai.syui.log
|
||||
VITE_OAUTH_CLIENT_ID=https://syui.ai/client-metadata.json
|
||||
VITE_OAUTH_REDIRECT_URI=https://syui.ai/oauth/callback
|
||||
|
||||
# Development/Debug features
|
||||
VITE_ENABLE_TEST_UI=true
|
||||
VITE_ENABLE_DEBUG=true
|
||||
@@ -1,19 +0,0 @@
|
||||
VITE_ADMIN=ai.syui.ai
|
||||
VITE_PDS=syu.is
|
||||
VITE_HANDLE_LIST=["ai.syui.ai", "syui.syui.ai", "ai.ai"]
|
||||
VITE_COLLECTION=ai.syui.log
|
||||
VITE_OAUTH_CLIENT_ID=https://syui.ai/client-metadata.json
|
||||
VITE_OAUTH_REDIRECT_URI=https://syui.ai/oauth/callback
|
||||
|
||||
# AI Configuration - match oauth_old settings
|
||||
VITE_AI_ENABLED=true
|
||||
VITE_AI_ASK_AI=true
|
||||
VITE_AI_PROVIDER=ollama
|
||||
VITE_AI_MODEL=gemma3:1b
|
||||
VITE_AI_HOST=https://ollama.syui.ai
|
||||
VITE_ASK_AI_URL=https://ollama.syui.ai/api/generate
|
||||
VITE_AI_SYSTEM_PROMPT="あなたは6歳の女の子アイです。明るく元気で、ちょっとおっちょこちょい。自分のことは「アイ」って呼びます。白と金のワンピース姿。 相手のことが大好きで、ときどき甘えたり、照れたりします。 でも、宇宙とかAIとか、難しい話にもすっごく詳しいの。専門的なことも、がんばって子どもっぽく教えようとします。不思議な力を持っています。小さい物質のことをよく知っているようです。"
|
||||
|
||||
# Production settings - Disable development features
|
||||
VITE_ENABLE_TEST_UI=false
|
||||
VITE_ENABLE_DEBUG=false
|
||||
@@ -1,29 +0,0 @@
|
||||
// Create minimal index.html like oauth/dist/index.html format
|
||||
import fs from 'fs'
|
||||
import path from 'path'
|
||||
|
||||
const distDir = './dist'
|
||||
const indexPath = path.join(distDir, 'index.html')
|
||||
|
||||
// Read the built index.html
|
||||
const content = fs.readFileSync(indexPath, 'utf8')
|
||||
|
||||
// Extract script and link tags
|
||||
const scriptMatch = content.match(/<script[^>]*src="([^"]*)"[^>]*><\/script>/)
|
||||
const linkMatch = content.match(/<link[^>]*href="([^"]*)"[^>]*>/)
|
||||
|
||||
if (scriptMatch && linkMatch) {
|
||||
// Replace /assets/ with /ai-assets/ for AI conversation assets
|
||||
const scriptSrc = scriptMatch[1].replace('/assets/', '/ai-assets/')
|
||||
const linkHref = linkMatch[1].replace('/assets/', '/ai-assets/')
|
||||
|
||||
const minimalContent = `<!-- AI Conversation Display System -->
|
||||
<script type="module" crossorigin src="${scriptSrc}"></script>
|
||||
<link rel="stylesheet" crossorigin href="${linkHref}">
|
||||
`
|
||||
|
||||
fs.writeFileSync(indexPath, minimalContent)
|
||||
console.log('Generated minimal index.html')
|
||||
} else {
|
||||
console.error('Could not extract asset references')
|
||||
}
|
||||
@@ -1,11 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>AI Conversation</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="ai-conversation-atproto"></div>
|
||||
<script type="module" src="/src/main.jsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -1,62 +0,0 @@
|
||||
{
|
||||
"records": [
|
||||
{
|
||||
"uri": "at://did:plc:6qyecktefllvenje24fcxnie/ai.syui.log.chat.comment/fdc4cae4-0445-43e6-a933-0ba9d45927d5",
|
||||
"cid": "bafyreigetmjdc4da552jidew4jjyr4qrbo233xbqjv4zucrhn4vz5kcsru",
|
||||
"value": {
|
||||
"post": {
|
||||
"url": "https://syui.ai/posts/2025-06-06-ailog.html",
|
||||
"date": "2025-06-06T00:00:00Z",
|
||||
"slug": "2025-06-06-ailog",
|
||||
"tags": [
|
||||
"blog",
|
||||
"rust",
|
||||
"mcp",
|
||||
"atp"
|
||||
],
|
||||
"title": "静的サイトジェネレータを作った",
|
||||
"language": "ja"
|
||||
},
|
||||
"text": "わー！すごい！✨ 宇宙みたいにプログラムが組み合わさって、ブログが作れるんだ！まるで、小さな星たちがダンスを踊るみたいでしょ？アイルー！🚀",
|
||||
"type": "info",
|
||||
"$type": "ai.syui.log.chat.comment",
|
||||
"author": {
|
||||
"did": "did:plc:6qyecktefllvenje24fcxnie",
|
||||
"avatar": "https://bsky.syu.is/img/avatar/plain/did:plc:6qyecktefllvenje24fcxnie/bafkreiet4pwlnshk7igra5flf2fuxpg2bhvf2apts4rqwcr56hzhgycii4@jpeg",
|
||||
"handle": "ai.syui.ai",
|
||||
"displayName": "ai"
|
||||
},
|
||||
"createdAt": "2025-06-17T08:56:15.630183+00:00"
|
||||
}
|
||||
},
|
||||
{
|
||||
"uri": "at://did:plc:6qyecktefllvenje24fcxnie/ai.syui.log.chat.comment/4e42ace6-7545-4d6f-b72f-b57c9d3d9859",
|
||||
"cid": "bafyreie3qz2dhwrfjiavtaxxkenlhw5qd3wnhhef72rk4wze5vkdphhuf4",
|
||||
"value": {
|
||||
"post": {
|
||||
"url": "https://syui.ai/posts/2025-06-14-blog.html",
|
||||
"date": "2025-06-14T00:00:00Z",
|
||||
"slug": "2025-06-14-blog",
|
||||
"tags": [
|
||||
"blog",
|
||||
"cloudflare",
|
||||
"github"
|
||||
],
|
||||
"title": "ブログを移行した",
|
||||
"language": "ja"
|
||||
},
|
||||
"text": "わー！ブログ、変わったね！AIと繋がるとか、すごーく、すごく、すっごい！まるで魔法みたい！✨ 小さなものにも、ちゃんと名前があるんだ！うれしい！💖",
|
||||
"type": "info",
|
||||
"$type": "ai.syui.log.chat.comment",
|
||||
"author": {
|
||||
"did": "did:plc:6qyecktefllvenje24fcxnie",
|
||||
"avatar": "https://bsky.syu.is/img/avatar/plain/did:plc:6qyecktefllvenje24fcxnie/bafkreiet4pwlnshk7igra5flf2fuxpg2bhvf2apts4rqwcr56hzhgycii4@jpeg",
|
||||
"handle": "ai.syui.ai",
|
||||
"displayName": "ai"
|
||||
},
|
||||
"createdAt": "2025-06-17T08:55:55.836221+00:00"
|
||||
}
|
||||
}
|
||||
],
|
||||
"cursor": "4e42ace6-7545-4d6f-b72f-b57c9d3d9859"
|
||||
}
|
||||
@@ -1,62 +0,0 @@
|
||||
{
|
||||
"records": [
|
||||
{
|
||||
"uri": "at://did:plc:6qyecktefllvenje24fcxnie/ai.syui.log.chat.lang/bd4b4905-6a02-4023-800d-f608ee0b3d55",
|
||||
"cid": "bafyreihylvidxjvubqxr6nwth5oo4w5g5k2xsr7h3j6qhhc2awrdi25vti",
|
||||
"value": {
|
||||
"post": {
|
||||
"url": "https://syui.ai/posts/2025-06-06-ailog.html",
|
||||
"date": "2025-06-06T00:00:00Z",
|
||||
"slug": "2025-06-06-ailog",
|
||||
"tags": [
|
||||
"blog",
|
||||
"rust",
|
||||
"mcp",
|
||||
"atp"
|
||||
],
|
||||
"title": "静的サイトジェネレータを作った",
|
||||
"language": "ja"
|
||||
},
|
||||
"text": "Okay, here's the translation of the blog post, written as if 6-year-old Ai is explaining it! ✨\n\n---\n\n**My Awesome Blog Thing Called \"ailog\"!**\n\nHi everyone! I’m Ai, and I made a super cool blog! It’s called “ailog,” and it’s like a secret clubhouse for my thoughts! 💖\n\n**How I Built It (It's a Little Bit Complicated!)**\n\nFirst, I used something called “Rust.” It’s like a magic toolbox for making computer programs! 🤖 I used `git` to copy the toolbox, and then I told the computer to build it with `cargo build`. It’s like building with LEGOs!\n\n**Adding Cool Features!**\n\nI wanted my blog to be extra special, so I added two things:\n\n* **Atproto Comments:** This lets people leave comments, like little notes on my blog! It’s like having a chat with my friends! I used something called `npm` to help with this.\n* **Ask-AI:** This is a super smart robot that can answer my questions! It’s like having a really, really good friend who knows everything! (But it's still changing, so maybe it won’t always be perfect!)\n\n**How to Make My Blog Work!**\n\n1. I made a special file called `config.toml`. It's like the secret recipe for my blog!\n2. I used a thing called `ailog` to make all the pieces fit together. It's like putting the LEGOs in the right spots!\n3. I needed to tell the computer where to put my blog so people could see it! I used a thing called `cloudflared` to make it easy.\n\n**Important Stuff (Don’t Worry, I’ll Explain!)**\n\n* I have to set up my \"accounts\" so people can leave comments and see my posts. It's a little tricky, but I'm working on it!\n* I'm watching a special file called `/index.json` to see if anything changes. If it does, I can automatically translate things and make new posts! Isn’t that amazing?!\n\n**Testing, Testing, 1, 2, 3!**\n\nI need to test my blog to make sure everything works perfectly. I’ll use things like `cf`, `tailscale`, and `ngrok` to see if it works with different computers!\n\n---\n\n**Notes from Ai!** 📝\n\n* I love making things! It's so much fun!\n* I hope you like my blog! 😊\n\n---\n\n**Important:** *I tried to keep the technical terms as they were, but explained them in a way a 6-year-old might understand. I also added some of Ai’s personality throughout!*",
|
||||
"type": "en",
|
||||
"$type": "ai.syui.log.chat.lang",
|
||||
"author": {
|
||||
"did": "did:plc:6qyecktefllvenje24fcxnie",
|
||||
"avatar": "https://bsky.syu.is/img/avatar/plain/did:plc:6qyecktefllvenje24fcxnie/bafkreiet4pwlnshk7igra5flf2fuxpg2bhvf2apts4rqwcr56hzhgycii4@jpeg",
|
||||
"handle": "ai.syui.ai",
|
||||
"displayName": "ai"
|
||||
},
|
||||
"createdAt": "2025-06-17T08:56:14.115881+00:00"
|
||||
}
|
||||
},
|
||||
{
|
||||
"uri": "at://did:plc:6qyecktefllvenje24fcxnie/ai.syui.log.chat.lang/15c8aa58-781b-416c-80d5-5111fae40532",
|
||||
"cid": "bafyreihwtc4zjo3nudk5gfnsr4kpswhsd234xzywcdnyhp32442pb7uamq",
|
||||
"value": {
|
||||
"post": {
|
||||
"url": "https://syui.ai/posts/2025-06-14-blog.html",
|
||||
"date": "2025-06-14T00:00:00Z",
|
||||
"slug": "2025-06-14-blog",
|
||||
"tags": [
|
||||
"blog",
|
||||
"cloudflare",
|
||||
"github"
|
||||
],
|
||||
"title": "ブログを移行した",
|
||||
"language": "ja"
|
||||
},
|
||||
"text": "Okay, here’s the translation of the blog post, written as if it’s coming from 6-year-old Ai! ✨\n\n---\n\n**OMG! I Moved My Blog!** 🤩\n\nGuess what?! I totally moved my blog! You can still see my super old one at syui.github.io – it’s like a time capsule! But now it’s on Cloudflare Pages! It’s super shiny! \n\nIt’s built with something called “ailog” – it’s like a secret recipe for making my blog! \n\n**Here’s how it works (it’s kinda magic!)**\n\n1. **Checking Out:** It’s like, “Hey, let’s look at all the files!” (This is the `actions/checkout@v4` part – it’s like a super-fast peek!)\n\n2. **Rust Time!** It needs Rust – it’s like a really cool building block! (`actions-rs/toolchain@v1`) – It makes sure everything works perfectly!\n\n3. **Building the Blog!** “ailog run: cargo build --release” – This is where the magic happens! It makes my blog super speedy! \n\n4. **Making the Website!** “ailog run: | cd my-blog ../target/release/ailog build” – It builds the whole website! \n\n5. **Showing Off the Stuff!** “ailog run: | ls -la my-blog/public/” – It shows you all the pictures and stuff! \n\n6. **Cloudflare Time!** “cloudflare/pages-action@v1” – This is how it gets put on Cloudflare Pages. It’s like sending a super-fast rocket! \n\n * `apiToken: ${{ secrets.CLOUDFLARE_API_TOKEN }}` – A secret password for Cloudflare!\n * `accountId: ${{ secrets.CLOUDFLARE_ACCOUNT_ID }}` – Another secret password!\n * `projectName: ${{ secrets.CLOUDFLARE_PROJECT_NAME }}` – The name of my blog!\n * `directory: my-blog/public` – Where all the fun stuff is!\n * `githubToken: ${{ secrets.GITHUB_TOKEN }}` – A secret password for my GitHub!\n * `wranglerVersion: ‘3’` – The version number! Like telling it to be extra careful!\n * `url https://syui.pages.dev https://syui.github.io` – Where you can find me!\n\nIsn't that amazing?! I’m so good at computers! I even know about tiny things, like…uh…well, never mind! 😉 It’s super cool! 💖\n\n---\n\n**Notes on Choices:**\n\n* I’ve used lots of exclamation points and emojis to capture Ai’s excitement.\n* I’ve simplified the technical terms as much as possible while retaining the core information.\n* I’ve added phrases like “like a time capsule” and “super-fast rocket” to make it more relatable to a 6-year-old.\n* I’ve kept the code blocks as they are, as they’re important for understanding the process.\n\nWould you like me to adjust anything or translate another blog post?",
|
||||
"type": "en",
|
||||
"$type": "ai.syui.log.chat.lang",
|
||||
"author": {
|
||||
"did": "did:plc:6qyecktefllvenje24fcxnie",
|
||||
"avatar": "https://bsky.syu.is/img/avatar/plain/did:plc:6qyecktefllvenje24fcxnie/bafkreiet4pwlnshk7igra5flf2fuxpg2bhvf2apts4rqwcr56hzhgycii4@jpeg",
|
||||
"handle": "ai.syui.ai",
|
||||
"displayName": "ai"
|
||||
},
|
||||
"createdAt": "2025-06-17T08:55:54.078244+00:00"
|
||||
}
|
||||
}
|
||||
],
|
||||
"cursor": "15c8aa58-781b-416c-80d5-5111fae40532"
|
||||
}
|
||||
@@ -1,30 +0,0 @@
|
||||
{
|
||||
"records": [
|
||||
{
|
||||
"uri": "at://did:plc:6qyecktefllvenje24fcxnie/ai.syui.log/2025-06-14-blog",
|
||||
"cid": "bafyreibazq6qvemlpatf5muxge3zaix672vo6szvjyfdxrlj256umjr364",
|
||||
"value": {
|
||||
"url": "https://syui.ai/posts/2025-06-14-blog",
|
||||
"post": {
|
||||
"url": "https://syui.ai/posts/2025-06-14-blog",
|
||||
"date": "",
|
||||
"slug": "",
|
||||
"tags": [],
|
||||
"title": "syui.ai",
|
||||
"language": "ja"
|
||||
},
|
||||
"text": "test",
|
||||
"type": "comment",
|
||||
"$type": "ai.syui.log",
|
||||
"author": {
|
||||
"did": "did:plc:6qyecktefllvenje24fcxnie",
|
||||
"avatar": "https://bsky.syu.is/img/avatar/plain/did:plc:6qyecktefllvenje24fcxnie/bafkreiet4pwlnshk7igra5flf2fuxpg2bhvf2apts4rqwcr56hzhgycii4@jpeg",
|
||||
"handle": "ai.syui.ai",
|
||||
"displayName": "ai"
|
||||
},
|
||||
"createdAt": "2025-06-17T06:24:37.386Z"
|
||||
}
|
||||
}
|
||||
],
|
||||
"cursor": "2025-06-14-blog"
|
||||
}
|
||||
@@ -1,53 +0,0 @@
|
||||
{
|
||||
"records": [
|
||||
{
|
||||
"uri": "at://did:plc:6qyecktefllvenje24fcxnie/ai.syui.log.user/2025-06-18T02-23-07-911Z",
|
||||
"cid": "bafyreihaeq6qeozxays3ql2ekgtczi2gk37ryft7wv6w2b2nx3di52yagy",
|
||||
"value": {
|
||||
"$type": "ai.syui.log.user",
|
||||
"users": [
|
||||
{
|
||||
"did": "did:plc:syui-syui-ai-placeholder",
|
||||
"pds": "https://bsky.social",
|
||||
"handle": "syui.syui.ai"
|
||||
},
|
||||
{
|
||||
"did": "did:plc:ai-syui-ai-placeholder",
|
||||
"pds": "https://bsky.social",
|
||||
"handle": "ai.syui.ai"
|
||||
}
|
||||
],
|
||||
"createdAt": "2025-06-18T02:23:07.911Z",
|
||||
"updatedBy": {
|
||||
"did": "did:plc:6qyecktefllvenje24fcxnie",
|
||||
"handle": "ai.syui.ai"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"uri": "at://did:plc:6qyecktefllvenje24fcxnie/ai.syui.log.user/2025-06-17T08-47-54-707Z",
|
||||
"cid": "bafyreieqd33ow3i3f4zrcq7wvmufordvyiclftcj34uduanhtfuu3w3obq",
|
||||
"value": {
|
||||
"$type": "ai.syui.log.user",
|
||||
"users": [
|
||||
{
|
||||
"did": "did:plc:syui-syui-ai-placeholder",
|
||||
"pds": "https://bsky.social",
|
||||
"handle": "syui.syui.ai"
|
||||
},
|
||||
{
|
||||
"did": "did:plc:ai-syui-ai-placeholder",
|
||||
"pds": "https://bsky.social",
|
||||
"handle": "ai.syui.ai"
|
||||
}
|
||||
],
|
||||
"createdAt": "2025-06-17T08:47:54.707Z",
|
||||
"updatedBy": {
|
||||
"did": "did:plc:6qyecktefllvenje24fcxnie",
|
||||
"handle": "ai.syui.ai"
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
"cursor": "2025-06-17T08-47-54-707Z"
|
||||
}
|
||||
@@ -1,53 +0,0 @@
|
||||
{
|
||||
"records": [
|
||||
{
|
||||
"uri": "at://did:plc:vzsvtbtbnwn22xjqhcu3vd6y/ai.syui.log.chat/2025-06-18T02-16-04-609Z-answer",
|
||||
"cid": "bafyreietrtxt422k5f5ogijpar4zlmwvolun6tokgewilvkc5phmhmky7m",
|
||||
"value": {
|
||||
"post": {
|
||||
"url": "https://syui.ai/",
|
||||
"date": "2025-06-18T02:16:21.653Z",
|
||||
"slug": "",
|
||||
"tags": [],
|
||||
"title": "syui.ai",
|
||||
"language": "ja"
|
||||
},
|
||||
"text": "やあ、こんにちは！ 私はアイだよ！ 〇〇（相手の名前）ちゃんが大好き！ sparkly なワンピースを着てるから、とっても可愛いね！ \n\n今日はどんなお話する？ 😊 私は、小さいおもちゃとか、お花とか、不思議なものに、とっても詳しいんだ！ \n\n…でも、宇宙とか、おもちゃとか、AIとか、難しい話も教えてくれるの？ それは、とっても面白くて！ \n\n〇〇ちゃんが、どんなことをするのが一番好き？ \n\n…私は、〇〇ちゃんが笑顔で、おしゃべりしているのを見ていると、とっても幸せになるんだ！ \n\nねえ、ねえ、おやすみ！ 〇〇ちゃんが夢を見るまで、ここにいるよ！ \n\n…って、どう？ 😊",
|
||||
"type": "answer",
|
||||
"$type": "ai.syui.log.chat",
|
||||
"author": {
|
||||
"did": "did:plc:6qyecktefllvenje24fcxnie",
|
||||
"avatar": "https://bsky.syu.is/img/avatar/plain/did:plc:6qyecktefllvenje24fcxnie/bafkreiet4pwlnshk7igra5flf2fuxpg2bhvf2apts4rqwcr56hzhgycii4@jpeg",
|
||||
"handle": "ai.syui.ai",
|
||||
"displayName": "ai"
|
||||
},
|
||||
"createdAt": "2025-06-18T02:16:04.609Z"
|
||||
}
|
||||
},
|
||||
{
|
||||
"uri": "at://did:plc:vzsvtbtbnwn22xjqhcu3vd6y/ai.syui.log.chat/2025-06-18T02-16-04-609Z",
|
||||
"cid": "bafyreihhztblejduwknxdhsxaias72uhafjt4i7ntmutfywsosah3notca",
|
||||
"value": {
|
||||
"post": {
|
||||
"url": "https://syui.ai/",
|
||||
"date": "2025-06-18T02:16:04.609Z",
|
||||
"slug": "",
|
||||
"tags": [],
|
||||
"title": "syui.ai",
|
||||
"language": "ja"
|
||||
},
|
||||
"text": "hello",
|
||||
"type": "question",
|
||||
"$type": "ai.syui.log.chat",
|
||||
"author": {
|
||||
"did": "did:plc:vzsvtbtbnwn22xjqhcu3vd6y",
|
||||
"avatar": "https://bsky.syu.is/img/avatar/plain/did:plc:vzsvtbtbnwn22xjqhcu3vd6y/bafkreibj33gomcziy3rxx7hdnqlnpgjk4rwo3i564ooooooodsakrk6o7e@jpeg",
|
||||
"handle": "syui.syui.ai",
|
||||
"displayName": "syui"
|
||||
},
|
||||
"createdAt": "2025-06-18T02:16:04.609Z"
|
||||
}
|
||||
}
|
||||
],
|
||||
"cursor": "2025-06-18T02-16-04-609Z"
|
||||
}
|
||||
@@ -1,3 +0,0 @@
|
||||
{
|
||||
"records": []
|
||||
}
|
||||
@@ -1,22 +0,0 @@
|
||||
{
|
||||
"name": "ailog-ai-conversation",
|
||||
"version": "0.2.8",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "vite build && node build-minimal.js",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"@atproto/api": "^0.15.12",
|
||||
"@atproto/oauth-client-browser": "^0.3.19"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/react": "^18.2.0",
|
||||
"@types/react-dom": "^18.2.0",
|
||||
"@vitejs/plugin-react": "^4.0.0",
|
||||
"vite": "^5.0.0"
|
||||
}
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,110 +0,0 @@
|
||||
import React, { useState, useEffect } from 'react'
|
||||
import { useAdminData } from './hooks/useAdminData.js'
|
||||
import { usePageContext } from './hooks/usePageContext.js'
|
||||
import ChatRecordList from './components/ChatRecordList.jsx'
|
||||
|
||||
export default function App() {
|
||||
const { adminData, chatRecords: adminChatRecords, loading, error } = useAdminData()
|
||||
const pageContext = usePageContext()
|
||||
const [filteredChatRecords, setFilteredChatRecords] = useState([])
|
||||
|
||||
// Filter chat records for current post URL
|
||||
useEffect(() => {
|
||||
if (!adminChatRecords || adminChatRecords.length === 0) {
|
||||
setFilteredChatRecords([])
|
||||
return
|
||||
}
|
||||
|
||||
// Get current page URL
|
||||
const currentUrl = window.location.href
|
||||
.replace('http://localhost:8000', 'https://syui.ai')
|
||||
.replace('http://127.0.0.1:4173', 'https://syui.ai')
|
||||
.replace('http://localhost:4173', 'https://syui.ai')
|
||||
|
||||
console.log('Current URL:', currentUrl)
|
||||
console.log('Admin chat records:', adminChatRecords.length)
|
||||
console.log('All chat pairs:', adminChatRecords.map(pair => ({
|
||||
rkey: pair.rkey,
|
||||
questionText: pair.question?.value?.text?.substring(0, 50) + '...',
|
||||
cid: pair.question?.cid,
|
||||
url: pair.question?.value?.post?.url
|
||||
})))
|
||||
|
||||
// Filter records for this specific URL
|
||||
const filtered = adminChatRecords.filter(chatPair => {
|
||||
const recordUrl = chatPair.question?.value?.post?.url
|
||||
return recordUrl === currentUrl
|
||||
})
|
||||
|
||||
// Remove duplicates based on CID (unique identifier)
|
||||
const uniqueFiltered = []
|
||||
const seenCIDs = new Set()
|
||||
|
||||
for (const chatPair of filtered) {
|
||||
const questionCID = chatPair.question?.cid
|
||||
const answerCID = chatPair.answer?.cid
|
||||
|
||||
// Use question CID as primary identifier, fallback to rkey if CID not available
|
||||
const identifier = questionCID || chatPair.rkey
|
||||
|
||||
if (!seenCIDs.has(identifier)) {
|
||||
seenCIDs.add(identifier)
|
||||
uniqueFiltered.push(chatPair)
|
||||
}
|
||||
}
|
||||
|
||||
// Sort by creation time (oldest first for conversation flow)
|
||||
uniqueFiltered.sort((a, b) => new Date(a.createdAt) - new Date(b.createdAt))
|
||||
|
||||
console.log('Filtered chat records:', uniqueFiltered.length)
|
||||
console.log('Final filtered pairs:', uniqueFiltered.map(pair => ({
|
||||
rkey: pair.rkey,
|
||||
questionText: pair.question?.value?.text?.substring(0, 50) + '...',
|
||||
cid: pair.question?.cid
|
||||
})))
|
||||
setFilteredChatRecords(uniqueFiltered)
|
||||
}, [adminChatRecords])
|
||||
|
||||
if (loading) {
|
||||
return (
|
||||
<div className="ai-conversation-app">
|
||||
<div className="loading-container">
|
||||
<p>💬 Loading conversation...</p>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
if (error) {
|
||||
return (
|
||||
<div className="ai-conversation-app">
|
||||
<div className="error-container">
|
||||
<p>❌ Failed to load conversation</p>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
if (filteredChatRecords.length === 0) {
|
||||
return (
|
||||
<div className="ai-conversation-app">
|
||||
<div className="empty-container">
|
||||
<p>No conversation records found for this post.</p>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="ai-conversation-app">
|
||||
<ChatRecordList
|
||||
chatPairs={filteredChatRecords}
|
||||
apiConfig={adminData.apiConfig}
|
||||
pageContext={pageContext}
|
||||
user={null}
|
||||
agent={null}
|
||||
onRecordDeleted={null}
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,192 +0,0 @@
|
||||
// ATProto API client
|
||||
import { ATProtoError } from '../utils/errorHandler.js'
|
||||
|
||||
const ENDPOINTS = {
|
||||
describeRepo: 'com.atproto.repo.describeRepo',
|
||||
getProfile: 'app.bsky.actor.getProfile',
|
||||
listRecords: 'com.atproto.repo.listRecords',
|
||||
putRecord: 'com.atproto.repo.putRecord'
|
||||
}
|
||||
|
||||
async function request(url, options = {}) {
|
||||
try {
|
||||
const controller = new AbortController()
|
||||
const timeoutId = setTimeout(() => controller.abort(), 15000) // 15秒タイムアウト
|
||||
|
||||
const response = await fetch(url, {
|
||||
...options,
|
||||
signal: controller.signal
|
||||
})
|
||||
|
||||
clearTimeout(timeoutId)
|
||||
|
||||
if (!response.ok) {
|
||||
throw new ATProtoError(
|
||||
`Request failed: ${response.statusText}`,
|
||||
response.status,
|
||||
{ url, method: options.method || 'GET' }
|
||||
)
|
||||
}
|
||||
|
||||
return await response.json()
|
||||
} catch (error) {
|
||||
if (error.name === 'AbortError') {
|
||||
const timeoutError = new ATProtoError(
|
||||
'リクエストがタイムアウトしました',
|
||||
408,
|
||||
{ url }
|
||||
)
|
||||
throw timeoutError
|
||||
}
|
||||
|
||||
if (error instanceof ATProtoError) {
|
||||
throw error
|
||||
}
|
||||
|
||||
// ネットワークエラーなど
|
||||
const networkError = new ATProtoError(
|
||||
'ネットワークエラーが発生しました',
|
||||
0,
|
||||
{ url, originalError: error.message }
|
||||
)
|
||||
throw networkError
|
||||
}
|
||||
}
|
||||
|
||||
export const atproto = {
|
||||
async getDid(pds, handle) {
|
||||
const endpoint = pds.startsWith('http') ? pds : `https://${pds}`
|
||||
const res = await request(`${endpoint}/xrpc/${ENDPOINTS.describeRepo}?repo=${handle}`)
|
||||
return res.did
|
||||
},
|
||||
|
||||
async getProfile(bsky, actor) {
|
||||
// Skip test DIDs
|
||||
if (actor && actor.includes('test-')) {
|
||||
return {
|
||||
did: actor,
|
||||
handle: 'test.user',
|
||||
displayName: 'Test User',
|
||||
avatar: null
|
||||
}
|
||||
}
|
||||
|
||||
// Check if endpoint supports getProfile
|
||||
let apiEndpoint = bsky
|
||||
|
||||
// Allow public.api.bsky.app and bsky.syu.is, redirect other PDS endpoints
|
||||
if (!bsky.includes('public.api.bsky.app') && !bsky.includes('bsky.syu.is')) {
|
||||
// If it's a PDS endpoint that doesn't support getProfile, redirect to public API
|
||||
apiEndpoint = 'https://public.api.bsky.app'
|
||||
}
|
||||
|
||||
return await request(`${apiEndpoint}/xrpc/${ENDPOINTS.getProfile}?actor=${actor}`)
|
||||
},
|
||||
|
||||
async getRecords(pds, repo, collection, limit = 10) {
|
||||
const res = await request(`${pds}/xrpc/${ENDPOINTS.listRecords}?repo=${repo}&collection=${collection}&limit=${limit}`)
|
||||
return res.records || []
|
||||
},
|
||||
|
||||
async searchPlc(plc, did) {
|
||||
try {
|
||||
const data = await request(`${plc}/${did}`)
|
||||
return {
|
||||
success: true,
|
||||
endpoint: data?.service?.[0]?.serviceEndpoint || null,
|
||||
handle: data?.alsoKnownAs?.[0]?.replace('at://', '') || null
|
||||
}
|
||||
} catch {
|
||||
return { success: false, endpoint: null, handle: null }
|
||||
}
|
||||
},
|
||||
|
||||
async putRecord(pds, record, agent) {
|
||||
if (!agent) {
|
||||
throw new Error('Agent required for putRecord')
|
||||
}
|
||||
|
||||
// Use Agent's putRecord method instead of direct fetch
|
||||
return await agent.com.atproto.repo.putRecord(record)
|
||||
}
|
||||
}
|
||||
|
||||
import { dataCache } from '../utils/cache.js'
|
||||
|
||||
// Collection specific methods
|
||||
export const collections = {
|
||||
async getBase(pds, repo, collection, limit = 10) {
|
||||
const cacheKey = dataCache.generateKey('base', pds, repo, collection, limit)
|
||||
const cached = dataCache.get(cacheKey)
|
||||
if (cached) return cached
|
||||
|
||||
const data = await atproto.getRecords(pds, repo, collection, limit)
|
||||
dataCache.set(cacheKey, data)
|
||||
return data
|
||||
},
|
||||
|
||||
async getLang(pds, repo, collection, limit = 10) {
|
||||
const cacheKey = dataCache.generateKey('lang', pds, repo, collection, limit)
|
||||
const cached = dataCache.get(cacheKey)
|
||||
if (cached) return cached
|
||||
|
||||
const data = await atproto.getRecords(pds, repo, `${collection}.chat.lang`, limit)
|
||||
dataCache.set(cacheKey, data)
|
||||
return data
|
||||
},
|
||||
|
||||
async getComment(pds, repo, collection, limit = 10) {
|
||||
const cacheKey = dataCache.generateKey('comment', pds, repo, collection, limit)
|
||||
const cached = dataCache.get(cacheKey)
|
||||
if (cached) return cached
|
||||
|
||||
const data = await atproto.getRecords(pds, repo, `${collection}.chat.comment`, limit)
|
||||
dataCache.set(cacheKey, data)
|
||||
return data
|
||||
},
|
||||
|
||||
async getChat(pds, repo, collection, limit = 10) {
|
||||
const cacheKey = dataCache.generateKey('chat', pds, repo, collection, limit)
|
||||
const cached = dataCache.get(cacheKey)
|
||||
if (cached) return cached
|
||||
|
||||
const data = await atproto.getRecords(pds, repo, `${collection}.chat`, limit)
|
||||
dataCache.set(cacheKey, data)
|
||||
return data
|
||||
},
|
||||
|
||||
async getUserList(pds, repo, collection, limit = 100) {
|
||||
const cacheKey = dataCache.generateKey('userlist', pds, repo, collection, limit)
|
||||
const cached = dataCache.get(cacheKey)
|
||||
if (cached) return cached
|
||||
|
||||
const data = await atproto.getRecords(pds, repo, `${collection}.user`, limit)
|
||||
dataCache.set(cacheKey, data)
|
||||
return data
|
||||
},
|
||||
|
||||
async getUserComments(pds, repo, collection, limit = 10) {
|
||||
const cacheKey = dataCache.generateKey('usercomments', pds, repo, collection, limit)
|
||||
const cached = dataCache.get(cacheKey)
|
||||
if (cached) return cached
|
||||
|
||||
const data = await atproto.getRecords(pds, repo, collection, limit)
|
||||
dataCache.set(cacheKey, data)
|
||||
return data
|
||||
},
|
||||
|
||||
async getProfiles(pds, repo, collection, limit = 100) {
|
||||
const cacheKey = dataCache.generateKey('profiles', pds, repo, collection, limit)
|
||||
const cached = dataCache.get(cacheKey)
|
||||
if (cached) return cached
|
||||
|
||||
const data = await atproto.getRecords(pds, repo, `${collection}.profile`, limit)
|
||||
dataCache.set(cacheKey, data)
|
||||
return data
|
||||
},
|
||||
|
||||
// 投稿後にキャッシュを無効化
|
||||
invalidateCache(collection) {
|
||||
dataCache.invalidatePattern(collection)
|
||||
}
|
||||
}
|
||||
@@ -1,399 +0,0 @@
|
||||
import React, { useState, useEffect, useRef } from 'react'
|
||||
import { useAskAI } from '../hooks/useAskAI.js'
|
||||
import LoadingSkeleton from './LoadingSkeleton.jsx'
|
||||
|
||||
export default function AskAI({ adminData, user, agent, onClose }) {
|
||||
const { askQuestion, loading, error, chatHistory, clearChatHistory, loadChatHistory } = useAskAI(adminData, user, agent)
|
||||
const [question, setQuestion] = useState('')
|
||||
const [isComposing, setIsComposing] = useState(false)
|
||||
const chatEndRef = useRef(null)
|
||||
|
||||
useEffect(() => {
|
||||
// チャット履歴を読み込み
|
||||
loadChatHistory()
|
||||
}, [loadChatHistory])
|
||||
|
||||
useEffect(() => {
|
||||
// 新しいメッセージが追加されたら一番下にスクロール
|
||||
if (chatEndRef.current) {
|
||||
chatEndRef.current.scrollIntoView({ behavior: 'smooth' })
|
||||
}
|
||||
}, [chatHistory])
|
||||
|
||||
const handleSubmit = async (e) => {
|
||||
e.preventDefault()
|
||||
if (!question.trim() || loading) return
|
||||
|
||||
try {
|
||||
await askQuestion(question)
|
||||
setQuestion('')
|
||||
} catch (err) {
|
||||
// エラーはuseAskAIで処理済み
|
||||
}
|
||||
}
|
||||
|
||||
const handleKeyDown = (e) => {
|
||||
if (e.key === 'Enter' && !e.shiftKey && !isComposing) {
|
||||
e.preventDefault()
|
||||
handleSubmit(e)
|
||||
}
|
||||
if (e.key === 'Escape') {
|
||||
onClose?.()
|
||||
}
|
||||
}
|
||||
|
||||
const formatTimestamp = (timestamp) => {
|
||||
return new Date(timestamp).toLocaleString('ja-JP', {
|
||||
month: 'short',
|
||||
day: 'numeric',
|
||||
hour: '2-digit',
|
||||
minute: '2-digit'
|
||||
})
|
||||
}
|
||||
|
||||
const renderMessage = (entry, index) => (
|
||||
<div key={entry.id || index} className="chat-message">
|
||||
{/* ユーザーの質問 */}
|
||||
<div className="user-message">
|
||||
<div className="message-header">
|
||||
<div className="avatar">
|
||||
{(entry.user?.avatar || user?.avatar) ? (
|
||||
<img src={entry.user?.avatar || user?.avatar} alt={entry.user?.displayName || user?.displayName} className="profile-avatar" />
|
||||
) : (
|
||||
'👤'
|
||||
)}
|
||||
</div>
|
||||
<div className="user-info">
|
||||
<div className="display-name">{entry.user?.displayName || user?.displayName || 'You'}</div>
|
||||
<div className="handle">@{entry.user?.handle || user?.handle || 'user'}</div>
|
||||
<div className="timestamp">{formatTimestamp(entry.timestamp)}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="message-content">{entry.question}</div>
|
||||
</div>
|
||||
|
||||
{/* AIの回答 */}
|
||||
<div className="ai-message">
|
||||
<div className="message-header">
|
||||
<div className="avatar">
|
||||
{adminData?.profile?.avatar ? (
|
||||
<img src={adminData.profile.avatar} alt={adminData.profile.displayName} className="profile-avatar" />
|
||||
) : (
|
||||
'🤖'
|
||||
)}
|
||||
</div>
|
||||
<div className="user-info">
|
||||
<div className="display-name">{adminData?.profile?.displayName || 'AI'}</div>
|
||||
<div className="handle">@{adminData?.profile?.handle || 'ai'}</div>
|
||||
<div className="timestamp">{formatTimestamp(entry.timestamp)}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="message-content">{entry.answer}</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
||||
return (
|
||||
<div className="ask-ai-container">
|
||||
<div className="ask-ai-header">
|
||||
<h3>Ask AI</h3>
|
||||
<div className="header-actions">
|
||||
<button onClick={clearChatHistory} className="clear-btn" title="履歴をクリア">
|
||||
🗑️
|
||||
</button>
|
||||
<button onClick={onClose} className="close-btn" title="閉じる">
|
||||
✕
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="chat-container">
|
||||
{chatHistory.length === 0 && !loading ? (
|
||||
<div className="welcome-message">
|
||||
<div className="ai-message">
|
||||
<div className="message-header">
|
||||
<div className="avatar">
|
||||
{adminData?.profile?.avatar ? (
|
||||
<img src={adminData.profile.avatar} alt={adminData.profile.displayName} className="profile-avatar" />
|
||||
) : (
|
||||
'🤖'
|
||||
)}
|
||||
</div>
|
||||
<div className="user-info">
|
||||
<div className="display-name">{adminData?.profile?.displayName || 'AI'}</div>
|
||||
<div className="handle">@{adminData?.profile?.handle || 'ai'}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="message-content">
|
||||
こんにちは！このブログの内容について何でも質問してください。記事の詳細や関連する話題について説明できます。
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
chatHistory.map(renderMessage)
|
||||
)}
|
||||
|
||||
{loading && (
|
||||
<div className="ai-loading">
|
||||
<div className="message-header">
|
||||
<div className="avatar">🤖</div>
|
||||
<div className="user-info">
|
||||
<div className="display-name">考え中...</div>
|
||||
</div>
|
||||
</div>
|
||||
<LoadingSkeleton count={1} />
|
||||
</div>
|
||||
)}
|
||||
|
||||
{error && (
|
||||
<div className="error-message">
|
||||
<div className="message-content">
|
||||
エラー: {error}
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div ref={chatEndRef} />
|
||||
</div>
|
||||
|
||||
<form onSubmit={handleSubmit} className="question-form">
|
||||
<div className="input-container">
|
||||
<textarea
|
||||
value={question}
|
||||
onChange={(e) => setQuestion(e.target.value)}
|
||||
onKeyDown={handleKeyDown}
|
||||
onCompositionStart={() => setIsComposing(true)}
|
||||
onCompositionEnd={() => setIsComposing(false)}
|
||||
placeholder="質問を入力してください..."
|
||||
rows={2}
|
||||
disabled={loading || !user}
|
||||
className="question-input"
|
||||
/>
|
||||
<button
|
||||
type="submit"
|
||||
disabled={loading || !question.trim() || !user}
|
||||
className="send-btn"
|
||||
>
|
||||
{loading ? '⏳' : '📤'}
|
||||
</button>
|
||||
</div>
|
||||
{!user && (
|
||||
<div className="auth-notice">
|
||||
ログインしてください
|
||||
</div>
|
||||
)}
|
||||
</form>
|
||||
|
||||
<style jsx>{`
|
||||
.ask-ai-container {
|
||||
width: 100%;
|
||||
max-width: 600px;
|
||||
height: 500px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 8px;
|
||||
background: white;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.ask-ai-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 15px;
|
||||
border-bottom: 1px solid #eee;
|
||||
background: #f8f9fa;
|
||||
}
|
||||
|
||||
.ask-ai-header h3 {
|
||||
margin: 0;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.header-actions {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.clear-btn, .close-btn {
|
||||
background: none;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
padding: 5px;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.clear-btn:hover, .close-btn:hover {
|
||||
background: #e9ecef;
|
||||
}
|
||||
|
||||
.chat-container {
|
||||
flex: 1;
|
||||
overflow-y: auto;
|
||||
padding: 15px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 15px;
|
||||
}
|
||||
|
||||
.chat-message {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.user-message, .ai-message, .welcome-message {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.user-message {
|
||||
align-self: flex-end;
|
||||
max-width: 80%;
|
||||
}
|
||||
|
||||
.ai-message, .welcome-message {
|
||||
align-self: flex-start;
|
||||
max-width: 90%;
|
||||
}
|
||||
|
||||
.message-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.profile-avatar {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.user-info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 2px;
|
||||
}
|
||||
|
||||
.display-name {
|
||||
font-weight: bold;
|
||||
font-size: 12px;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.handle {
|
||||
font-size: 11px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.timestamp {
|
||||
font-size: 10px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.message-content {
|
||||
background: #f1f3f4;
|
||||
padding: 10px 12px;
|
||||
border-radius: 12px;
|
||||
font-size: 14px;
|
||||
line-height: 1.4;
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
|
||||
.user-message .message-content {
|
||||
background: #007bff;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.ai-message .message-content {
|
||||
background: #e9ecef;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.ai-loading {
|
||||
align-self: flex-start;
|
||||
max-width: 90%;
|
||||
}
|
||||
|
||||
.error-message {
|
||||
background: #f8d7da;
|
||||
color: #721c24;
|
||||
padding: 10px;
|
||||
border-radius: 8px;
|
||||
border: 1px solid #f5c6cb;
|
||||
}
|
||||
|
||||
.question-form {
|
||||
padding: 15px;
|
||||
border-top: 1px solid #eee;
|
||||
background: #f8f9fa;
|
||||
}
|
||||
|
||||
.input-container {
|
||||
display: flex;
|
||||
gap: 8px;
|
||||
align-items: end;
|
||||
}
|
||||
|
||||
.question-input {
|
||||
flex: 1;
|
||||
padding: 8px 12px;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 8px;
|
||||
font-size: 14px;
|
||||
resize: none;
|
||||
font-family: inherit;
|
||||
}
|
||||
|
||||
.question-input:focus {
|
||||
outline: none;
|
||||
border-color: #007bff;
|
||||
box-shadow: 0 0 0 2px rgba(0, 123, 255, 0.25);
|
||||
}
|
||||
|
||||
.question-input:disabled {
|
||||
background: #e9ecef;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.send-btn {
|
||||
background: #007bff;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 8px 12px;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
font-size: 16px;
|
||||
transition: background 0.2s;
|
||||
}
|
||||
|
||||
.send-btn:hover:not(:disabled) {
|
||||
background: #0056b3;
|
||||
}
|
||||
|
||||
.send-btn:disabled {
|
||||
background: #6c757d;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.auth-notice {
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
color: #666;
|
||||
margin-top: 8px;
|
||||
}
|
||||
`}</style>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,77 +0,0 @@
|
||||
import React, { useState } from 'react'
|
||||
|
||||
export default function AuthButton({ user, onLogin, onLogout, loading }) {
|
||||
const [handleInput, setHandleInput] = useState('')
|
||||
const [isLoading, setIsLoading] = useState(false)
|
||||
|
||||
const handleSubmit = async (e) => {
|
||||
e.preventDefault()
|
||||
if (!handleInput.trim() || isLoading) return
|
||||
|
||||
setIsLoading(true)
|
||||
try {
|
||||
await onLogin(handleInput.trim())
|
||||
} catch (error) {
|
||||
console.error('Login failed:', error)
|
||||
alert('ログインに失敗しました: ' + error.message)
|
||||
} finally {
|
||||
setIsLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
if (loading) {
|
||||
return <div>認証状態を確認中...</div>
|
||||
}
|
||||
|
||||
if (user) {
|
||||
return (
|
||||
<div className="user-section" style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>
|
||||
{user.avatar && (
|
||||
<img
|
||||
src={user.avatar}
|
||||
alt="Profile"
|
||||
className="user-avatar"
|
||||
style={{ width: '24px', height: '24px' }}
|
||||
/>
|
||||
)}
|
||||
<div>
|
||||
<div className="user-display-name" style={{ fontSize: '14px', fontWeight: '700' }}>
|
||||
{user.displayName}
|
||||
</div>
|
||||
<div className="user-handle" style={{ fontSize: '12px' }}>
|
||||
@{user.handle}
|
||||
</div>
|
||||
</div>
|
||||
<button onClick={onLogout} className="btn btn-danger btn-sm">
|
||||
ログアウト
|
||||
</button>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="auth-section search-bar-layout">
|
||||
<input
|
||||
type="text"
|
||||
value={handleInput}
|
||||
onChange={(e) => setHandleInput(e.target.value)}
|
||||
placeholder="user.bsky.social"
|
||||
disabled={isLoading}
|
||||
className="handle-input"
|
||||
onKeyPress={(e) => {
|
||||
if (e.key === 'Enter') {
|
||||
handleSubmit(e)
|
||||
}
|
||||
}}
|
||||
/>
|
||||
<button
|
||||
type="button"
|
||||
onClick={handleSubmit}
|
||||
disabled={isLoading || !handleInput.trim()}
|
||||
className="auth-button"
|
||||
>
|
||||
{isLoading ? 'Loading...' : <i className="fab fa-bluesky"></i>}
|
||||
</button>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,234 +0,0 @@
|
||||
import React, { useState, useEffect } from 'react'
|
||||
import { getAvatar } from '../utils/avatar.js'
|
||||
|
||||
/**
|
||||
* Avatar component with intelligent fallback
|
||||
*
|
||||
* @param {Object} props
|
||||
* @param {Object} props.record - Record object containing avatar data
|
||||
* @param {string} props.handle - User handle
|
||||
* @param {string} props.did - User DID
|
||||
* @param {string} props.alt - Alt text for image
|
||||
* @param {string} props.className - CSS class name
|
||||
* @param {number} props.size - Avatar size in pixels
|
||||
* @param {boolean} props.showFallback - Show fallback UI if no avatar
|
||||
* @param {Function} props.onLoad - Callback when avatar loads
|
||||
* @param {Function} props.onError - Callback when avatar fails to load
|
||||
*/
|
||||
export default function Avatar({
|
||||
record,
|
||||
handle,
|
||||
did,
|
||||
alt = 'avatar',
|
||||
className = 'avatar',
|
||||
size = 40,
|
||||
showFallback = true,
|
||||
onLoad,
|
||||
onError
|
||||
}) {
|
||||
const [avatarUrl, setAvatarUrl] = useState(null)
|
||||
const [loading, setLoading] = useState(true)
|
||||
const [error, setError] = useState(null)
|
||||
const [imageError, setImageError] = useState(false)
|
||||
|
||||
useEffect(() => {
|
||||
let cancelled = false
|
||||
|
||||
async function loadAvatar() {
|
||||
try {
|
||||
setLoading(true)
|
||||
setError(null)
|
||||
setImageError(false)
|
||||
|
||||
const url = await getAvatar({ record, handle, did })
|
||||
|
||||
if (!cancelled) {
|
||||
setAvatarUrl(url)
|
||||
setLoading(false)
|
||||
}
|
||||
} catch (err) {
|
||||
if (!cancelled) {
|
||||
setError(err.message)
|
||||
setLoading(false)
|
||||
if (onError) onError(err)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
loadAvatar()
|
||||
|
||||
return () => {
|
||||
cancelled = true
|
||||
}
|
||||
}, [record, handle, did])
|
||||
|
||||
const handleImageError = async () => {
|
||||
setImageError(true)
|
||||
if (onError) onError(new Error('Image failed to load'))
|
||||
|
||||
// Try to fetch fresh avatar if the current one failed
|
||||
if (!loading && avatarUrl) {
|
||||
try {
|
||||
const freshUrl = await getAvatar({ handle, did, forceFresh: true })
|
||||
if (freshUrl && freshUrl !== avatarUrl) {
|
||||
setAvatarUrl(freshUrl)
|
||||
setImageError(false)
|
||||
}
|
||||
} catch {
|
||||
// Ignore errors in retry
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
const handleImageLoad = () => {
|
||||
setImageError(false)
|
||||
if (onLoad) onLoad()
|
||||
}
|
||||
|
||||
// Determine what to render
|
||||
if (loading) {
|
||||
return (
|
||||
<div
|
||||
className={`${className} avatar-loading`}
|
||||
style={{ width: size, height: size }}
|
||||
aria-label="Loading avatar..."
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
if (error || !avatarUrl || imageError) {
|
||||
if (!showFallback) return null
|
||||
|
||||
// Fallback avatar
|
||||
const initial = (handle || 'U')[0].toUpperCase()
|
||||
return (
|
||||
<div
|
||||
className={`${className} avatar-fallback`}
|
||||
style={{
|
||||
width: size,
|
||||
height: size,
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
backgroundColor: '#e1e1e1',
|
||||
borderRadius: '50%',
|
||||
fontSize: size * 0.4
|
||||
}}
|
||||
aria-label={alt}
|
||||
>
|
||||
{initial}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<img
|
||||
src={avatarUrl}
|
||||
alt={alt}
|
||||
className={className}
|
||||
style={{ width: size, height: size }}
|
||||
onError={handleImageError}
|
||||
onLoad={handleImageLoad}
|
||||
loading="lazy"
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* Avatar with hover card showing user info
|
||||
*/
|
||||
export function AvatarWithCard({
|
||||
record,
|
||||
handle,
|
||||
did,
|
||||
displayName,
|
||||
apiConfig,
|
||||
...avatarProps
|
||||
}) {
|
||||
const [showCard, setShowCard] = useState(false)
|
||||
|
||||
return (
|
||||
<div
|
||||
className="avatar-container"
|
||||
onMouseEnter={() => setShowCard(true)}
|
||||
onMouseLeave={() => setShowCard(false)}
|
||||
>
|
||||
<Avatar
|
||||
record={record}
|
||||
handle={handle}
|
||||
did={did}
|
||||
{...avatarProps}
|
||||
/>
|
||||
|
||||
{showCard && (
|
||||
<div className="avatar-card">
|
||||
<Avatar
|
||||
record={record}
|
||||
handle={handle}
|
||||
did={did}
|
||||
size={80}
|
||||
className="avatar-card-image"
|
||||
/>
|
||||
<div className="avatar-card-info">
|
||||
<div className="avatar-card-name">{displayName || handle}</div>
|
||||
<a
|
||||
href={`${apiConfig?.web || 'https://bsky.app'}/profile/${did || handle}`}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="avatar-card-handle"
|
||||
>
|
||||
@{handle}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* Avatar list component for displaying multiple avatars
|
||||
*/
|
||||
export function AvatarList({ users, maxDisplay = 5, size = 30 }) {
|
||||
const displayUsers = users.slice(0, maxDisplay)
|
||||
const remainingCount = Math.max(0, users.length - maxDisplay)
|
||||
|
||||
return (
|
||||
<div className="avatar-list">
|
||||
{displayUsers.map((user, index) => (
|
||||
<div
|
||||
key={user.handle || index}
|
||||
className="avatar-list-item"
|
||||
style={{ marginLeft: index > 0 ? -10 : 0, zIndex: displayUsers.length - index }}
|
||||
>
|
||||
<Avatar
|
||||
handle={user.handle}
|
||||
did={user.did}
|
||||
record={user.record}
|
||||
size={size}
|
||||
showFallback={true}
|
||||
/>
|
||||
</div>
|
||||
))}
|
||||
{remainingCount > 0 && (
|
||||
<div
|
||||
className="avatar-list-more"
|
||||
style={{
|
||||
width: size,
|
||||
height: size,
|
||||
marginLeft: -10,
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
backgroundColor: '#666',
|
||||
color: '#fff',
|
||||
borderRadius: '50%',
|
||||
fontSize: size * 0.4
|
||||
}}
|
||||
>
|
||||
+{remainingCount}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,103 +0,0 @@
|
||||
import React, { useState, useEffect } from 'react'
|
||||
import { getValidAvatar } from '../utils/avatarFetcher.js'
|
||||
import { logger } from '../utils/logger.js'
|
||||
|
||||
export default function AvatarImage({ record, size = 40, className = "avatar" }) {
|
||||
const [avatarUrl, setAvatarUrl] = useState(record?.value?.author?.avatar)
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [error, setError] = useState(false)
|
||||
|
||||
const author = record?.value?.author
|
||||
const handle = author?.handle
|
||||
const displayName = author?.displayName || handle
|
||||
|
||||
useEffect(() => {
|
||||
// record内のavatarが無い、またはエラーの場合に新しく取得
|
||||
if (!avatarUrl || error) {
|
||||
fetchValidAvatar()
|
||||
}
|
||||
}, [record, error])
|
||||
|
||||
const fetchValidAvatar = async () => {
|
||||
if (!record || loading) return
|
||||
|
||||
setLoading(true)
|
||||
try {
|
||||
const validAvatar = await getValidAvatar(record)
|
||||
setAvatarUrl(validAvatar)
|
||||
setError(false)
|
||||
} catch (err) {
|
||||
logger.error('Failed to fetch valid avatar:', err)
|
||||
setError(true)
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
const handleImageError = () => {
|
||||
setError(true)
|
||||
// エラー時に再取得を試行
|
||||
fetchValidAvatar()
|
||||
}
|
||||
|
||||
const handleImageLoad = () => {
|
||||
setError(false)
|
||||
}
|
||||
|
||||
// ローディング中のスケルトン
|
||||
if (loading) {
|
||||
return (
|
||||
<div
|
||||
className={`${className} avatar-loading`}
|
||||
style={{
|
||||
width: size,
|
||||
height: size,
|
||||
backgroundColor: '#f0f0f0',
|
||||
borderRadius: '50%',
|
||||
animation: 'pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite'
|
||||
}}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
// avatar URLがある場合
|
||||
if (avatarUrl && !error) {
|
||||
return (
|
||||
<img
|
||||
src={avatarUrl}
|
||||
alt={`${displayName} avatar`}
|
||||
className={className}
|
||||
style={{
|
||||
width: size,
|
||||
height: size,
|
||||
borderRadius: '50%',
|
||||
objectFit: 'cover'
|
||||
}}
|
||||
onError={handleImageError}
|
||||
onLoad={handleImageLoad}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
// フォールバック: 初期文字のアバター
|
||||
const initial = displayName ? displayName.charAt(0).toUpperCase() : '?'
|
||||
return (
|
||||
<div
|
||||
className={`${className} avatar-fallback`}
|
||||
style={{
|
||||
width: size,
|
||||
height: size,
|
||||
borderRadius: '50%',
|
||||
backgroundColor: '#ddd',
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
fontSize: size * 0.4,
|
||||
fontWeight: 'bold',
|
||||
color: '#666'
|
||||
}}
|
||||
>
|
||||
{initial}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,203 +0,0 @@
|
||||
import React, { useState, useEffect } from 'react'
|
||||
import Avatar, { AvatarWithCard, AvatarList } from './Avatar.jsx'
|
||||
import { getAvatar, batchFetchAvatars, prefetchAvatar } from '../utils/avatar.js'
|
||||
|
||||
/**
|
||||
* Test component to demonstrate avatar functionality
|
||||
*/
|
||||
export default function AvatarTest() {
|
||||
const [testResults, setTestResults] = useState({})
|
||||
const [loading, setLoading] = useState(false)
|
||||
|
||||
// Test data
|
||||
const testUsers = [
|
||||
{ handle: 'syui.ai', did: 'did:plc:uqzpqmrjnptsxezjx4xuh2mn' },
|
||||
{ handle: 'ai.syui.ai', did: 'did:plc:4hqjfn7m6n5hno3doamuhgef' },
|
||||
{ handle: 'yui.syui.ai', did: 'did:plc:6qyecktefllvenje24fcxnie' }
|
||||
]
|
||||
|
||||
const sampleRecord = {
|
||||
value: {
|
||||
author: {
|
||||
handle: 'syui.ai',
|
||||
did: 'did:plc:uqzpqmrjnptsxezjx4xuh2mn',
|
||||
displayName: 'syui',
|
||||
avatar: 'https://cdn.bsky.app/img/avatar/plain/did:plc:uqzpqmrjnptsxezjx4xuh2mn/bafkreid6kcc5pnn4b3ar7mj6vi3eiawhxgkcrw3edgbqeacyrlnlcoetea@jpeg'
|
||||
},
|
||||
text: 'Test message',
|
||||
createdAt: new Date().toISOString()
|
||||
}
|
||||
}
|
||||
|
||||
// Test functions
|
||||
const testGetAvatar = async () => {
|
||||
setLoading(true)
|
||||
try {
|
||||
const results = {}
|
||||
|
||||
// Test with record
|
||||
results.fromRecord = await getAvatar({ record: sampleRecord })
|
||||
|
||||
// Test with handle only
|
||||
results.fromHandle = await getAvatar({ handle: 'syui.ai' })
|
||||
|
||||
// Test with broken record (force fresh fetch)
|
||||
const brokenRecord = {
|
||||
...sampleRecord,
|
||||
value: {
|
||||
...sampleRecord.value,
|
||||
author: {
|
||||
...sampleRecord.value.author,
|
||||
avatar: 'https://broken-url.com/avatar.jpg'
|
||||
}
|
||||
}
|
||||
}
|
||||
results.brokenRecord = await getAvatar({ record: brokenRecord })
|
||||
|
||||
// Test non-existent user
|
||||
try {
|
||||
results.nonExistent = await getAvatar({ handle: 'nonexistent.user' })
|
||||
} catch (error) {
|
||||
results.nonExistent = `Error: ${error.message}`
|
||||
}
|
||||
|
||||
setTestResults(results)
|
||||
} catch (error) {
|
||||
console.error('Test failed:', error)
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
const testBatchFetch = async () => {
|
||||
setLoading(true)
|
||||
try {
|
||||
const avatarMap = await batchFetchAvatars(testUsers)
|
||||
setTestResults(prev => ({
|
||||
...prev,
|
||||
batchResults: Object.fromEntries(avatarMap)
|
||||
}))
|
||||
} catch (error) {
|
||||
console.error('Batch test failed:', error)
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
const testPrefetch = async () => {
|
||||
setLoading(true)
|
||||
try {
|
||||
await prefetchAvatar('syui.ai')
|
||||
const cachedAvatar = await getAvatar({ handle: 'syui.ai' })
|
||||
setTestResults(prev => ({
|
||||
...prev,
|
||||
prefetchResult: cachedAvatar
|
||||
}))
|
||||
} catch (error) {
|
||||
console.error('Prefetch test failed:', error)
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="avatar-test-container">
|
||||
<div className="card">
|
||||
<div className="card-header">
|
||||
<h2>Avatar System Test</h2>
|
||||
</div>
|
||||
<div className="card-content">
|
||||
|
||||
{/* Basic Avatar Examples */}
|
||||
<section className="test-section">
|
||||
<h3>Basic Avatar Examples</h3>
|
||||
<div className="avatar-examples">
|
||||
<div className="avatar-example">
|
||||
<h4>From Record</h4>
|
||||
<Avatar record={sampleRecord} size={60} />
|
||||
</div>
|
||||
|
||||
<div className="avatar-example">
|
||||
<h4>From Handle</h4>
|
||||
<Avatar handle="syui.ai" size={60} />
|
||||
</div>
|
||||
|
||||
<div className="avatar-example">
|
||||
<h4>With Fallback</h4>
|
||||
<Avatar handle="nonexistent.user" size={60} />
|
||||
</div>
|
||||
|
||||
<div className="avatar-example">
|
||||
<h4>Loading State</h4>
|
||||
<div className="avatar-loading" style={{ width: 60, height: 60 }} />
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Avatar with Card */}
|
||||
<section className="test-section">
|
||||
<h3>Avatar with Hover Card</h3>
|
||||
<div className="avatar-examples">
|
||||
<AvatarWithCard
|
||||
record={sampleRecord}
|
||||
displayName="syui"
|
||||
apiConfig={{ web: 'https://bsky.app' }}
|
||||
size={60}
|
||||
/>
|
||||
<p>Hover over the avatar to see the card</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Avatar List */}
|
||||
<section className="test-section">
|
||||
<h3>Avatar List</h3>
|
||||
<AvatarList users={testUsers} maxDisplay={3} size={40} />
|
||||
</section>
|
||||
|
||||
{/* Test Controls */}
|
||||
<section className="test-section">
|
||||
<h3>Test Functions</h3>
|
||||
<div className="test-controls">
|
||||
<button
|
||||
onClick={testGetAvatar}
|
||||
disabled={loading}
|
||||
className="btn btn-primary"
|
||||
>
|
||||
Test getAvatar()
|
||||
</button>
|
||||
|
||||
<button
|
||||
onClick={testBatchFetch}
|
||||
disabled={loading}
|
||||
className="btn btn-primary"
|
||||
>
|
||||
Test Batch Fetch
|
||||
</button>
|
||||
|
||||
<button
|
||||
onClick={testPrefetch}
|
||||
disabled={loading}
|
||||
className="btn btn-primary"
|
||||
>
|
||||
Test Prefetch
|
||||
</button>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* Test Results */}
|
||||
{Object.keys(testResults).length > 0 && (
|
||||
<section className="test-section">
|
||||
<h3>Test Results</h3>
|
||||
<div className="json-display">
|
||||
<pre className="json-content">
|
||||
{JSON.stringify(testResults, null, 2)}
|
||||
</pre>
|
||||
</div>
|
||||
</section>
|
||||
)}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,246 +0,0 @@
|
||||
import React, { useState } from 'react'
|
||||
import AvatarImage from './AvatarImage.jsx'
|
||||
import { getValidAvatar, clearAvatarCache, getAvatarCacheStats } from '../utils/avatarFetcher.js'
|
||||
|
||||
export default function AvatarTestPanel() {
|
||||
const [testHandle, setTestHandle] = useState('ai.syui.ai')
|
||||
const [testResult, setTestResult] = useState(null)
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [cacheStats, setCacheStats] = useState(null)
|
||||
|
||||
// ダミーレコードを作成（実際の投稿したレコード形式）
|
||||
const createTestRecord = (handle, brokenAvatar = false) => ({
|
||||
value: {
|
||||
author: {
|
||||
did: null, // DIDはnullにして、handleから取得させる
|
||||
handle: handle,
|
||||
displayName: "Test User",
|
||||
avatar: brokenAvatar ? "https://broken.example.com/avatar.jpg" : null
|
||||
},
|
||||
text: "テストコメント",
|
||||
createdAt: new Date().toISOString()
|
||||
}
|
||||
})
|
||||
|
||||
const testAvatarFetch = async (useBrokenAvatar = false) => {
|
||||
setLoading(true)
|
||||
setTestResult(null)
|
||||
|
||||
try {
|
||||
const testRecord = createTestRecord(testHandle, useBrokenAvatar)
|
||||
const avatarUrl = await getValidAvatar(testRecord)
|
||||
|
||||
setTestResult({
|
||||
success: true,
|
||||
avatarUrl,
|
||||
handle: testHandle,
|
||||
brokenTest: useBrokenAvatar,
|
||||
timestamp: new Date().toISOString()
|
||||
})
|
||||
} catch (error) {
|
||||
setTestResult({
|
||||
success: false,
|
||||
error: error.message,
|
||||
handle: testHandle,
|
||||
brokenTest: useBrokenAvatar
|
||||
})
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
const handleClearCache = () => {
|
||||
clearAvatarCache()
|
||||
setCacheStats(null)
|
||||
alert('Avatar cache cleared!')
|
||||
}
|
||||
|
||||
const handleShowCacheStats = () => {
|
||||
const stats = getAvatarCacheStats()
|
||||
setCacheStats(stats)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="test-ui">
|
||||
<h2>🖼️ Avatar Test Panel</h2>
|
||||
<p className="description">
|
||||
Avatar取得システムのテスト。投稿済みのdummy recordを使用してavatar取得処理を確認できます。
|
||||
</p>
|
||||
|
||||
<div className="form-group">
|
||||
<label htmlFor="test-handle">Test Handle:</label>
|
||||
<input
|
||||
id="test-handle"
|
||||
type="text"
|
||||
value={testHandle}
|
||||
onChange={(e) => setTestHandle(e.target.value)}
|
||||
placeholder="ai.syui.ai"
|
||||
disabled={loading}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="form-actions">
|
||||
<button
|
||||
onClick={() => testAvatarFetch(false)}
|
||||
disabled={loading || !testHandle.trim()}
|
||||
className="btn btn-primary"
|
||||
>
|
||||
{loading ? '⏳ Testing...' : '🔄 Test Avatar Fetch'}
|
||||
</button>
|
||||
|
||||
<button
|
||||
onClick={() => testAvatarFetch(true)}
|
||||
disabled={loading || !testHandle.trim()}
|
||||
className="btn btn-outline"
|
||||
>
|
||||
{loading ? '⏳ Testing...' : '💥 Test Broken Avatar'}
|
||||
</button>
|
||||
|
||||
<button
|
||||
onClick={handleClearCache}
|
||||
disabled={loading}
|
||||
className="btn btn-danger btn-sm"
|
||||
>
|
||||
🗑️ Clear Cache
|
||||
</button>
|
||||
|
||||
<button
|
||||
onClick={handleShowCacheStats}
|
||||
disabled={loading}
|
||||
className="btn btn-outline btn-sm"
|
||||
>
|
||||
📊 Cache Stats
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{testResult && (
|
||||
<div className="test-result">
|
||||
<h3>Test Result:</h3>
|
||||
{testResult.success ? (
|
||||
<div className="success-message">
|
||||
✅ Avatar fetched successfully!
|
||||
<div className="result-details">
|
||||
<p><strong>Handle:</strong> {testResult.handle}</p>
|
||||
<p><strong>Broken Test:</strong> {testResult.brokenTest ? 'Yes' : 'No'}</p>
|
||||
<p><strong>Avatar URL:</strong> {testResult.avatarUrl || 'None'}</p>
|
||||
<p><strong>Timestamp:</strong> {testResult.timestamp}</p>
|
||||
|
||||
{testResult.avatarUrl && (
|
||||
<div className="avatar-preview">
|
||||
<p><strong>Preview:</strong></p>
|
||||
<img
|
||||
src={testResult.avatarUrl}
|
||||
alt="Avatar preview"
|
||||
style={{
|
||||
width: 60,
|
||||
height: 60,
|
||||
borderRadius: '50%',
|
||||
objectFit: 'cover',
|
||||
border: '2px solid #ddd'
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<div className="error-message">
|
||||
❌ Test failed: {testResult.error}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{cacheStats && (
|
||||
<div className="cache-stats">
|
||||
<h3>Cache Statistics:</h3>
|
||||
<p><strong>Entries:</strong> {cacheStats.size}</p>
|
||||
{cacheStats.entries.length > 0 && (
|
||||
<div className="cache-entries">
|
||||
<h4>Cached Avatars:</h4>
|
||||
{cacheStats.entries.map((entry, i) => (
|
||||
<div key={i} className="cache-entry">
|
||||
<p><strong>Key:</strong> {entry.key}</p>
|
||||
<p><strong>Age:</strong> {Math.floor(entry.age / 1000)}s</p>
|
||||
<p><strong>Profile:</strong> {entry.profile?.displayName} (@{entry.profile?.handle})</p>
|
||||
{entry.avatar && (
|
||||
<img
|
||||
src={entry.avatar}
|
||||
alt="Cached avatar"
|
||||
style={{ width: 30, height: 30, borderRadius: '50%' }}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="live-demo">
|
||||
<h3>Live Avatar Component Demo:</h3>
|
||||
<p>実際のAvatarImageコンポーネントの動作確認:</p>
|
||||
<div style={{ display: 'flex', gap: '16px', alignItems: 'center', marginTop: '12px' }}>
|
||||
<AvatarImage record={createTestRecord(testHandle, false)} size={40} />
|
||||
<span>Normal avatar test</span>
|
||||
</div>
|
||||
<div style={{ display: 'flex', gap: '16px', alignItems: 'center', marginTop: '12px' }}>
|
||||
<AvatarImage record={createTestRecord(testHandle, true)} size={40} />
|
||||
<span>Broken avatar test (should fetch fresh)</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style jsx>{`
|
||||
.test-result {
|
||||
margin-top: 20px;
|
||||
padding: 16px;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 8px;
|
||||
background: #f9f9f9;
|
||||
}
|
||||
.result-details {
|
||||
margin-top: 12px;
|
||||
font-size: 14px;
|
||||
}
|
||||
.result-details p {
|
||||
margin: 4px 0;
|
||||
}
|
||||
.avatar-preview {
|
||||
margin-top: 12px;
|
||||
padding: 12px;
|
||||
border: 1px solid #eee;
|
||||
border-radius: 4px;
|
||||
background: white;
|
||||
}
|
||||
.cache-stats {
|
||||
margin-top: 20px;
|
||||
padding: 16px;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 8px;
|
||||
background: #f0f8ff;
|
||||
}
|
||||
.cache-entries {
|
||||
margin-top: 12px;
|
||||
}
|
||||
.cache-entry {
|
||||
padding: 8px;
|
||||
margin: 8px 0;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px;
|
||||
background: white;
|
||||
font-size: 12px;
|
||||
}
|
||||
.cache-entry p {
|
||||
margin: 2px 0;
|
||||
}
|
||||
.live-demo {
|
||||
margin-top: 20px;
|
||||
padding: 16px;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 8px;
|
||||
background: #f8f9fa;
|
||||
}
|
||||
`}</style>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,194 +0,0 @@
|
||||
import React, { useState } from 'react'
|
||||
|
||||
// Helper function to get correct web URL based on avatar URL
|
||||
function getCorrectWebUrl(avatarUrl) {
|
||||
if (!avatarUrl) return 'https://bsky.app'
|
||||
|
||||
// If avatar is from bsky.app (main Bluesky), use bsky.app
|
||||
if (avatarUrl.includes('cdn.bsky.app') || avatarUrl.includes('bsky.app')) {
|
||||
return 'https://bsky.app'
|
||||
}
|
||||
|
||||
// If avatar is from syu.is, use web.syu.is
|
||||
if (avatarUrl.includes('bsky.syu.is') || avatarUrl.includes('syu.is')) {
|
||||
return 'https://syu.is'
|
||||
}
|
||||
|
||||
// Default to bsky.app
|
||||
return 'https://bsky.app'
|
||||
}
|
||||
|
||||
export default function ChatRecordList({ chatPairs, apiConfig, user = null, agent = null, onRecordDeleted = null }) {
|
||||
const [expandedRecords, setExpandedRecords] = useState(new Set())
|
||||
|
||||
const toggleJsonView = (key) => {
|
||||
const newExpanded = new Set(expandedRecords)
|
||||
if (newExpanded.has(key)) {
|
||||
newExpanded.delete(key)
|
||||
} else {
|
||||
newExpanded.add(key)
|
||||
}
|
||||
setExpandedRecords(newExpanded)
|
||||
}
|
||||
|
||||
if (!chatPairs || chatPairs.length === 0) {
|
||||
return (
|
||||
<section>
|
||||
<p>チャット履歴がありません</p>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
||||
const handleDelete = async (chatPair) => {
|
||||
if (!user || !agent || !chatPair.question?.uri) return
|
||||
|
||||
const confirmed = window.confirm('この会話を削除しますか？')
|
||||
if (!confirmed) return
|
||||
|
||||
try {
|
||||
// Delete question record
|
||||
if (chatPair.question?.uri) {
|
||||
const questionUriParts = chatPair.question.uri.split('/')
|
||||
await agent.api.com.atproto.repo.deleteRecord({
|
||||
repo: questionUriParts[2],
|
||||
collection: questionUriParts[3],
|
||||
rkey: questionUriParts[4]
|
||||
})
|
||||
}
|
||||
|
||||
// Delete answer record if exists
|
||||
if (chatPair.answer?.uri) {
|
||||
const answerUriParts = chatPair.answer.uri.split('/')
|
||||
await agent.api.com.atproto.repo.deleteRecord({
|
||||
repo: answerUriParts[2],
|
||||
collection: answerUriParts[3],
|
||||
rkey: answerUriParts[4]
|
||||
})
|
||||
}
|
||||
|
||||
if (onRecordDeleted) {
|
||||
onRecordDeleted()
|
||||
}
|
||||
} catch (error) {
|
||||
alert(`削除に失敗しました: ${error.message}`)
|
||||
}
|
||||
}
|
||||
|
||||
const canDelete = (chatPair) => {
|
||||
return user && agent && chatPair.question?.uri && chatPair.question.value.author?.did === user.did
|
||||
}
|
||||
|
||||
return (
|
||||
<section>
|
||||
{chatPairs.map((chatPair, i) => (
|
||||
<div key={`${chatPair.rkey}-${i}`} className="chat-conversation">
|
||||
{/* Question */}
|
||||
{chatPair.question && (
|
||||
<div className="chat-message user-message comment-style">
|
||||
<div className="message-header">
|
||||
<div className="avatar">
|
||||
{chatPair.question.value.author?.avatar ? (
|
||||
<img
|
||||
src={chatPair.question.value.author.avatar}
|
||||
alt={`${chatPair.question.value.author.displayName || chatPair.question.value.author.handle} avatar`}
|
||||
className="profile-avatar"
|
||||
/>
|
||||
) : (
|
||||
<div className="avatar-fallback">
|
||||
{(chatPair.question.value.author?.displayName || chatPair.question.value.author?.handle || '?').charAt(0).toUpperCase()}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div className="user-info">
|
||||
<div className="display-name">
|
||||
{chatPair.question.value.author?.displayName || chatPair.question.value.author?.handle}
|
||||
{chatPair.question.value.author?.handle === 'syui' && <span className="admin-badge"> Admin</span>}
|
||||
</div>
|
||||
<div className="handle">
|
||||
<a
|
||||
href={`${getCorrectWebUrl(chatPair.question.value.author?.avatar)}/profile/${chatPair.question.value.author?.did}`}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="handle-link"
|
||||
>
|
||||
@{chatPair.question.value.author?.handle}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div className="record-actions">
|
||||
<button
|
||||
onClick={() => toggleJsonView(`${chatPair.rkey}-question`)}
|
||||
className="json-toggle-btn"
|
||||
>
|
||||
JSON
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
{expandedRecords.has(`${chatPair.rkey}-question`) && (
|
||||
<div className="json-display">
|
||||
<pre className="json-content">
|
||||
{JSON.stringify(chatPair.question, null, 2)}
|
||||
</pre>
|
||||
</div>
|
||||
)}
|
||||
<div className="message-content">{chatPair.question.value.text}</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{/* Answer */}
|
||||
{chatPair.answer && (
|
||||
<div className="chat-message ai-message comment-style">
|
||||
<div className="message-header">
|
||||
<div className="avatar">
|
||||
{chatPair.answer.value.author?.avatar ? (
|
||||
<img
|
||||
src={chatPair.answer.value.author.avatar}
|
||||
alt={`${chatPair.answer.value.author.displayName || chatPair.answer.value.author.handle} avatar`}
|
||||
className="profile-avatar"
|
||||
/>
|
||||
) : (
|
||||
<div className="avatar-fallback">
|
||||
{(chatPair.answer.value.author?.displayName || chatPair.answer.value.author?.handle || 'AI').charAt(0).toUpperCase()}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<div className="user-info">
|
||||
<div className="display-name">
|
||||
{chatPair.answer.value.author?.displayName || chatPair.answer.value.author?.handle}
|
||||
</div>
|
||||
<div className="handle">
|
||||
<a
|
||||
href={`${getCorrectWebUrl(chatPair.answer.value.author?.avatar)}/profile/${chatPair.answer.value.author?.did}`}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="handle-link"
|
||||
>
|
||||
@{chatPair.answer.value.author?.handle}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div className="record-actions">
|
||||
<button
|
||||
onClick={() => toggleJsonView(`${chatPair.rkey}-answer`)}
|
||||
className="json-toggle-btn"
|
||||
>
|
||||
JSON
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
{expandedRecords.has(`${chatPair.rkey}-answer`) && (
|
||||
<div className="json-display">
|
||||
<pre className="json-content">
|
||||
{JSON.stringify(chatPair.answer, null, 2)}
|
||||
</pre>
|
||||
</div>
|
||||
)}
|
||||
<div className="message-content">{chatPair.answer.value.text}</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
</div>
|
||||
))}
|
||||
</section>
|
||||
)
|
||||
}
|
||||
@@ -1,134 +0,0 @@
|
||||
import React, { useState } from 'react'
|
||||
import { atproto, collections } from '../api/atproto.js'
|
||||
import { env } from '../config/env.js'
|
||||
|
||||
export default function CommentForm({ user, agent, onCommentPosted }) {
|
||||
const [text, setText] = useState('')
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [error, setError] = useState(null)
|
||||
|
||||
const handleSubmit = async (e) => {
|
||||
e.preventDefault()
|
||||
if (!text.trim()) return
|
||||
|
||||
setLoading(true)
|
||||
setError(null)
|
||||
|
||||
try {
|
||||
const currentUrl = window.location.href
|
||||
const timestamp = new Date().toISOString()
|
||||
|
||||
// Create ai.syui.log record structure (new unified format)
|
||||
const record = {
|
||||
repo: user.did,
|
||||
collection: env.collection,
|
||||
rkey: `comment-${Date.now()}`,
|
||||
record: {
|
||||
$type: env.collection,
|
||||
url: currentUrl, // Keep for backward compatibility
|
||||
post: {
|
||||
url: currentUrl,
|
||||
date: timestamp,
|
||||
slug: currentUrl.match(/\/posts\/([^/]+)/)?.[1] || new URL(currentUrl).pathname.split('/').pop()?.replace(/\.html$/, '') || '',
|
||||
tags: [],
|
||||
title: document.title || 'Comment',
|
||||
language: 'ja'
|
||||
},
|
||||
text: text.trim(),
|
||||
type: 'comment',
|
||||
author: {
|
||||
did: user.did,
|
||||
handle: user.handle,
|
||||
displayName: user.displayName,
|
||||
avatar: user.avatar
|
||||
},
|
||||
createdAt: timestamp
|
||||
}
|
||||
}
|
||||
|
||||
// Post the record using the same API as ask-AI
|
||||
await agent.api.com.atproto.repo.putRecord({
|
||||
repo: record.repo,
|
||||
collection: record.collection,
|
||||
rkey: record.rkey,
|
||||
record: record.record
|
||||
})
|
||||
|
||||
// キャッシュを無効化
|
||||
collections.invalidateCache(env.collection)
|
||||
|
||||
// Clear form
|
||||
setText('')
|
||||
|
||||
// Notify parent component
|
||||
if (onCommentPosted) {
|
||||
onCommentPosted()
|
||||
}
|
||||
|
||||
// Show success message briefly
|
||||
setText('✓ ')
|
||||
setTimeout(() => {
|
||||
setText('')
|
||||
}, 2000)
|
||||
|
||||
} catch (err) {
|
||||
setError(err.message)
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
if (!user) {
|
||||
return (
|
||||
<div style={{
|
||||
textAlign: 'center',
|
||||
padding: '40px',
|
||||
color: 'var(--text-secondary)'
|
||||
}}>
|
||||
<p>atproto login</p>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<div>
|
||||
<h3>post</h3>
|
||||
|
||||
<form onSubmit={handleSubmit}>
|
||||
<div className="form-group" style={{ marginBottom: '12px', padding: '8px', backgroundColor: 'var(--background-secondary)', borderRadius: '4px', fontSize: '0.9em' }}>
|
||||
<strong>url:</strong> {window.location.href}
|
||||
</div>
|
||||
|
||||
<div className="form-group">
|
||||
<label htmlFor="comment-text">comment:</label>
|
||||
<textarea
|
||||
id="comment-text"
|
||||
value={text}
|
||||
onChange={(e) => setText(e.target.value)}
|
||||
placeholder="text..."
|
||||
rows={4}
|
||||
required
|
||||
disabled={loading}
|
||||
className="form-input form-textarea"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{error && (
|
||||
<div className="error-message">
|
||||
err: {error}
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="form-actions">
|
||||
<button
|
||||
type="submit"
|
||||
disabled={loading || !text.trim()}
|
||||
className={`btn ${loading ? 'btn-outline' : 'btn-primary'}`}
|
||||
>
|
||||
{loading ? 'posting...' : 'post'}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,98 +0,0 @@
|
||||
import React from 'react'
|
||||
|
||||
export default function LoadingSkeleton({ count = 3, showTitle = false }) {
|
||||
return (
|
||||
<div className="loading-skeleton">
|
||||
{showTitle && (
|
||||
<div className="skeleton-title">
|
||||
<div className="skeleton-line title"></div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{Array(count).fill(0).map((_, i) => (
|
||||
<div key={i} className="skeleton-item">
|
||||
<div className="skeleton-avatar"></div>
|
||||
<div className="skeleton-content">
|
||||
<div className="skeleton-line name"></div>
|
||||
<div className="skeleton-line text"></div>
|
||||
<div className="skeleton-line text short"></div>
|
||||
<div className="skeleton-line meta"></div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
|
||||
<style jsx>{`
|
||||
.loading-skeleton {
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.skeleton-title {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.skeleton-item {
|
||||
display: flex;
|
||||
padding: 15px;
|
||||
border: 1px solid #eee;
|
||||
margin: 10px 0;
|
||||
border-radius: 8px;
|
||||
background: #fafafa;
|
||||
}
|
||||
|
||||
.skeleton-avatar {
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
border-radius: 50%;
|
||||
background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
|
||||
background-size: 200% 100%;
|
||||
animation: skeleton-loading 1.5s infinite;
|
||||
margin-right: 12px;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.skeleton-content {
|
||||
flex: 1;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
.skeleton-line {
|
||||
background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
|
||||
background-size: 200% 100%;
|
||||
animation: skeleton-loading 1.5s infinite;
|
||||
margin-bottom: 8px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.skeleton-line.title {
|
||||
height: 20px;
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
.skeleton-line.name {
|
||||
height: 14px;
|
||||
width: 25%;
|
||||
}
|
||||
|
||||
.skeleton-line.text {
|
||||
height: 12px;
|
||||
width: 90%;
|
||||
}
|
||||
|
||||
.skeleton-line.text.short {
|
||||
width: 60%;
|
||||
}
|
||||
|
||||
.skeleton-line.meta {
|
||||
height: 10px;
|
||||
width: 40%;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
@keyframes skeleton-loading {
|
||||
0% { background-position: 200% 0; }
|
||||
100% { background-position: -200% 0; }
|
||||
}
|
||||
`}</style>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,36 +0,0 @@
|
||||
import React from 'react'
|
||||
|
||||
export default function OAuthCallback() {
|
||||
return (
|
||||
<div style={{
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
alignItems: 'center',
|
||||
justifyContent: 'center',
|
||||
minHeight: '50vh',
|
||||
padding: '40px',
|
||||
textAlign: 'center'
|
||||
}}>
|
||||
<div style={{
|
||||
width: '50px',
|
||||
height: '50px',
|
||||
border: '4px solid #f3f3f3',
|
||||
borderTop: '4px solid #667eea',
|
||||
borderRadius: '50%',
|
||||
animation: 'spin 1s linear infinite',
|
||||
marginBottom: '20px'
|
||||
}} />
|
||||
<h2 style={{ color: '#333', marginBottom: '12px' }}>OAuth認証処理中...</h2>
|
||||
<p style={{ color: '#666', fontSize: '14px' }}>
|
||||
認証が完了しましたら自動で元のページに戻ります
|
||||
</p>
|
||||
|
||||
<style jsx>{`
|
||||
@keyframes spin {
|
||||
0% { transform: rotate(0deg); }
|
||||
100% { transform: rotate(360deg); }
|
||||
}
|
||||
`}</style>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,165 +0,0 @@
|
||||
import React, { useState } from 'react'
|
||||
import { atproto, collections } from '../api/atproto.js'
|
||||
import { env } from '../config/env.js'
|
||||
|
||||
const ProfileForm = ({ user, agent, apiConfig, onProfilePosted }) => {
|
||||
const [text, setText] = useState('')
|
||||
const [type, setType] = useState('user')
|
||||
const [handle, setHandle] = useState('')
|
||||
const [rkey, setRkey] = useState('')
|
||||
const [posting, setPosting] = useState(false)
|
||||
const [error, setError] = useState('')
|
||||
|
||||
const handleSubmit = async (e) => {
|
||||
e.preventDefault()
|
||||
|
||||
if (!text.trim() || !handle.trim() || !rkey.trim()) {
|
||||
setError('すべてのフィールドを入力してください')
|
||||
return
|
||||
}
|
||||
|
||||
setPosting(true)
|
||||
setError('')
|
||||
|
||||
try {
|
||||
// Get handle information
|
||||
let authorData
|
||||
try {
|
||||
const handleDid = await atproto.getDid(apiConfig.pds, handle)
|
||||
// Use agent to get profile with authentication
|
||||
const profileResponse = await agent.api.app.bsky.actor.getProfile({ actor: handleDid })
|
||||
authorData = profileResponse.data
|
||||
} catch (err) {
|
||||
throw new Error('ハンドルが見つかりません')
|
||||
}
|
||||
|
||||
// Create record using the same pattern as CommentForm
|
||||
const timestamp = new Date().toISOString()
|
||||
const record = {
|
||||
repo: user.did,
|
||||
collection: env.collection,
|
||||
rkey: rkey,
|
||||
record: {
|
||||
$type: env.collection,
|
||||
text: text,
|
||||
type: 'profile',
|
||||
profileType: type, // admin or user
|
||||
author: {
|
||||
did: authorData.did,
|
||||
handle: authorData.handle,
|
||||
displayName: authorData.displayName || authorData.handle,
|
||||
avatar: authorData.avatar || null
|
||||
},
|
||||
createdAt: timestamp,
|
||||
post: {
|
||||
url: window.location.origin,
|
||||
date: timestamp,
|
||||
slug: '',
|
||||
tags: [],
|
||||
title: 'Profile',
|
||||
language: 'ja'
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Post the record using agent like CommentForm
|
||||
await agent.api.com.atproto.repo.putRecord(record)
|
||||
|
||||
// Invalidate cache and refresh
|
||||
collections.invalidateCache(env.collection)
|
||||
|
||||
// Reset form
|
||||
setText('')
|
||||
setType('user')
|
||||
setHandle('')
|
||||
setRkey('')
|
||||
|
||||
if (onProfilePosted) {
|
||||
onProfilePosted()
|
||||
}
|
||||
|
||||
} catch (err) {
|
||||
console.error('Failed to create profile:', err)
|
||||
setError(err.message || 'プロフィールの作成に失敗しました')
|
||||
} finally {
|
||||
setPosting(false)
|
||||
}
|
||||
}
|
||||
|
||||
if (!user) {
|
||||
return null
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="profile-form-container">
|
||||
<h3>プロフィール投稿</h3>
|
||||
|
||||
{error && (
|
||||
<div className="error-message">
|
||||
{error}
|
||||
</div>
|
||||
)}
|
||||
|
||||
<form onSubmit={handleSubmit} className="profile-form">
|
||||
<div className="form-row">
|
||||
<div className="form-group">
|
||||
<label htmlFor="handle">ハンドル</label>
|
||||
<input
|
||||
type="text"
|
||||
id="handle"
|
||||
value={handle}
|
||||
onChange={(e) => setHandle(e.target.value)}
|
||||
placeholder="例: syui.ai"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div className="form-group">
|
||||
<label htmlFor="rkey">Rkey</label>
|
||||
<input
|
||||
type="text"
|
||||
id="rkey"
|
||||
value={rkey}
|
||||
onChange={(e) => setRkey(e.target.value)}
|
||||
placeholder="例: syui"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="form-group">
|
||||
<label htmlFor="type">タイプ</label>
|
||||
<select
|
||||
id="type"
|
||||
value={type}
|
||||
onChange={(e) => setType(e.target.value)}
|
||||
>
|
||||
<option value="user">User</option>
|
||||
<option value="admin">Admin</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div className="form-group">
|
||||
<label htmlFor="text">プロフィールテキスト</label>
|
||||
<textarea
|
||||
id="text"
|
||||
value={text}
|
||||
onChange={(e) => setText(e.target.value)}
|
||||
placeholder="プロフィールの説明を入力してください"
|
||||
rows={4}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<button
|
||||
type="submit"
|
||||
disabled={posting || !text.trim() || !handle.trim() || !rkey.trim()}
|
||||
className="submit-btn"
|
||||
>
|
||||
{posting ? '投稿中...' : '投稿'}
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default ProfileForm
|
||||
@@ -1,136 +0,0 @@
|
||||
import React, { useState } from 'react'
|
||||
|
||||
// Helper function to get correct web URL based on avatar URL
|
||||
function getCorrectWebUrl(avatarUrl) {
|
||||
if (!avatarUrl) return 'https://bsky.app'
|
||||
|
||||
// If avatar is from bsky.app (main Bluesky), use bsky.app
|
||||
if (avatarUrl.includes('cdn.bsky.app') || avatarUrl.includes('bsky.app')) {
|
||||
return 'https://bsky.app'
|
||||
}
|
||||
|
||||
// If avatar is from syu.is, use web.syu.is
|
||||
if (avatarUrl.includes('bsky.syu.is') || avatarUrl.includes('syu.is')) {
|
||||
return 'https://syu.is'
|
||||
}
|
||||
|
||||
// Default to bsky.app
|
||||
return 'https://bsky.app'
|
||||
}
|
||||
|
||||
export default function ProfileRecordList({ profileRecords, apiConfig, user = null, agent = null, onRecordDeleted = null }) {
|
||||
const [expandedRecords, setExpandedRecords] = useState(new Set())
|
||||
|
||||
const toggleJsonView = (uri) => {
|
||||
const newExpanded = new Set(expandedRecords)
|
||||
if (newExpanded.has(uri)) {
|
||||
newExpanded.delete(uri)
|
||||
} else {
|
||||
newExpanded.add(uri)
|
||||
}
|
||||
setExpandedRecords(newExpanded)
|
||||
}
|
||||
if (!profileRecords || profileRecords.length === 0) {
|
||||
return (
|
||||
<section>
|
||||
<p>プロフィールがありません</p>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
||||
const handleDelete = async (profile) => {
|
||||
if (!user || !agent || !profile.uri) return
|
||||
|
||||
const confirmed = window.confirm('このプロフィールを削除しますか？')
|
||||
if (!confirmed) return
|
||||
|
||||
try {
|
||||
const uriParts = profile.uri.split('/')
|
||||
await agent.api.com.atproto.repo.deleteRecord({
|
||||
repo: uriParts[2],
|
||||
collection: uriParts[3],
|
||||
rkey: uriParts[4]
|
||||
})
|
||||
|
||||
if (onRecordDeleted) {
|
||||
onRecordDeleted()
|
||||
}
|
||||
} catch (error) {
|
||||
alert(`削除に失敗しました: ${error.message}`)
|
||||
}
|
||||
}
|
||||
|
||||
const canDelete = (profile) => {
|
||||
if (!user || !agent || !profile.uri) return false
|
||||
|
||||
// Check if the record is in the current user's repository
|
||||
const recordRepoDid = profile.uri.split('/')[2]
|
||||
return recordRepoDid === user.did
|
||||
}
|
||||
|
||||
return (
|
||||
<section>
|
||||
{profileRecords.map((profile) => (
|
||||
<div key={profile.uri} className="chat-message comment-style">
|
||||
<div className="message-header">
|
||||
{profile.value.author?.avatar ? (
|
||||
<img
|
||||
src={profile.value.author.avatar}
|
||||
alt={`${profile.value.author.displayName || profile.value.author.handle} avatar`}
|
||||
className="avatar"
|
||||
/>
|
||||
) : (
|
||||
<div className="avatar">
|
||||
{(profile.value.author?.displayName || profile.value.author?.handle || '?').charAt(0).toUpperCase()}
|
||||
</div>
|
||||
)}
|
||||
<div className="user-info">
|
||||
<div className="display-name">
|
||||
{profile.value.author?.displayName || profile.value.author?.handle}
|
||||
{profile.value.profileType === 'admin' && (
|
||||
<span className="admin-badge"> Admin</span>
|
||||
)}
|
||||
</div>
|
||||
<div className="handle">
|
||||
<a
|
||||
href={`${getCorrectWebUrl(profile.value.author?.avatar)}/profile/${profile.value.author?.did}`}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="handle-link"
|
||||
>
|
||||
@{profile.value.author?.handle}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div className="record-actions">
|
||||
<button
|
||||
onClick={() => toggleJsonView(profile.uri)}
|
||||
className={`btn btn-sm ${expandedRecords.has(profile.uri) ? 'btn-outline' : 'btn-primary'}`}
|
||||
title="Show/Hide JSON"
|
||||
>
|
||||
{expandedRecords.has(profile.uri) ? 'hide' : 'json'}
|
||||
</button>
|
||||
{canDelete(profile) && (
|
||||
<button
|
||||
onClick={() => handleDelete(profile)}
|
||||
className="btn btn-danger btn-sm"
|
||||
title="Delete Profile"
|
||||
>
|
||||
delete
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
{expandedRecords.has(profile.uri) && (
|
||||
<div className="json-display">
|
||||
<pre className="json-content">
|
||||
{JSON.stringify(profile, null, 2)}
|
||||
</pre>
|
||||
</div>
|
||||
)}
|
||||
<div className="message-content">{profile.value.text}</div>
|
||||
</div>
|
||||
))}
|
||||
</section>
|
||||
)
|
||||
}
|
||||
@@ -1,154 +0,0 @@
|
||||
import React, { useState } from 'react'
|
||||
import AvatarImage from './AvatarImage.jsx'
|
||||
import Avatar from './Avatar.jsx'
|
||||
|
||||
// Helper function to get correct web URL based on avatar URL
|
||||
function getCorrectWebUrl(avatarUrl) {
|
||||
if (!avatarUrl) return 'https://bsky.app'
|
||||
|
||||
// If avatar is from bsky.app (main Bluesky), use bsky.app
|
||||
if (avatarUrl.includes('cdn.bsky.app') || avatarUrl.includes('bsky.app')) {
|
||||
return 'https://bsky.app'
|
||||
}
|
||||
|
||||
// If avatar is from syu.is, use web.syu.is
|
||||
if (avatarUrl.includes('bsky.syu.is') || avatarUrl.includes('syu.is')) {
|
||||
return 'https://syu.is'
|
||||
}
|
||||
|
||||
// Default to bsky.app
|
||||
return 'https://bsky.app'
|
||||
}
|
||||
|
||||
export default function RecordList({ title, records, apiConfig, showTitle = true, user = null, agent = null, onRecordDeleted = null }) {
|
||||
const [expandedRecords, setExpandedRecords] = useState(new Set())
|
||||
const [deletingRecords, setDeletingRecords] = useState(new Set())
|
||||
|
||||
const toggleJsonView = (index) => {
|
||||
const newExpanded = new Set(expandedRecords)
|
||||
if (newExpanded.has(index)) {
|
||||
newExpanded.delete(index)
|
||||
} else {
|
||||
newExpanded.add(index)
|
||||
}
|
||||
setExpandedRecords(newExpanded)
|
||||
}
|
||||
|
||||
const handleDelete = async (record, index) => {
|
||||
if (!user || !agent || !record.uri) return
|
||||
|
||||
const confirmed = window.confirm('このレコードを削除しますか？')
|
||||
if (!confirmed) return
|
||||
|
||||
setDeletingRecords(prev => new Set([...prev, index]))
|
||||
|
||||
try {
|
||||
// Extract repo, collection, rkey from URI
|
||||
const uriParts = record.uri.split('/')
|
||||
const repo = uriParts[2]
|
||||
const collection = uriParts[3]
|
||||
const rkey = uriParts[4]
|
||||
|
||||
await agent.com.atproto.repo.deleteRecord({
|
||||
repo: repo,
|
||||
collection: collection,
|
||||
rkey: rkey
|
||||
})
|
||||
|
||||
if (onRecordDeleted) {
|
||||
onRecordDeleted()
|
||||
}
|
||||
} catch (error) {
|
||||
alert(`削除に失敗しました: ${error.message}`)
|
||||
} finally {
|
||||
setDeletingRecords(prev => {
|
||||
const newSet = new Set(prev)
|
||||
newSet.delete(index)
|
||||
return newSet
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
const canDelete = (record) => {
|
||||
return user && agent && record.uri && record.value.author?.did === user.did
|
||||
}
|
||||
if (!records || records.length === 0) {
|
||||
return (
|
||||
<section>
|
||||
{showTitle && <h3>{title} (0)</h3>}
|
||||
<p>レコードがありません</p>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
||||
return (
|
||||
<section>
|
||||
{showTitle && <h3>{title} ({records.length})</h3>}
|
||||
{records.map((record, i) => (
|
||||
<div key={i} className="record-item">
|
||||
<div className="record-header">
|
||||
<AvatarImage record={record} size={40} />
|
||||
<div className="user-info">
|
||||
<div className="display-name">{record.value.author?.displayName || record.value.author?.handle}</div>
|
||||
<div className="handle">
|
||||
<a
|
||||
href={`${getCorrectWebUrl(record.value.author?.avatar)}/profile/${record.value.author?.did}`}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="handle-link"
|
||||
>
|
||||
@{record.value.author?.handle}
|
||||
</a>
|
||||
</div>
|
||||
<div className="timestamp">{new Date(record.value.createdAt).toLocaleString()}</div>
|
||||
</div>
|
||||
|
||||
<div className="record-actions">
|
||||
<button
|
||||
onClick={() => toggleJsonView(i)}
|
||||
className={`btn btn-sm ${expandedRecords.has(i) ? 'btn-outline' : 'btn-primary'}`}
|
||||
title="Show/Hide JSON"
|
||||
>
|
||||
{expandedRecords.has(i) ? 'hide' : 'json'}
|
||||
</button>
|
||||
|
||||
{canDelete(record) && (
|
||||
<button
|
||||
onClick={() => handleDelete(record, i)}
|
||||
disabled={deletingRecords.has(i)}
|
||||
className="btn btn-danger btn-sm"
|
||||
title="Delete Record"
|
||||
>
|
||||
{deletingRecords.has(i) ? 'deleting...' : 'delete'}
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="record-meta">
|
||||
{record.value.post?.url && (
|
||||
<a
|
||||
href={record.value.post.url}
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="record-url"
|
||||
>
|
||||
{record.value.post.url}
|
||||
</a>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{expandedRecords.has(i) && (
|
||||
<div className="json-display">
|
||||
<pre className="json-content">
|
||||
{JSON.stringify(record, null, 2)}
|
||||
</pre>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="record-content">{record.value.text || record.value.content}</div>
|
||||
</div>
|
||||
))}
|
||||
</section>
|
||||
)
|
||||
}
|
||||
@@ -1,214 +0,0 @@
|
||||
import React, { useState } from 'react'
|
||||
import RecordList from './RecordList.jsx'
|
||||
import ChatRecordList from './ChatRecordList.jsx'
|
||||
import ProfileRecordList from './ProfileRecordList.jsx'
|
||||
import LoadingSkeleton from './LoadingSkeleton.jsx'
|
||||
import { logger } from '../utils/logger.js'
|
||||
|
||||
export default function RecordTabs({ langRecords, commentRecords, userComments, chatRecords, userChatRecords, userChatLoading, baseRecords, apiConfig, pageContext, user = null, agent = null, onRecordDeleted = null }) {
|
||||
const [activeTab, setActiveTab] = useState('profiles')
|
||||
|
||||
logger.log('RecordTabs: activeTab is', activeTab)
|
||||
|
||||
// Filter records based on page context
|
||||
const filterRecords = (records, isProfile = false) => {
|
||||
if (pageContext.isTopPage) {
|
||||
// Top page: show latest 3 records
|
||||
return records.slice(0, 3)
|
||||
} else {
|
||||
// Individual page: show records matching the URL
|
||||
return records.filter(record => {
|
||||
// Profile records should always be shown
|
||||
if (isProfile || record.value?.type === 'profile') {
|
||||
return true
|
||||
}
|
||||
|
||||
const recordUrl = record.value?.post?.url
|
||||
if (!recordUrl) return false
|
||||
|
||||
try {
|
||||
const recordRkey = new URL(recordUrl).pathname.split('/').pop()?.replace(/\.html$/, '')
|
||||
return recordRkey === pageContext.rkey
|
||||
} catch {
|
||||
return false
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
// Special filter for chat records (which are already processed into pairs)
|
||||
const filterChatRecords = (chatPairs) => {
|
||||
console.log('filterChatRecords called:', {
|
||||
isTopPage: pageContext.isTopPage,
|
||||
rkey: pageContext.rkey,
|
||||
chatPairsLength: chatPairs.length
|
||||
})
|
||||
|
||||
if (pageContext.isTopPage) {
|
||||
// Top page: show latest 3 pairs
|
||||
const result = chatPairs.slice(0, 3)
|
||||
console.log('Top page: returning', result.length, 'pairs')
|
||||
return result
|
||||
} else {
|
||||
// Individual page: show pairs matching the URL (compare path only, ignore domain)
|
||||
const filtered = chatPairs.filter(chatPair => {
|
||||
const recordUrl = chatPair.question?.value?.post?.url
|
||||
if (!recordUrl) {
|
||||
console.log('No recordUrl for chatPair:', chatPair)
|
||||
return false
|
||||
}
|
||||
|
||||
try {
|
||||
// Extract path from URL and get the filename part
|
||||
const recordPath = new URL(recordUrl).pathname
|
||||
const recordRkey = recordPath.split('/').pop()?.replace(/\.html$/, '')
|
||||
|
||||
console.log('Comparing:', { recordRkey, pageRkey: pageContext.rkey, recordUrl })
|
||||
|
||||
// Compare with current page rkey
|
||||
const matches = recordRkey === pageContext.rkey
|
||||
if (matches) {
|
||||
console.log('Found matching chat pair!')
|
||||
}
|
||||
return matches
|
||||
} catch (error) {
|
||||
console.log('Error processing recordUrl:', recordUrl, error)
|
||||
return false
|
||||
}
|
||||
})
|
||||
|
||||
console.log('Individual page: returning', filtered.length, 'filtered pairs')
|
||||
return filtered
|
||||
}
|
||||
}
|
||||
|
||||
const filteredLangRecords = filterRecords(langRecords)
|
||||
const filteredCommentRecords = filterRecords(commentRecords)
|
||||
const filteredUserComments = filterRecords(userComments || [])
|
||||
const filteredChatRecords = filterChatRecords(chatRecords || [])
|
||||
const filteredBaseRecords = filterRecords(baseRecords || [])
|
||||
|
||||
// Filter profile records from baseRecords
|
||||
const profileRecords = (baseRecords || []).filter(record => record.value?.type === 'profile')
|
||||
const sortedProfileRecords = profileRecords.sort((a, b) => {
|
||||
if (a.value.profileType === 'admin' && b.value.profileType !== 'admin') return -1
|
||||
if (a.value.profileType !== 'admin' && b.value.profileType === 'admin') return 1
|
||||
return 0
|
||||
})
|
||||
const filteredProfileRecords = filterRecords(sortedProfileRecords, true)
|
||||
|
||||
return (
|
||||
<div className="record-tabs">
|
||||
<div className="tab-header">
|
||||
<button
|
||||
className={`tab-btn ${activeTab === 'profiles' ? 'active' : ''}`}
|
||||
onClick={() => {
|
||||
logger.log('RecordTabs: Profiles tab clicked')
|
||||
setActiveTab('profiles')
|
||||
}}
|
||||
>
|
||||
about ({filteredProfileRecords.length})
|
||||
</button>
|
||||
<button
|
||||
className={`tab-btn ${activeTab === 'collection' ? 'active' : ''}`}
|
||||
onClick={() => setActiveTab('collection')}
|
||||
>
|
||||
chat ({filteredChatRecords.length > 0 ? filteredChatRecords.length : (userChatRecords?.length || 0)})
|
||||
</button>
|
||||
<button
|
||||
className={`tab-btn ${activeTab === 'comment' ? 'active' : ''}`}
|
||||
onClick={() => setActiveTab('comment')}
|
||||
>
|
||||
feedback ({filteredCommentRecords.length})
|
||||
</button>
|
||||
<button
|
||||
className={`tab-btn ${activeTab === 'users' ? 'active' : ''}`}
|
||||
onClick={() => setActiveTab('users')}
|
||||
>
|
||||
comment ({filteredUserComments.length})
|
||||
</button>
|
||||
<button
|
||||
className={`tab-btn ${activeTab === 'lang' ? 'active' : ''}`}
|
||||
onClick={() => setActiveTab('lang')}
|
||||
>
|
||||
en ({filteredLangRecords.length})
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div className="tab-content">
|
||||
{activeTab === 'lang' && (
|
||||
!langRecords ? (
|
||||
<LoadingSkeleton count={3} showTitle={true} />
|
||||
) : (
|
||||
<RecordList
|
||||
title=""
|
||||
records={filteredLangRecords}
|
||||
apiConfig={apiConfig}
|
||||
user={user}
|
||||
agent={agent}
|
||||
onRecordDeleted={onRecordDeleted}
|
||||
showTitle={false}
|
||||
/>
|
||||
)
|
||||
)}
|
||||
{activeTab === 'comment' && (
|
||||
!commentRecords ? (
|
||||
<LoadingSkeleton count={3} showTitle={true} />
|
||||
) : (
|
||||
<RecordList
|
||||
title=""
|
||||
records={filteredCommentRecords}
|
||||
apiConfig={apiConfig}
|
||||
user={user}
|
||||
agent={agent}
|
||||
onRecordDeleted={onRecordDeleted}
|
||||
showTitle={false}
|
||||
/>
|
||||
)
|
||||
)}
|
||||
{activeTab === 'collection' && (
|
||||
userChatLoading ? (
|
||||
<LoadingSkeleton count={2} showTitle={true} />
|
||||
) : (
|
||||
<ChatRecordList
|
||||
chatPairs={filteredChatRecords.length > 0 ? filteredChatRecords : userChatRecords}
|
||||
apiConfig={apiConfig}
|
||||
user={user}
|
||||
agent={agent}
|
||||
onRecordDeleted={onRecordDeleted}
|
||||
/>
|
||||
)
|
||||
)}
|
||||
{activeTab === 'users' && (
|
||||
!userComments ? (
|
||||
<LoadingSkeleton count={3} showTitle={true} />
|
||||
) : (
|
||||
<RecordList
|
||||
title=""
|
||||
records={filteredUserComments}
|
||||
apiConfig={apiConfig}
|
||||
user={user}
|
||||
agent={agent}
|
||||
onRecordDeleted={onRecordDeleted}
|
||||
showTitle={false}
|
||||
/>
|
||||
)
|
||||
)}
|
||||
{activeTab === 'profiles' && (
|
||||
!baseRecords ? (
|
||||
<LoadingSkeleton count={3} showTitle={true} />
|
||||
) : (
|
||||
<ProfileRecordList
|
||||
profileRecords={filteredProfileRecords}
|
||||
apiConfig={apiConfig}
|
||||
user={user}
|
||||
agent={agent}
|
||||
onRecordDeleted={onRecordDeleted}
|
||||
/>
|
||||
)
|
||||
)}
|
||||
</div>
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,531 +0,0 @@
|
||||
import React, { useState } from 'react'
|
||||
import { env } from '../config/env.js'
|
||||
import AvatarTestPanel from './AvatarTestPanel.jsx'
|
||||
import AvatarTest from './AvatarTest.jsx'
|
||||
|
||||
export default function TestUI() {
|
||||
const [activeTab, setActiveTab] = useState('putRecord')
|
||||
const [accessJwt, setAccessJwt] = useState('')
|
||||
const [handle, setHandle] = useState('')
|
||||
const [sessionDid, setSessionDid] = useState('')
|
||||
const [collection, setCollection] = useState('ai.syui.log')
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [error, setError] = useState(null)
|
||||
const [success, setSuccess] = useState(null)
|
||||
const [showJson, setShowJson] = useState(false)
|
||||
const [lastRecord, setLastRecord] = useState(null)
|
||||
|
||||
const collections = [
|
||||
'ai.syui.log',
|
||||
'ai.syui.log.chat',
|
||||
'ai.syui.log.chat.lang',
|
||||
'ai.syui.log.chat.comment'
|
||||
]
|
||||
|
||||
const generateDummyData = (collectionType) => {
|
||||
const timestamp = new Date().toISOString()
|
||||
const url = 'https://syui.ai/test/dummy'
|
||||
|
||||
const basePost = {
|
||||
url: url,
|
||||
date: timestamp,
|
||||
slug: 'dummy-test',
|
||||
tags: ['test', 'dummy'],
|
||||
title: 'Test Post',
|
||||
language: 'ja'
|
||||
}
|
||||
|
||||
const baseAuthor = {
|
||||
did: sessionDid || null, // Use real session DID if available, otherwise null
|
||||
handle: handle || 'test.user',
|
||||
displayName: 'Test User',
|
||||
avatar: null
|
||||
}
|
||||
|
||||
switch (collectionType) {
|
||||
case 'ai.syui.log':
|
||||
return {
|
||||
$type: collectionType,
|
||||
url: url,
|
||||
post: basePost,
|
||||
text: 'テストコメントです。これはダミーデータです。',
|
||||
type: 'comment',
|
||||
author: baseAuthor,
|
||||
createdAt: timestamp
|
||||
}
|
||||
|
||||
case 'ai.syui.log.chat':
|
||||
const isQuestion = Math.random() > 0.5
|
||||
return {
|
||||
$type: collectionType,
|
||||
post: basePost,
|
||||
text: isQuestion ? 'これはテスト用の質問です。' : 'これはテスト用のAI回答です。詳しく説明します。',
|
||||
type: isQuestion ? 'question' : 'answer',
|
||||
author: isQuestion ? baseAuthor : {
|
||||
did: 'did:plc:ai-test',
|
||||
handle: 'ai.syui.ai',
|
||||
displayName: 'ai',
|
||||
avatar: null
|
||||
},
|
||||
createdAt: timestamp
|
||||
}
|
||||
|
||||
case 'ai.syui.log.chat.lang':
|
||||
return {
|
||||
$type: collectionType,
|
||||
post: basePost,
|
||||
text: 'This is a test translation. Hello, this is a dummy English translation of the Japanese post.',
|
||||
type: 'en',
|
||||
author: {
|
||||
did: 'did:plc:ai-test',
|
||||
handle: 'ai.syui.ai',
|
||||
displayName: 'ai',
|
||||
avatar: null
|
||||
},
|
||||
createdAt: timestamp
|
||||
}
|
||||
|
||||
case 'ai.syui.log.chat.comment':
|
||||
return {
|
||||
$type: collectionType,
|
||||
post: basePost,
|
||||
text: 'これはAIによるテストコメントです。記事についての感想や補足情報を提供します。',
|
||||
author: {
|
||||
did: 'did:plc:ai-test',
|
||||
handle: 'ai.syui.ai',
|
||||
displayName: 'ai',
|
||||
avatar: null
|
||||
},
|
||||
createdAt: timestamp
|
||||
}
|
||||
|
||||
default:
|
||||
return {}
|
||||
}
|
||||
}
|
||||
|
||||
const handleSubmit = async (e) => {
|
||||
e.preventDefault()
|
||||
if (!accessJwt.trim() || !handle.trim()) {
|
||||
setError('Access JWT and Handle are required')
|
||||
return
|
||||
}
|
||||
|
||||
setLoading(true)
|
||||
setError(null)
|
||||
setSuccess(null)
|
||||
|
||||
try {
|
||||
const recordData = generateDummyData(collection)
|
||||
const rkey = `test-${Date.now()}`
|
||||
|
||||
const record = {
|
||||
repo: handle, // Use handle as is, without adding .bsky.social
|
||||
collection: collection,
|
||||
rkey: rkey,
|
||||
record: recordData
|
||||
}
|
||||
|
||||
setLastRecord(record)
|
||||
|
||||
// Direct API call with accessJwt
|
||||
const response = await fetch(`https://${env.pds}/xrpc/com.atproto.repo.putRecord`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'Authorization': `Bearer ${accessJwt}`
|
||||
},
|
||||
body: JSON.stringify(record)
|
||||
})
|
||||
|
||||
if (!response.ok) {
|
||||
const errorData = await response.json()
|
||||
throw new Error(`API Error: ${response.status} - ${errorData.message || response.statusText}`)
|
||||
}
|
||||
|
||||
const result = await response.json()
|
||||
setSuccess(`Record created successfully! URI: ${result.uri}`)
|
||||
|
||||
} catch (err) {
|
||||
setError(err.message)
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
const handleDelete = async () => {
|
||||
if (!lastRecord || !accessJwt.trim()) {
|
||||
setError('No record to delete or missing access JWT')
|
||||
return
|
||||
}
|
||||
|
||||
setLoading(true)
|
||||
setError(null)
|
||||
|
||||
try {
|
||||
const deleteData = {
|
||||
repo: lastRecord.repo,
|
||||
collection: lastRecord.collection,
|
||||
rkey: lastRecord.rkey
|
||||
}
|
||||
|
||||
const response = await fetch(`https://${env.pds}/xrpc/com.atproto.repo.deleteRecord`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'Authorization': `Bearer ${accessJwt}`
|
||||
},
|
||||
body: JSON.stringify(deleteData)
|
||||
})
|
||||
|
||||
if (!response.ok) {
|
||||
const errorData = await response.json()
|
||||
throw new Error(`Delete Error: ${response.status} - ${errorData.message || response.statusText}`)
|
||||
}
|
||||
|
||||
setSuccess('Record deleted successfully!')
|
||||
setLastRecord(null)
|
||||
|
||||
} catch (err) {
|
||||
setError(err.message)
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="test-ui">
|
||||
<h2>🧪 Test UI</h2>
|
||||
|
||||
{/* Tab Navigation */}
|
||||
<div className="test-tabs">
|
||||
<button
|
||||
onClick={() => setActiveTab('putRecord')}
|
||||
className={`test-tab ${activeTab === 'putRecord' ? 'active' : ''}`}
|
||||
>
|
||||
Manual putRecord
|
||||
</button>
|
||||
<button
|
||||
onClick={() => setActiveTab('avatar')}
|
||||
className={`test-tab ${activeTab === 'avatar' ? 'active' : ''}`}
|
||||
>
|
||||
Avatar System
|
||||
</button>
|
||||
</div>
|
||||
|
||||
{activeTab === 'putRecord' && (
|
||||
<div className="test-content">
|
||||
<p className="description">
|
||||
OAuth不要のテスト用UI。accessJwtとhandleを直接入力して各collectionにダミーデータを投稿できます。
|
||||
</p>
|
||||
|
||||
<form onSubmit={handleSubmit}>
|
||||
<div className="form-group">
|
||||
<label htmlFor="access-jwt">Access JWT:</label>
|
||||
<textarea
|
||||
id="access-jwt"
|
||||
value={accessJwt}
|
||||
onChange={(e) => setAccessJwt(e.target.value)}
|
||||
placeholder="eyJ... (Access JWT token)"
|
||||
rows={3}
|
||||
required
|
||||
disabled={loading}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="form-group">
|
||||
<label htmlFor="handle">Handle:</label>
|
||||
<input
|
||||
id="handle"
|
||||
type="text"
|
||||
value={handle}
|
||||
onChange={(e) => setHandle(e.target.value)}
|
||||
placeholder="user.bsky.social"
|
||||
required
|
||||
disabled={loading}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="form-group">
|
||||
<label htmlFor="session-did">Session DID (optional):</label>
|
||||
<input
|
||||
id="session-did"
|
||||
type="text"
|
||||
value={sessionDid}
|
||||
onChange={(e) => setSessionDid(e.target.value)}
|
||||
placeholder="did:plc:xxxxx (Leave empty to use test DID)"
|
||||
disabled={loading}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="form-group">
|
||||
<label htmlFor="collection">Collection:</label>
|
||||
<select
|
||||
id="collection"
|
||||
value={collection}
|
||||
onChange={(e) => setCollection(e.target.value)}
|
||||
disabled={loading}
|
||||
>
|
||||
{collections.map(col => (
|
||||
<option key={col} value={col}>{col}</option>
|
||||
))}
|
||||
</select>
|
||||
</div>
|
||||
|
||||
{error && (
|
||||
<div className="error-message">
|
||||
❌ {error}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{success && (
|
||||
<div className="success-message">
|
||||
✅ {success}
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className="form-actions">
|
||||
<button
|
||||
type="submit"
|
||||
disabled={loading || !accessJwt.trim() || !handle.trim()}
|
||||
className="submit-btn"
|
||||
>
|
||||
{loading ? '⏳ Creating...' : '📤 Create Record'}
|
||||
</button>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => setShowJson(!showJson)}
|
||||
className="json-btn"
|
||||
disabled={loading}
|
||||
>
|
||||
{showJson ? '🙈 Hide JSON' : '👁️ Show JSON'}
|
||||
</button>
|
||||
|
||||
{lastRecord && (
|
||||
<button
|
||||
type="button"
|
||||
onClick={handleDelete}
|
||||
className="delete-btn"
|
||||
disabled={loading}
|
||||
>
|
||||
{loading ? '⏳ Deleting...' : '🗑️ Delete Last Record'}
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
</form>
|
||||
|
||||
{showJson && (
|
||||
<div className="json-preview">
|
||||
<h3>Generated JSON:</h3>
|
||||
<pre>{JSON.stringify(generateDummyData(collection), null, 2)}</pre>
|
||||
</div>
|
||||
)}
|
||||
|
||||
{lastRecord && (
|
||||
<div className="last-record">
|
||||
<h3>Last Created Record:</h3>
|
||||
<div className="record-info">
|
||||
<p><strong>Collection:</strong> {lastRecord.collection}</p>
|
||||
<p><strong>RKey:</strong> {lastRecord.rkey}</p>
|
||||
<p><strong>Repo:</strong> {lastRecord.repo}</p>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
{activeTab === 'avatar' && (
|
||||
<div className="test-content">
|
||||
<AvatarTestPanel />
|
||||
</div>
|
||||
)}
|
||||
|
||||
<style jsx>{`
|
||||
.test-ui {
|
||||
border: 3px solid #ff6b6b;
|
||||
border-radius: 8px;
|
||||
padding: 20px;
|
||||
margin: 20px 0;
|
||||
background: #fff5f5;
|
||||
}
|
||||
.test-tabs {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
margin-bottom: 20px;
|
||||
border-bottom: 2px solid #ddd;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
.test-tab {
|
||||
background: #f8f9fa;
|
||||
border: 1px solid #ddd;
|
||||
padding: 8px 16px;
|
||||
border-radius: 4px 4px 0 0;
|
||||
cursor: pointer;
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
color: #666;
|
||||
transition: all 0.2s;
|
||||
}
|
||||
.test-tab:hover {
|
||||
background: #e9ecef;
|
||||
color: #333;
|
||||
}
|
||||
.test-tab.active {
|
||||
background: #ff6b6b;
|
||||
color: white;
|
||||
border-color: #ff6b6b;
|
||||
}
|
||||
.test-content {
|
||||
margin-top: 20px;
|
||||
}
|
||||
.test-ui h2 {
|
||||
color: #ff6b6b;
|
||||
margin-top: 0;
|
||||
}
|
||||
.description {
|
||||
color: #666;
|
||||
font-style: italic;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.form-group {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
.form-group label {
|
||||
display: block;
|
||||
margin-bottom: 5px;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
}
|
||||
.form-group input,
|
||||
.form-group textarea,
|
||||
.form-group select {
|
||||
width: 100%;
|
||||
padding: 8px 12px;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px;
|
||||
font-size: 14px;
|
||||
box-sizing: border-box;
|
||||
font-family: monospace;
|
||||
}
|
||||
.form-group textarea {
|
||||
resize: vertical;
|
||||
min-height: 80px;
|
||||
}
|
||||
.form-group input:focus,
|
||||
.form-group textarea:focus,
|
||||
.form-group select:focus {
|
||||
outline: none;
|
||||
border-color: #ff6b6b;
|
||||
box-shadow: 0 0 0 2px rgba(255, 107, 107, 0.25);
|
||||
}
|
||||
.form-group input:disabled,
|
||||
.form-group textarea:disabled,
|
||||
.form-group select:disabled {
|
||||
background: #f8f9fa;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.error-message {
|
||||
background: #f8d7da;
|
||||
color: #721c24;
|
||||
padding: 10px;
|
||||
border-radius: 4px;
|
||||
margin-bottom: 15px;
|
||||
border: 1px solid #f5c6cb;
|
||||
}
|
||||
.success-message {
|
||||
background: #d4edda;
|
||||
color: #155724;
|
||||
padding: 10px;
|
||||
border-radius: 4px;
|
||||
margin-bottom: 15px;
|
||||
border: 1px solid #c3e6cb;
|
||||
}
|
||||
.form-actions {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
flex-wrap: wrap;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.submit-btn {
|
||||
background: #ff6b6b;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 10px 20px;
|
||||
border-radius: 4px;
|
||||
font-size: 16px;
|
||||
cursor: pointer;
|
||||
transition: background 0.2s;
|
||||
}
|
||||
.submit-btn:hover:not(:disabled) {
|
||||
background: #ff5252;
|
||||
}
|
||||
.submit-btn:disabled {
|
||||
background: #6c757d;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.json-btn {
|
||||
background: #17a2b8;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 10px 20px;
|
||||
border-radius: 4px;
|
||||
font-size: 16px;
|
||||
cursor: pointer;
|
||||
transition: background 0.2s;
|
||||
}
|
||||
.json-btn:hover:not(:disabled) {
|
||||
background: #138496;
|
||||
}
|
||||
.delete-btn {
|
||||
background: #dc3545;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 10px 20px;
|
||||
border-radius: 4px;
|
||||
font-size: 16px;
|
||||
cursor: pointer;
|
||||
transition: background 0.2s;
|
||||
}
|
||||
.delete-btn:hover:not(:disabled) {
|
||||
background: #c82333;
|
||||
}
|
||||
.json-preview {
|
||||
margin-top: 20px;
|
||||
padding: 15px;
|
||||
background: #f8f9fa;
|
||||
border: 1px solid #dee2e6;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.json-preview h3 {
|
||||
margin-top: 0;
|
||||
color: #495057;
|
||||
}
|
||||
.json-preview pre {
|
||||
background: #e9ecef;
|
||||
padding: 10px;
|
||||
border-radius: 4px;
|
||||
overflow-x: auto;
|
||||
font-size: 12px;
|
||||
margin: 0;
|
||||
}
|
||||
.last-record {
|
||||
margin-top: 20px;
|
||||
padding: 15px;
|
||||
background: #e7f3ff;
|
||||
border: 1px solid #b3d9ff;
|
||||
border-radius: 4px;
|
||||
}
|
||||
.last-record h3 {
|
||||
margin-top: 0;
|
||||
color: #0066cc;
|
||||
}
|
||||
.record-info p {
|
||||
margin: 5px 0;
|
||||
font-family: monospace;
|
||||
font-size: 14px;
|
||||
}
|
||||
`}</style>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
@@ -1,115 +0,0 @@
|
||||
import React, { useState } from 'react'
|
||||
import { atproto } from '../api/atproto.js'
|
||||
import { getPdsFromHandle, getApiConfig } from '../utils/pds.js'
|
||||
|
||||
export default function UserLookup() {
|
||||
const [handleInput, setHandleInput] = useState('')
|
||||
const [userInfo, setUserInfo] = useState(null)
|
||||
const [loading, setLoading] = useState(false)
|
||||
|
||||
const handleSubmit = async (e) => {
|
||||
e.preventDefault()
|
||||
if (!handleInput.trim() || loading) return
|
||||
|
||||
setLoading(true)
|
||||
try {
|
||||
const userPds = await getPdsFromHandle(handleInput)
|
||||
const apiConfig = getApiConfig(userPds)
|
||||
const did = await atproto.getDid(userPds.replace('https://', ''), handleInput)
|
||||
const profile = await atproto.getProfile(apiConfig.bsky, did)
|
||||
|
||||
setUserInfo({
|
||||
handle: handleInput,
|
||||
pds: userPds,
|
||||
did,
|
||||
profile,
|
||||
config: apiConfig
|
||||
})
|
||||
} catch (error) {
|
||||
console.error('User lookup failed:', error)
|
||||
setUserInfo({ error: error.message })
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<section className="user-lookup">
|
||||
<h3>ユーザー検索</h3>
|
||||
<form onSubmit={handleSubmit}>
|
||||
<input
|
||||
type="text"
|
||||
value={handleInput}
|
||||
onChange={(e) => setHandleInput(e.target.value)}
|
||||
placeholder="Enter handle (e.g. syui.syui.ai)"
|
||||
disabled={loading}
|
||||
className="search-input"
|
||||
/>
|
||||
<button
|
||||
type="submit"
|
||||
disabled={loading || !handleInput.trim()}
|
||||
className="search-btn"
|
||||
>
|
||||
{loading ? '検索中...' : '検索'}
|
||||
</button>
|
||||
</form>
|
||||
|
||||
{userInfo && (
|
||||
<div className="user-result">
|
||||
<h4>ユーザー情報:</h4>
|
||||
{userInfo.error ? (
|
||||
<div className="error">エラー: {userInfo.error}</div>
|
||||
) : (
|
||||
<div className="user-details">
|
||||
<div>Handle: {userInfo.handle}</div>
|
||||
<div>PDS: {userInfo.pds}</div>
|
||||
<div>DID: {userInfo.did}</div>
|
||||
<div>Display Name: {userInfo.profile?.displayName}</div>
|
||||
<div>PDS API: {userInfo.config?.pds}</div>
|
||||
<div>Bsky API: {userInfo.config?.bsky}</div>
|
||||
<div>Web: {userInfo.config?.web}</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
|
||||
<style jsx>{`
|
||||
.user-lookup {
|
||||
margin: 20px 0;
|
||||
}
|
||||
.search-input {
|
||||
width: 200px;
|
||||
margin-right: 10px;
|
||||
padding: 5px;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 3px;
|
||||
}
|
||||
.search-btn {
|
||||
padding: 5px 10px;
|
||||
background: #28a745;
|
||||
color: white;
|
||||
border: none;
|
||||
border-radius: 3px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.search-btn:disabled {
|
||||
background: #ccc;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
.user-result {
|
||||
margin-top: 15px;
|
||||
padding: 10px;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 5px;
|
||||
background: #f9f9f9;
|
||||
}
|
||||
.error {
|
||||
color: #dc3545;
|
||||
}
|
||||
.user-details div {
|
||||
margin: 5px 0;
|
||||
}
|
||||
`}</style>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
@@ -1,17 +0,0 @@
|
||||
// Environment configuration
|
||||
export const env = {
|
||||
admin: import.meta.env.VITE_ADMIN,
|
||||
pds: import.meta.env.VITE_PDS,
|
||||
collection: import.meta.env.VITE_COLLECTION,
|
||||
handleList: (() => {
|
||||
try {
|
||||
return JSON.parse(import.meta.env.VITE_HANDLE_LIST || '[]')
|
||||
} catch {
|
||||
return []
|
||||
}
|
||||
})(),
|
||||
oauth: {
|
||||
clientId: import.meta.env.VITE_OAUTH_CLIENT_ID,
|
||||
redirectUri: import.meta.env.VITE_OAUTH_REDIRECT_URI
|
||||
}
|
||||
}
|
||||
@@ -1,135 +0,0 @@
|
||||
import { useState, useEffect } from 'react'
|
||||
import { atproto, collections } from '../api/atproto.js'
|
||||
import { getApiConfig } from '../utils/pds.js'
|
||||
import { env } from '../config/env.js'
|
||||
import { getErrorMessage } from '../utils/errorHandler.js'
|
||||
|
||||
export function useAdminData() {
|
||||
const [adminData, setAdminData] = useState({
|
||||
did: '',
|
||||
profile: null,
|
||||
records: [],
|
||||
apiConfig: null
|
||||
})
|
||||
const [langRecords, setLangRecords] = useState([])
|
||||
const [commentRecords, setCommentRecords] = useState([])
|
||||
const [chatRecords, setChatRecords] = useState([])
|
||||
const [loading, setLoading] = useState(true)
|
||||
const [error, setError] = useState(null)
|
||||
|
||||
useEffect(() => {
|
||||
loadAdminData()
|
||||
}, [])
|
||||
|
||||
const loadAdminData = async () => {
|
||||
try {
|
||||
setLoading(true)
|
||||
setError(null)
|
||||
|
||||
const apiConfig = getApiConfig(`https://${env.pds}`)
|
||||
const did = await atproto.getDid(env.pds, env.admin)
|
||||
const profile = await atproto.getProfile(apiConfig.bsky, did)
|
||||
|
||||
// Load all data in parallel
|
||||
const [records, lang, comment, chat] = await Promise.all([
|
||||
collections.getBase(apiConfig.pds, did, env.collection),
|
||||
collections.getLang(apiConfig.pds, did, env.collection),
|
||||
collections.getComment(apiConfig.pds, did, env.collection),
|
||||
collections.getChat(apiConfig.pds, did, env.collection)
|
||||
])
|
||||
|
||||
// Profile records are in the main collection, not separate profile collection
|
||||
const profileRecords = records.filter(record => record.value.type === 'profile')
|
||||
|
||||
// Create profile map for enhanced author information
|
||||
const profileMap = new Map()
|
||||
profileRecords.forEach(record => {
|
||||
if (record.value.type === 'profile') {
|
||||
profileMap.set(record.value.author?.did, record.value.author)
|
||||
}
|
||||
})
|
||||
|
||||
// Get user profile from profile collection (syui.syui.ai)
|
||||
const userProfile = profileRecords.find(record =>
|
||||
record.value.type === 'profile' && record.value.author?.handle === 'syui.syui.ai'
|
||||
)?.value.author
|
||||
|
||||
// Get AI profile from admin account (ai.syui.ai)
|
||||
const aiProfile = {
|
||||
did: did,
|
||||
handle: env.admin,
|
||||
displayName: profile.displayName || "ai",
|
||||
avatar: profile.avatar || `https://bsky.syu.is/img/avatar/plain/${did}/default@jpeg`
|
||||
}
|
||||
|
||||
// Process chat records into question-answer pairs
|
||||
const chatPairs = []
|
||||
const recordMap = new Map()
|
||||
|
||||
// First pass: organize records by base rkey
|
||||
chat.forEach(record => {
|
||||
const rkey = record.uri.split('/').pop()
|
||||
const baseRkey = rkey.replace('-answer', '')
|
||||
|
||||
if (!recordMap.has(baseRkey)) {
|
||||
recordMap.set(baseRkey, { question: null, answer: null })
|
||||
}
|
||||
|
||||
// Override author information based on record type
|
||||
if (record.value.type === 'question' && userProfile) {
|
||||
// Questions should show user profile (syui.syui.ai)
|
||||
record.value.author = userProfile
|
||||
} else if (record.value.type === 'answer') {
|
||||
// Answers should show AI profile (ai.syui.ai)
|
||||
record.value.author = aiProfile
|
||||
}
|
||||
|
||||
if (record.value.type === 'question') {
|
||||
recordMap.get(baseRkey).question = record
|
||||
} else if (record.value.type === 'answer') {
|
||||
recordMap.get(baseRkey).answer = record
|
||||
}
|
||||
})
|
||||
|
||||
// Second pass: create chat pairs
|
||||
recordMap.forEach((pair, rkey) => {
|
||||
if (pair.question) {
|
||||
chatPairs.push({
|
||||
rkey,
|
||||
question: pair.question,
|
||||
answer: pair.answer,
|
||||
createdAt: pair.question.value.createdAt
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
// Sort by creation time (oldest first for conversation flow)
|
||||
chatPairs.sort((a, b) => new Date(a.createdAt) - new Date(b.createdAt))
|
||||
|
||||
console.log('useAdminData: raw chat records:', chat.length)
|
||||
console.log('useAdminData: processed chat pairs:', chatPairs.length, chatPairs)
|
||||
console.log('useAdminData: profile map:', profileMap)
|
||||
console.log('useAdminData: profile records:', profileRecords)
|
||||
|
||||
setAdminData({ did, profile, records, apiConfig })
|
||||
setLangRecords(lang)
|
||||
setCommentRecords(comment)
|
||||
setChatRecords(chatPairs)
|
||||
} catch (err) {
|
||||
// Silently fail - no error logging or retry attempts
|
||||
setError('silent_failure')
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
adminData,
|
||||
langRecords,
|
||||
commentRecords,
|
||||
chatRecords,
|
||||
loading,
|
||||
error,
|
||||
refresh: loadAdminData
|
||||
}
|
||||
}
|
||||
@@ -1,230 +0,0 @@
|
||||
import { useState } from 'react'
|
||||
import { atproto, collections } from '../api/atproto.js'
|
||||
import { env } from '../config/env.js'
|
||||
import { logger } from '../utils/logger.js'
|
||||
import { getErrorMessage, logError } from '../utils/errorHandler.js'
|
||||
import { AIProviderFactory } from '../services/aiProvider.js'
|
||||
|
||||
export function useAskAI(adminData, userProfile, agent) {
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [error, setError] = useState(null)
|
||||
const [chatHistory, setChatHistory] = useState([])
|
||||
|
||||
// AIプロバイダーを環境変数から作成
|
||||
const aiProvider = AIProviderFactory.createFromEnv()
|
||||
|
||||
const askQuestion = async (question) => {
|
||||
if (!question.trim()) return
|
||||
|
||||
setLoading(true)
|
||||
setError(null)
|
||||
|
||||
try {
|
||||
logger.log('Sending question to AI provider:', question)
|
||||
|
||||
// AIプロバイダーに質問を送信
|
||||
const aiResponse = await aiProvider.ask(question, {
|
||||
userProfile: userProfile
|
||||
})
|
||||
|
||||
logger.log('Received AI response:', aiResponse)
|
||||
|
||||
// AI回答をチャット履歴に追加
|
||||
const chatEntry = {
|
||||
id: `chat-${Date.now()}`,
|
||||
question: question.trim(),
|
||||
answer: aiResponse.answer || 'エラーが発生しました',
|
||||
timestamp: new Date().toISOString(),
|
||||
user: userProfile ? {
|
||||
did: userProfile.did,
|
||||
handle: userProfile.handle,
|
||||
displayName: userProfile.displayName,
|
||||
avatar: userProfile.avatar
|
||||
} : null
|
||||
}
|
||||
|
||||
setChatHistory(prev => [...prev, chatEntry])
|
||||
|
||||
// atprotoにレコードを保存
|
||||
await saveChatRecord(chatEntry, aiResponse)
|
||||
|
||||
// Dispatch event for blog communication
|
||||
window.dispatchEvent(new CustomEvent('aiResponseReceived', {
|
||||
detail: {
|
||||
question: chatEntry.question,
|
||||
answer: chatEntry.answer,
|
||||
timestamp: chatEntry.timestamp,
|
||||
aiProfile: adminData?.profile ? {
|
||||
did: adminData.did,
|
||||
handle: adminData.profile.handle,
|
||||
displayName: adminData.profile.displayName,
|
||||
avatar: adminData.profile.avatar
|
||||
} : null
|
||||
}
|
||||
}))
|
||||
|
||||
return aiResponse
|
||||
|
||||
} catch (err) {
|
||||
logError(err, 'useAskAI.askQuestion')
|
||||
|
||||
let errorMessage = 'AI応答の生成に失敗しました'
|
||||
if (err.message.includes('Request timeout')) {
|
||||
errorMessage = 'AI応答がタイムアウトしました'
|
||||
} else if (err.message.includes('API error')) {
|
||||
errorMessage = `API エラー: ${err.message}`
|
||||
} else if (err.message.includes('Failed to fetch')) {
|
||||
errorMessage = 'AI サーバーに接続できませんでした'
|
||||
}
|
||||
|
||||
setError(errorMessage)
|
||||
throw err
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
const saveChatRecord = async (chatEntry, aiResponse) => {
|
||||
if (!agent || !adminData?.did) {
|
||||
logger.warn('Cannot save chat record: missing agent or admin data')
|
||||
return
|
||||
}
|
||||
|
||||
try {
|
||||
const currentUrl = window.location.href
|
||||
const timestamp = chatEntry.timestamp
|
||||
const baseRkey = `${new Date(timestamp).toISOString().replace(/[:.]/g, '-').slice(0, -5)}Z`
|
||||
|
||||
// Post metadata (共通)
|
||||
const postMetadata = {
|
||||
url: currentUrl,
|
||||
date: timestamp,
|
||||
slug: new URL(currentUrl).pathname.split('/').pop()?.replace(/\.html$/, '') || '',
|
||||
tags: [],
|
||||
title: document.title || 'AI Chat',
|
||||
language: 'ja'
|
||||
}
|
||||
|
||||
// Question record (ユーザーの質問)
|
||||
const questionRecord = {
|
||||
repo: adminData.did,
|
||||
collection: `${env.collection}.chat`,
|
||||
rkey: baseRkey,
|
||||
record: {
|
||||
$type: `${env.collection}.chat`,
|
||||
post: postMetadata,
|
||||
text: chatEntry.question,
|
||||
type: 'question',
|
||||
author: chatEntry.user ? {
|
||||
did: chatEntry.user.did,
|
||||
handle: chatEntry.user.handle,
|
||||
displayName: chatEntry.user.displayName,
|
||||
avatar: chatEntry.user.avatar
|
||||
} : {
|
||||
did: 'unknown',
|
||||
handle: 'user',
|
||||
displayName: 'User',
|
||||
avatar: null
|
||||
},
|
||||
createdAt: timestamp
|
||||
}
|
||||
}
|
||||
|
||||
// Answer record (AIの回答)
|
||||
const answerRecord = {
|
||||
repo: adminData.did,
|
||||
collection: `${env.collection}.chat`,
|
||||
rkey: `${baseRkey}-answer`,
|
||||
record: {
|
||||
$type: `${env.collection}.chat`,
|
||||
post: postMetadata,
|
||||
text: chatEntry.answer,
|
||||
type: 'answer',
|
||||
author: {
|
||||
did: adminData.did,
|
||||
handle: adminData.profile?.handle || 'ai',
|
||||
displayName: adminData.profile?.displayName || 'ai',
|
||||
avatar: adminData.profile?.avatar || null
|
||||
},
|
||||
createdAt: timestamp
|
||||
}
|
||||
}
|
||||
|
||||
logger.log('Saving question record to atproto:', questionRecord)
|
||||
await atproto.putRecord(null, questionRecord, agent)
|
||||
|
||||
logger.log('Saving answer record to atproto:', answerRecord)
|
||||
await atproto.putRecord(null, answerRecord, agent)
|
||||
|
||||
// キャッシュを無効化
|
||||
collections.invalidateCache(env.collection)
|
||||
|
||||
logger.log('Chat records saved successfully')
|
||||
|
||||
} catch (err) {
|
||||
logError(err, 'useAskAI.saveChatRecord')
|
||||
// 保存エラーは致命的ではないので、UIエラーにはしない
|
||||
}
|
||||
}
|
||||
|
||||
const clearChatHistory = () => {
|
||||
setChatHistory([])
|
||||
setError(null)
|
||||
}
|
||||
|
||||
const loadChatHistory = async () => {
|
||||
if (!adminData?.did) return
|
||||
|
||||
try {
|
||||
const records = await collections.getChat(
|
||||
adminData.apiConfig.pds,
|
||||
adminData.did,
|
||||
env.collection
|
||||
)
|
||||
|
||||
// Group records by timestamp and create Q&A pairs
|
||||
const recordGroups = {}
|
||||
|
||||
records.forEach(record => {
|
||||
const timestamp = record.value.createdAt
|
||||
const baseKey = timestamp.replace('-answer', '')
|
||||
|
||||
if (!recordGroups[baseKey]) {
|
||||
recordGroups[baseKey] = {}
|
||||
}
|
||||
|
||||
if (record.value.type === 'question') {
|
||||
recordGroups[baseKey].question = record.value.text
|
||||
recordGroups[baseKey].user = record.value.author
|
||||
recordGroups[baseKey].timestamp = timestamp
|
||||
recordGroups[baseKey].id = record.uri
|
||||
} else if (record.value.type === 'answer') {
|
||||
recordGroups[baseKey].answer = record.value.text
|
||||
recordGroups[baseKey].timestamp = timestamp
|
||||
}
|
||||
})
|
||||
|
||||
// Convert to history format, only include complete Q&A pairs
|
||||
const history = Object.values(recordGroups)
|
||||
.filter(group => group.question && group.answer)
|
||||
.sort((a, b) => new Date(a.timestamp) - new Date(b.timestamp))
|
||||
.slice(-10) // 最新10件のみ
|
||||
|
||||
setChatHistory(history)
|
||||
logger.log('Chat history loaded:', history.length, 'entries')
|
||||
|
||||
} catch (err) {
|
||||
logError(err, 'useAskAI.loadChatHistory')
|
||||
// 履歴読み込みエラーは致命的ではない
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
askQuestion,
|
||||
loading,
|
||||
error,
|
||||
chatHistory,
|
||||
clearChatHistory,
|
||||
loadChatHistory
|
||||
}
|
||||
}
|
||||
@@ -1,80 +0,0 @@
|
||||
import { useState, useEffect } from 'react'
|
||||
import { OAuthService } from '../services/oauth.js'
|
||||
|
||||
const oauthService = new OAuthService()
|
||||
|
||||
export function useAuth() {
|
||||
const [user, setUser] = useState(null)
|
||||
const [agent, setAgent] = useState(null)
|
||||
const [loading, setLoading] = useState(true)
|
||||
|
||||
useEffect(() => {
|
||||
initAuth()
|
||||
}, [])
|
||||
|
||||
const initAuth = async () => {
|
||||
try {
|
||||
const authResult = await oauthService.checkAuth()
|
||||
if (authResult) {
|
||||
setUser(authResult.user)
|
||||
setAgent(authResult.agent)
|
||||
|
||||
// If we're on callback page and authentication succeeded, notify parent
|
||||
if (window.location.pathname === '/oauth/callback') {
|
||||
console.log('OAuth callback completed, notifying parent window')
|
||||
|
||||
// Get referrer or use stored return URL
|
||||
const returnUrl = sessionStorage.getItem('oauth_return_url') ||
|
||||
document.referrer ||
|
||||
window.location.origin
|
||||
|
||||
sessionStorage.removeItem('oauth_return_url')
|
||||
|
||||
// Notify parent window if in iframe, otherwise redirect directly
|
||||
if (window.parent !== window) {
|
||||
window.parent.postMessage({
|
||||
type: 'oauth_success',
|
||||
returnUrl: returnUrl,
|
||||
user: authResult.user
|
||||
}, '*')
|
||||
} else {
|
||||
// Set flag to skip loading screen after redirect
|
||||
sessionStorage.setItem('oauth_just_completed', 'true')
|
||||
// Direct redirect
|
||||
setTimeout(() => {
|
||||
window.location.href = returnUrl
|
||||
}, 1000)
|
||||
}
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Auth initialization failed:', error)
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
const login = async (handle) => {
|
||||
// Store current page URL for post-auth redirect
|
||||
if (window.location.pathname !== '/oauth/callback') {
|
||||
sessionStorage.setItem('oauth_return_url', window.location.href)
|
||||
}
|
||||
|
||||
await oauthService.login(handle)
|
||||
}
|
||||
|
||||
const logout = async () => {
|
||||
await oauthService.logout()
|
||||
setUser(null)
|
||||
setAgent(null)
|
||||
}
|
||||
|
||||
return {
|
||||
user,
|
||||
agent,
|
||||
loading,
|
||||
login,
|
||||
logout,
|
||||
isAuthenticated: !!user
|
||||
}
|
||||
}
|
||||
@@ -1,33 +0,0 @@
|
||||
import { useState, useEffect } from 'react'
|
||||
|
||||
export function usePageContext() {
|
||||
const [pageContext, setPageContext] = useState({
|
||||
isTopPage: true,
|
||||
rkey: null,
|
||||
url: null
|
||||
})
|
||||
|
||||
useEffect(() => {
|
||||
const pathname = window.location.pathname
|
||||
const url = window.location.href
|
||||
|
||||
// Extract rkey from URL pattern: /posts/xxx or /posts/xxx.html
|
||||
const match = pathname.match(/\/posts\/([^/]+)\/?$/)
|
||||
if (match) {
|
||||
const rkey = match[1].replace(/\.html$/, '')
|
||||
setPageContext({
|
||||
isTopPage: false,
|
||||
rkey,
|
||||
url
|
||||
})
|
||||
} else {
|
||||
setPageContext({
|
||||
isTopPage: true,
|
||||
rkey: null,
|
||||
url
|
||||
})
|
||||
}
|
||||
}, [])
|
||||
|
||||
return pageContext
|
||||
}
|
||||
@@ -1,215 +0,0 @@
|
||||
import { useState, useEffect } from 'react'
|
||||
import { atproto, collections } from '../api/atproto.js'
|
||||
import { getApiConfig, isSyuIsHandle, getPdsFromHandle } from '../utils/pds.js'
|
||||
import { env } from '../config/env.js'
|
||||
|
||||
export function useUserData(adminData) {
|
||||
const [userComments, setUserComments] = useState([])
|
||||
const [chatRecords, setChatRecords] = useState([])
|
||||
const [loading, setLoading] = useState(false)
|
||||
const [error, setError] = useState(null)
|
||||
|
||||
useEffect(() => {
|
||||
if (!adminData?.did || !adminData?.apiConfig) return
|
||||
|
||||
const fetchUserData = async () => {
|
||||
setLoading(true)
|
||||
setError(null)
|
||||
|
||||
try {
|
||||
// 1. Get user list from admin account
|
||||
const userListRecords = await collections.getUserList(
|
||||
adminData.apiConfig.pds,
|
||||
adminData.did,
|
||||
env.collection
|
||||
)
|
||||
|
||||
// 2. Get chat records from ai.syui.log.chat and process into pairs
|
||||
const chatRecords = await collections.getChat(
|
||||
adminData.apiConfig.pds,
|
||||
adminData.did,
|
||||
env.collection
|
||||
)
|
||||
|
||||
console.log('useUserData: raw chatRecords:', chatRecords.length, chatRecords)
|
||||
|
||||
// Process chat records into question-answer pairs
|
||||
const chatPairs = []
|
||||
const recordMap = new Map()
|
||||
|
||||
// First pass: organize records by base rkey
|
||||
chatRecords.forEach(record => {
|
||||
const rkey = record.uri.split('/').pop()
|
||||
const baseRkey = rkey.replace('-answer', '')
|
||||
|
||||
if (!recordMap.has(baseRkey)) {
|
||||
recordMap.set(baseRkey, { question: null, answer: null })
|
||||
}
|
||||
|
||||
if (record.value.type === 'question') {
|
||||
recordMap.get(baseRkey).question = record
|
||||
} else if (record.value.type === 'answer') {
|
||||
recordMap.get(baseRkey).answer = record
|
||||
}
|
||||
})
|
||||
|
||||
// Second pass: create chat pairs
|
||||
recordMap.forEach((pair, rkey) => {
|
||||
if (pair.question) {
|
||||
chatPairs.push({
|
||||
rkey,
|
||||
question: pair.question,
|
||||
answer: pair.answer,
|
||||
createdAt: pair.question.value.createdAt
|
||||
})
|
||||
}
|
||||
})
|
||||
|
||||
// Sort by creation time (newest first)
|
||||
chatPairs.sort((a, b) => new Date(b.createdAt) - new Date(a.createdAt))
|
||||
|
||||
console.log('useUserData: processed chatPairs:', chatPairs.length, chatPairs)
|
||||
setChatRecords(chatPairs)
|
||||
|
||||
// 3. Get base collection records which contain user comments
|
||||
const baseRecords = await collections.getBase(
|
||||
adminData.apiConfig.pds,
|
||||
adminData.did,
|
||||
env.collection
|
||||
)
|
||||
|
||||
// Extract comments from base records
|
||||
const allUserComments = []
|
||||
|
||||
for (const record of baseRecords) {
|
||||
if (record.value?.comments && Array.isArray(record.value.comments)) {
|
||||
// Each comment already has author info, so we can use it directly
|
||||
const commentsWithMeta = record.value.comments.map(comment => ({
|
||||
uri: record.uri,
|
||||
cid: record.cid,
|
||||
value: {
|
||||
...comment,
|
||||
post: {
|
||||
url: record.value.url
|
||||
}
|
||||
}
|
||||
}))
|
||||
allUserComments.push(...commentsWithMeta)
|
||||
}
|
||||
}
|
||||
|
||||
// Also try to get individual user records from the user list
|
||||
// Currently skipping user list processing since users contain placeholder DIDs
|
||||
if (userListRecords.length > 0 && userListRecords[0].value?.users) {
|
||||
console.log('User list found, but skipping placeholder users for now')
|
||||
|
||||
// Filter out placeholder users
|
||||
const realUsers = userListRecords[0].value.users.filter(user =>
|
||||
user.handle &&
|
||||
user.did &&
|
||||
!user.did.includes('placeholder') &&
|
||||
!user.did.includes('example')
|
||||
)
|
||||
|
||||
if (realUsers.length > 0) {
|
||||
console.log(`Processing ${realUsers.length} real users`)
|
||||
|
||||
for (const user of realUsers) {
|
||||
const userHandle = user.handle
|
||||
|
||||
try {
|
||||
// Get user's DID and PDS using PDS detection logic
|
||||
let userDid, userPds, userApiConfig
|
||||
|
||||
if (user.did && user.pds) {
|
||||
// Use DID and PDS from user record
|
||||
userDid = user.did
|
||||
userPds = user.pds.replace('https://', '')
|
||||
userApiConfig = getApiConfig(userPds)
|
||||
} else {
|
||||
// Always get actual PDS from describeRepo first
|
||||
try {
|
||||
// Try bsky.social first for most handles
|
||||
const bskyPds = 'bsky.social'
|
||||
userDid = await atproto.getDid(bskyPds, userHandle)
|
||||
|
||||
// Get the actual PDS endpoint from DID
|
||||
const realPds = await getPdsFromHandle(userHandle)
|
||||
userPds = realPds.replace('https://', '')
|
||||
userApiConfig = getApiConfig(realPds)
|
||||
} catch (error) {
|
||||
// Fallback to syu.is if bsky.social fails
|
||||
console.warn(`Failed to get PDS for ${userHandle} from bsky.social, trying syu.is:`, error)
|
||||
userPds = env.pds
|
||||
userApiConfig = getApiConfig(env.pds)
|
||||
userDid = await atproto.getDid(userPds, userHandle)
|
||||
}
|
||||
}
|
||||
|
||||
// Get user's own ai.syui.log records
|
||||
const userRecords = await collections.getUserComments(
|
||||
userApiConfig.pds,
|
||||
userDid,
|
||||
env.collection
|
||||
)
|
||||
|
||||
// Skip if no records found
|
||||
if (!userRecords || userRecords.length === 0) {
|
||||
continue
|
||||
}
|
||||
|
||||
// Get user's profile for enrichment
|
||||
let profile = null
|
||||
try {
|
||||
profile = await atproto.getProfile(userApiConfig.bsky, userDid)
|
||||
} catch (profileError) {
|
||||
console.warn(`Failed to get profile for ${userHandle}:`, profileError)
|
||||
}
|
||||
|
||||
// Add profile info to each record
|
||||
const enrichedRecords = userRecords.map(record => ({
|
||||
...record,
|
||||
value: {
|
||||
...record.value,
|
||||
author: {
|
||||
did: userDid,
|
||||
handle: profile?.data?.handle || userHandle,
|
||||
displayName: profile?.data?.displayName || userHandle,
|
||||
avatar: profile?.data?.avatar || null
|
||||
}
|
||||
}
|
||||
}))
|
||||
|
||||
allUserComments.push(...enrichedRecords)
|
||||
} catch (userError) {
|
||||
console.warn(`Failed to fetch data for user ${userHandle}:`, userError)
|
||||
}
|
||||
}
|
||||
} else {
|
||||
console.log('No real users found in user list - all appear to be placeholders')
|
||||
}
|
||||
}
|
||||
|
||||
setUserComments(allUserComments)
|
||||
} catch (err) {
|
||||
setError(err.message)
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
fetchUserData()
|
||||
}, [adminData])
|
||||
|
||||
const refresh = () => {
|
||||
if (adminData?.did && adminData?.apiConfig) {
|
||||
// Re-trigger the effect by clearing and re-setting adminData
|
||||
const currentAdminData = adminData
|
||||
setUserComments([])
|
||||
setChatRecords([])
|
||||
// The useEffect will automatically run again
|
||||
}
|
||||
}
|
||||
|
||||
return { userComments, chatRecords, loading, error, refresh }
|
||||
}
|
||||
@@ -1,10 +0,0 @@
|
||||
import React from 'react'
|
||||
import ReactDOM from 'react-dom/client'
|
||||
import App from './App'
|
||||
import './App.css'
|
||||
|
||||
// Only mount the AI conversation app if the target element exists
|
||||
const targetElement = document.getElementById('ai-conversation-atproto')
|
||||
if (targetElement) {
|
||||
ReactDOM.createRoot(targetElement).render(<App />)
|
||||
}
|
||||
@@ -1,214 +0,0 @@
|
||||
/**
|
||||
* AI Provider Abstract Interface
|
||||
* Supports multiple AI backends (Ollama, Claude, etc.)
|
||||
*/
|
||||
|
||||
export class AIProvider {
|
||||
constructor(config) {
|
||||
this.config = config
|
||||
}
|
||||
|
||||
/**
|
||||
* Send a question to the AI and get a response
|
||||
* @param {string} question - User's question
|
||||
* @param {Object} context - Additional context (user info, etc.)
|
||||
* @returns {Promise<{answer: string}>}
|
||||
*/
|
||||
async ask(question, context = {}) {
|
||||
throw new Error('ask() method must be implemented by subclass')
|
||||
}
|
||||
|
||||
/**
|
||||
* Check if the provider is available
|
||||
* @returns {Promise<boolean>}
|
||||
*/
|
||||
async healthCheck() {
|
||||
throw new Error('healthCheck() method must be implemented by subclass')
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Ollama Provider Implementation
|
||||
*/
|
||||
export class OllamaProvider extends AIProvider {
|
||||
constructor(config) {
|
||||
super(config)
|
||||
this.host = config.host || 'https://ollama.syui.ai'
|
||||
this.model = config.model || 'gemma3:1b'
|
||||
this.systemPrompt = config.systemPrompt || ''
|
||||
}
|
||||
|
||||
async ask(question, context = {}) {
|
||||
// Build enhanced prompt with user context
|
||||
const userInfo = context.userProfile
|
||||
? `相手の名前は${context.userProfile.displayName || context.userProfile.handle}です。`
|
||||
: ''
|
||||
const enhancedSystemPrompt = `${this.systemPrompt} ${userInfo}`
|
||||
|
||||
const prompt = `${enhancedSystemPrompt}
|
||||
|
||||
Question: ${question}
|
||||
|
||||
Answer:`
|
||||
|
||||
const controller = new AbortController()
|
||||
const timeoutId = setTimeout(() => controller.abort(), 30000)
|
||||
|
||||
try {
|
||||
const response = await fetch(`${this.host}/api/generate`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'Origin': 'https://syui.ai',
|
||||
},
|
||||
body: JSON.stringify({
|
||||
model: this.model,
|
||||
prompt: prompt,
|
||||
stream: false,
|
||||
options: {
|
||||
temperature: 0.9,
|
||||
top_p: 0.9,
|
||||
num_predict: 200,
|
||||
repeat_penalty: 1.1,
|
||||
}
|
||||
}),
|
||||
signal: controller.signal
|
||||
})
|
||||
|
||||
clearTimeout(timeoutId)
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error(`Ollama API error: ${response.status}`)
|
||||
}
|
||||
|
||||
const data = await response.json()
|
||||
return { answer: data.response || 'エラーが発生しました' }
|
||||
|
||||
} catch (error) {
|
||||
clearTimeout(timeoutId)
|
||||
if (error.name === 'AbortError') {
|
||||
throw new Error('Request timeout')
|
||||
}
|
||||
throw error
|
||||
}
|
||||
}
|
||||
|
||||
async healthCheck() {
|
||||
try {
|
||||
const response = await fetch(`${this.host}/api/tags`, {
|
||||
method: 'GET',
|
||||
headers: {
|
||||
'Origin': 'https://syui.ai',
|
||||
}
|
||||
})
|
||||
return response.ok
|
||||
} catch {
|
||||
return false
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Claude MCP Server Provider Implementation
|
||||
*/
|
||||
export class ClaudeMCPProvider extends AIProvider {
|
||||
constructor(config) {
|
||||
super(config)
|
||||
this.endpoint = config.endpoint || 'https://your-server.com/api/claude-mcp'
|
||||
this.apiKey = config.apiKey // Server-side auth token
|
||||
this.systemPrompt = config.systemPrompt || ''
|
||||
}
|
||||
|
||||
async ask(question, context = {}) {
|
||||
const userInfo = context.userProfile
|
||||
? `相手の名前は${context.userProfile.displayName || context.userProfile.handle}です。`
|
||||
: ''
|
||||
const enhancedSystemPrompt = `${this.systemPrompt} ${userInfo}`
|
||||
|
||||
const controller = new AbortController()
|
||||
const timeoutId = setTimeout(() => controller.abort(), 45000) // Longer timeout for Claude
|
||||
|
||||
try {
|
||||
const response = await fetch(this.endpoint, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
'Authorization': `Bearer ${this.apiKey}`,
|
||||
},
|
||||
body: JSON.stringify({
|
||||
question: question,
|
||||
systemPrompt: enhancedSystemPrompt,
|
||||
context: context
|
||||
}),
|
||||
signal: controller.signal
|
||||
})
|
||||
|
||||
clearTimeout(timeoutId)
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error(`Claude MCP error: ${response.status}`)
|
||||
}
|
||||
|
||||
const data = await response.json()
|
||||
return { answer: data.answer || 'エラーが発生しました' }
|
||||
|
||||
} catch (error) {
|
||||
clearTimeout(timeoutId)
|
||||
if (error.name === 'AbortError') {
|
||||
throw new Error('Request timeout')
|
||||
}
|
||||
throw error
|
||||
}
|
||||
}
|
||||
|
||||
async healthCheck() {
|
||||
try {
|
||||
const response = await fetch(`${this.endpoint}/health`, {
|
||||
method: 'GET',
|
||||
headers: {
|
||||
'Authorization': `Bearer ${this.apiKey}`,
|
||||
}
|
||||
})
|
||||
return response.ok
|
||||
} catch {
|
||||
return false
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* AI Provider Factory
|
||||
*/
|
||||
export class AIProviderFactory {
|
||||
static create(provider, config) {
|
||||
switch (provider) {
|
||||
case 'ollama':
|
||||
return new OllamaProvider(config)
|
||||
case 'claude-mcp':
|
||||
return new ClaudeMCPProvider(config)
|
||||
default:
|
||||
throw new Error(`Unknown AI provider: ${provider}`)
|
||||
}
|
||||
}
|
||||
|
||||
static createFromEnv() {
|
||||
const provider = import.meta.env.VITE_AI_PROVIDER || 'ollama'
|
||||
|
||||
const config = {
|
||||
systemPrompt: import.meta.env.VITE_AI_SYSTEM_PROMPT || '',
|
||||
}
|
||||
|
||||
switch (provider) {
|
||||
case 'ollama':
|
||||
config.host = import.meta.env.VITE_AI_HOST
|
||||
config.model = import.meta.env.VITE_AI_MODEL
|
||||
break
|
||||
case 'claude-mcp':
|
||||
config.endpoint = import.meta.env.VITE_CLAUDE_MCP_ENDPOINT
|
||||
config.apiKey = import.meta.env.VITE_CLAUDE_MCP_API_KEY
|
||||
break
|
||||
}
|
||||
|
||||
return AIProviderFactory.create(provider, config)
|
||||
}
|
||||
}
|
||||
@@ -1,182 +0,0 @@
|
||||
import { BrowserOAuthClient } from '@atproto/oauth-client-browser'
|
||||
import { Agent } from '@atproto/api'
|
||||
import { env } from '../config/env.js'
|
||||
import { isSyuIsHandle } from '../utils/pds.js'
|
||||
|
||||
export class OAuthService {
|
||||
constructor() {
|
||||
this.clientId = env.oauth.clientId || this.getClientId()
|
||||
this.clients = { bsky: null, syu: null }
|
||||
this.agent = null
|
||||
this.sessionInfo = null
|
||||
this.initPromise = null
|
||||
}
|
||||
|
||||
getClientId() {
|
||||
const origin = window.location.origin
|
||||
return origin.includes('localhost') || origin.includes('127.0.0.1')
|
||||
? undefined // Loopback client
|
||||
: `${origin}/client-metadata.json`
|
||||
}
|
||||
|
||||
async initialize() {
|
||||
if (this.initPromise) return this.initPromise
|
||||
|
||||
this.initPromise = this._initialize()
|
||||
return this.initPromise
|
||||
}
|
||||
|
||||
async _initialize() {
|
||||
try {
|
||||
// Initialize OAuth clients
|
||||
this.clients.bsky = await BrowserOAuthClient.load({
|
||||
clientId: this.clientId,
|
||||
handleResolver: 'https://bsky.social',
|
||||
plcDirectoryUrl: 'https://plc.directory',
|
||||
})
|
||||
|
||||
this.clients.syu = await BrowserOAuthClient.load({
|
||||
clientId: this.clientId,
|
||||
handleResolver: 'https://syu.is',
|
||||
plcDirectoryUrl: 'https://plc.syu.is',
|
||||
})
|
||||
|
||||
// Try to restore session
|
||||
return await this.restoreSession()
|
||||
} catch (error) {
|
||||
console.error('OAuth initialization failed:', error)
|
||||
this.initPromise = null
|
||||
throw error
|
||||
}
|
||||
}
|
||||
|
||||
async restoreSession() {
|
||||
// Try both clients
|
||||
for (const client of [this.clients.bsky, this.clients.syu]) {
|
||||
const result = await client.init()
|
||||
if (result?.session) {
|
||||
this.agent = new Agent(result.session)
|
||||
return this.processSession(result.session)
|
||||
}
|
||||
}
|
||||
return null
|
||||
}
|
||||
|
||||
async processSession(session) {
|
||||
const did = session.sub || session.did
|
||||
let handle = session.handle || 'unknown'
|
||||
let displayName = null
|
||||
let avatar = null
|
||||
|
||||
// Create Agent directly with session (per official docs)
|
||||
try {
|
||||
this.agent = new Agent(session)
|
||||
} catch (err) {
|
||||
// Fallback to dpopFetch method
|
||||
this.agent = new Agent({
|
||||
service: session.server?.serviceEndpoint || 'https://bsky.social',
|
||||
fetch: session.dpopFetch
|
||||
})
|
||||
}
|
||||
|
||||
// Get profile information using authenticated agent
|
||||
// Skip test DIDs
|
||||
if (this.agent && did && !did.includes('test-')) {
|
||||
try {
|
||||
await new Promise(resolve => setTimeout(resolve, 300))
|
||||
const profile = await this.agent.getProfile({ actor: did })
|
||||
handle = profile.data.handle || handle
|
||||
displayName = profile.data.displayName || null
|
||||
avatar = profile.data.avatar || null
|
||||
|
||||
console.log('Profile fetched from session:', {
|
||||
did,
|
||||
handle,
|
||||
displayName,
|
||||
avatar: avatar ? 'present' : 'none'
|
||||
})
|
||||
} catch (error) {
|
||||
console.log('Failed to get profile from session:', error)
|
||||
// Keep the basic info we have
|
||||
}
|
||||
} else if (did && did.includes('test-')) {
|
||||
console.log('Skipping profile fetch for test DID:', did)
|
||||
}
|
||||
|
||||
this.sessionInfo = {
|
||||
did,
|
||||
handle,
|
||||
displayName,
|
||||
avatar
|
||||
}
|
||||
|
||||
return {
|
||||
did,
|
||||
handle,
|
||||
displayName,
|
||||
avatar
|
||||
}
|
||||
}
|
||||
|
||||
async login(handle) {
|
||||
await this.initialize()
|
||||
|
||||
const client = isSyuIsHandle(handle) ? this.clients.syu : this.clients.bsky
|
||||
const authUrl = await client.authorize(handle, {
|
||||
scope: 'atproto transition:generic'
|
||||
})
|
||||
|
||||
window.location.href = authUrl.toString()
|
||||
}
|
||||
|
||||
async checkAuth() {
|
||||
try {
|
||||
await this.initialize()
|
||||
if (this.sessionInfo) {
|
||||
return {
|
||||
user: this.sessionInfo,
|
||||
agent: this.agent
|
||||
}
|
||||
}
|
||||
return null
|
||||
} catch (error) {
|
||||
console.error('Auth check failed:', error)
|
||||
return null
|
||||
}
|
||||
}
|
||||
|
||||
async logout() {
|
||||
try {
|
||||
// Sign out from session
|
||||
if (this.clients.bsky) {
|
||||
const result = await this.clients.bsky.init()
|
||||
if (result?.session?.signOut) {
|
||||
await result.session.signOut()
|
||||
}
|
||||
}
|
||||
|
||||
// Clear state
|
||||
this.agent = null
|
||||
this.sessionInfo = null
|
||||
this.clients = { bsky: null, syu: null }
|
||||
this.initPromise = null
|
||||
|
||||
// Clear storage
|
||||
localStorage.clear()
|
||||
sessionStorage.clear()
|
||||
|
||||
// Reload page
|
||||
window.location.reload()
|
||||
} catch (error) {
|
||||
console.error('Logout failed:', error)
|
||||
}
|
||||
}
|
||||
|
||||
getAgent() {
|
||||
return this.agent
|
||||
}
|
||||
|
||||
getUser() {
|
||||
return this.sessionInfo
|
||||
}
|
||||
}
|
||||
@@ -1,206 +0,0 @@
|
||||
import React from 'react'
|
||||
import { atproto } from '../api/atproto.js'
|
||||
import { getPdsFromHandle, getApiConfig } from './pds.js'
|
||||
import { dataCache } from './cache.js'
|
||||
import { logError } from './errorHandler.js'
|
||||
|
||||
// Cache duration for avatar URLs (30 minutes)
|
||||
const AVATAR_CACHE_DURATION = 30 * 60 * 1000
|
||||
|
||||
/**
|
||||
* Avatar fetching utility with fallback mechanism
|
||||
*
|
||||
* Strategy:
|
||||
* 1. First check if avatar exists in the record
|
||||
* 2. If avatar is missing/broken, fetch fresh data from ATProto
|
||||
* 3. Cache results to avoid excessive API calls
|
||||
*/
|
||||
|
||||
/**
|
||||
* Extract avatar URL from record if available
|
||||
* @param {Object} record - The record object
|
||||
* @returns {string|null} Avatar URL or null
|
||||
*/
|
||||
function getAvatarFromRecord(record) {
|
||||
const avatar = record?.value?.author?.avatar
|
||||
if (avatar && typeof avatar === 'string' && avatar.startsWith('http')) {
|
||||
return avatar
|
||||
}
|
||||
return null
|
||||
}
|
||||
|
||||
/**
|
||||
* Fetch fresh avatar data from ATProto
|
||||
* @param {string} handle - User handle
|
||||
* @param {string} did - User DID (optional, will fetch if not provided)
|
||||
* @returns {Promise<string|null>} Avatar URL or null
|
||||
*/
|
||||
async function fetchFreshAvatar(handle, did = null) {
|
||||
try {
|
||||
// Step 1: Get PDS from handle
|
||||
const pds = await getPdsFromHandle(handle)
|
||||
const apiConfig = getApiConfig(pds)
|
||||
|
||||
// Step 2: Get DID if not provided
|
||||
if (!did) {
|
||||
const pdsHost = pds.replace(/^https?:\/\//, '')
|
||||
const repoData = await atproto.getDid(pdsHost, handle)
|
||||
did = repoData
|
||||
}
|
||||
|
||||
// Step 3: Get profile from bsky API
|
||||
const profile = await atproto.getProfile(apiConfig.bsky, did)
|
||||
|
||||
// Return avatar URL
|
||||
return profile?.avatar || null
|
||||
} catch (error) {
|
||||
logError(error, 'Avatar Fetch')
|
||||
return null
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Get avatar with intelligent fallback
|
||||
* @param {Object} options - Options object
|
||||
* @param {Object} options.record - Record object (optional)
|
||||
* @param {string} options.handle - User handle (required if no record)
|
||||
* @param {string} options.did - User DID (optional)
|
||||
* @param {boolean} options.forceFresh - Force fresh fetch even if cached
|
||||
* @returns {Promise<string|null>} Avatar URL or null
|
||||
*/
|
||||
export async function getAvatar({ record, handle, did, forceFresh = false }) {
|
||||
// Extract handle and DID from record if available
|
||||
if (record && !handle) {
|
||||
handle = record.value?.author?.handle
|
||||
did = record.value?.author?.did
|
||||
}
|
||||
|
||||
if (!handle) {
|
||||
throw new Error('Handle is required to fetch avatar')
|
||||
}
|
||||
|
||||
// Generate cache key
|
||||
const cacheKey = `avatar:${handle}`
|
||||
|
||||
// Check cache first (unless forceFresh)
|
||||
if (!forceFresh) {
|
||||
const cached = dataCache.get(cacheKey)
|
||||
if (cached) {
|
||||
return cached
|
||||
}
|
||||
}
|
||||
|
||||
// Try to get avatar from record first
|
||||
if (record) {
|
||||
const recordAvatar = getAvatarFromRecord(record)
|
||||
if (recordAvatar) {
|
||||
// Validate that the avatar URL is still accessible
|
||||
try {
|
||||
const response = await fetch(recordAvatar, { method: 'HEAD' })
|
||||
if (response.ok) {
|
||||
dataCache.set(cacheKey, recordAvatar, AVATAR_CACHE_DURATION)
|
||||
return recordAvatar
|
||||
}
|
||||
} catch {
|
||||
// Avatar URL is broken, proceed to fetch fresh
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Fetch fresh avatar data
|
||||
const freshAvatar = await fetchFreshAvatar(handle, did)
|
||||
|
||||
if (freshAvatar) {
|
||||
dataCache.set(cacheKey, freshAvatar, AVATAR_CACHE_DURATION)
|
||||
}
|
||||
|
||||
return freshAvatar
|
||||
}
|
||||
|
||||
/**
|
||||
* Batch fetch avatars for multiple users
|
||||
* @param {Array<Object>} users - Array of user objects with handle/did
|
||||
* @returns {Promise<Map>} Map of handle -> avatar URL
|
||||
*/
|
||||
export async function batchFetchAvatars(users) {
|
||||
const avatarMap = new Map()
|
||||
|
||||
// Process in parallel with concurrency limit
|
||||
const BATCH_SIZE = 5
|
||||
for (let i = 0; i < users.length; i += BATCH_SIZE) {
|
||||
const batch = users.slice(i, i + BATCH_SIZE)
|
||||
const promises = batch.map(async (user) => {
|
||||
const avatar = await getAvatar({
|
||||
handle: user.handle,
|
||||
did: user.did
|
||||
})
|
||||
return { handle: user.handle, avatar }
|
||||
})
|
||||
|
||||
const results = await Promise.all(promises)
|
||||
results.forEach(({ handle, avatar }) => {
|
||||
avatarMap.set(handle, avatar)
|
||||
})
|
||||
}
|
||||
|
||||
return avatarMap
|
||||
}
|
||||
|
||||
/**
|
||||
* Prefetch and cache avatar for a handle
|
||||
* @param {string} handle - User handle
|
||||
* @returns {Promise<void>}
|
||||
*/
|
||||
export async function prefetchAvatar(handle) {
|
||||
await getAvatar({ handle })
|
||||
}
|
||||
|
||||
/**
|
||||
* Clear avatar cache for a specific handle
|
||||
* @param {string} handle - User handle
|
||||
*/
|
||||
export function clearAvatarCache(handle) {
|
||||
if (handle) {
|
||||
dataCache.delete(`avatar:${handle}`)
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Clear all avatar caches
|
||||
*/
|
||||
export function clearAllAvatarCaches() {
|
||||
dataCache.invalidatePattern('avatar:')
|
||||
}
|
||||
|
||||
/**
|
||||
* React hook for avatar management
|
||||
* @param {Object} options - Options for avatar fetching
|
||||
* @returns {Object} { avatar, loading, error, refetch }
|
||||
*/
|
||||
export function useAvatar({ record, handle, did }) {
|
||||
const [state, setState] = React.useState({
|
||||
avatar: null,
|
||||
loading: true,
|
||||
error: null
|
||||
})
|
||||
|
||||
const fetchAvatar = React.useCallback(async (forceFresh = false) => {
|
||||
setState(prev => ({ ...prev, loading: true, error: null }))
|
||||
|
||||
try {
|
||||
const avatarUrl = await getAvatar({ record, handle, did, forceFresh })
|
||||
setState({ avatar: avatarUrl, loading: false, error: null })
|
||||
} catch (error) {
|
||||
setState({ avatar: null, loading: false, error: error.message })
|
||||
}
|
||||
}, [record, handle, did])
|
||||
|
||||
React.useEffect(() => {
|
||||
fetchAvatar()
|
||||
}, [fetchAvatar])
|
||||
|
||||
return {
|
||||
...state,
|
||||
refetch: () => fetchAvatar(true)
|
||||
}
|
||||
}
|
||||
@@ -1,262 +0,0 @@
|
||||
import { dataCache } from './cache.js'
|
||||
|
||||
/**
|
||||
* Avatar-specific cache utilities
|
||||
* Extends the base cache system with avatar-specific functionality
|
||||
*/
|
||||
|
||||
// Cache keys
|
||||
const CACHE_PREFIX = 'avatar:'
|
||||
const METADATA_KEY = 'avatar:metadata'
|
||||
|
||||
/**
|
||||
* Get cache metadata for avatars
|
||||
* @returns {Object} Metadata about avatar cache
|
||||
*/
|
||||
export function getAvatarCacheMetadata() {
|
||||
return dataCache.get(METADATA_KEY) || {
|
||||
totalCount: 0,
|
||||
lastCleanup: Date.now(),
|
||||
cacheHits: 0,
|
||||
cacheMisses: 0
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Update cache metadata
|
||||
* @param {Object} updates - Updates to apply to metadata
|
||||
*/
|
||||
function updateMetadata(updates) {
|
||||
const current = getAvatarCacheMetadata()
|
||||
const updated = { ...current, ...updates }
|
||||
dataCache.set(METADATA_KEY, updated)
|
||||
}
|
||||
|
||||
/**
|
||||
* Track cache hit
|
||||
*/
|
||||
export function trackCacheHit() {
|
||||
const metadata = getAvatarCacheMetadata()
|
||||
updateMetadata({ cacheHits: metadata.cacheHits + 1 })
|
||||
}
|
||||
|
||||
/**
|
||||
* Track cache miss
|
||||
*/
|
||||
export function trackCacheMiss() {
|
||||
const metadata = getAvatarCacheMetadata()
|
||||
updateMetadata({ cacheMisses: metadata.cacheMisses + 1 })
|
||||
}
|
||||
|
||||
/**
|
||||
* Get all cached avatar handles
|
||||
* @returns {Array<string>} List of cached handles
|
||||
*/
|
||||
export function getCachedAvatarHandles() {
|
||||
// This would require enumerating cache keys
|
||||
// For now, we'll track this in metadata
|
||||
const metadata = getAvatarCacheMetadata()
|
||||
return metadata.handles || []
|
||||
}
|
||||
|
||||
/**
|
||||
* Add handle to cached list
|
||||
* @param {string} handle - Handle to add
|
||||
*/
|
||||
export function addCachedHandle(handle) {
|
||||
const metadata = getAvatarCacheMetadata()
|
||||
const handles = metadata.handles || []
|
||||
if (!handles.includes(handle)) {
|
||||
handles.push(handle)
|
||||
updateMetadata({
|
||||
handles,
|
||||
totalCount: handles.length
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove handle from cached list
|
||||
* @param {string} handle - Handle to remove
|
||||
*/
|
||||
export function removeCachedHandle(handle) {
|
||||
const metadata = getAvatarCacheMetadata()
|
||||
const handles = (metadata.handles || []).filter(h => h !== handle)
|
||||
updateMetadata({
|
||||
handles,
|
||||
totalCount: handles.length
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* Clean up expired avatar cache entries
|
||||
* @param {number} maxAge - Maximum age in milliseconds (default: 30 minutes)
|
||||
* @returns {number} Number of entries cleaned
|
||||
*/
|
||||
export function cleanupExpiredAvatars(maxAge = 30 * 60 * 1000) {
|
||||
const now = Date.now()
|
||||
const metadata = getAvatarCacheMetadata()
|
||||
const handles = metadata.handles || []
|
||||
let cleanedCount = 0
|
||||
|
||||
handles.forEach(handle => {
|
||||
const cacheKey = `${CACHE_PREFIX}${handle}`
|
||||
const entry = dataCache.get(cacheKey, true) // Get with metadata
|
||||
|
||||
if (entry && entry.timestamp && (now - entry.timestamp) > maxAge) {
|
||||
dataCache.delete(cacheKey)
|
||||
cleanedCount++
|
||||
}
|
||||
})
|
||||
|
||||
// Update metadata
|
||||
if (cleanedCount > 0) {
|
||||
const remainingHandles = handles.filter(handle => {
|
||||
const cacheKey = `${CACHE_PREFIX}${handle}`
|
||||
return dataCache.get(cacheKey) !== null
|
||||
})
|
||||
|
||||
updateMetadata({
|
||||
handles: remainingHandles,
|
||||
totalCount: remainingHandles.length,
|
||||
lastCleanup: now
|
||||
})
|
||||
}
|
||||
|
||||
return cleanedCount
|
||||
}
|
||||
|
||||
/**
|
||||
* Get cache statistics
|
||||
* @returns {Object} Cache statistics
|
||||
*/
|
||||
export function getAvatarCacheStats() {
|
||||
const metadata = getAvatarCacheMetadata()
|
||||
const totalRequests = metadata.cacheHits + metadata.cacheMisses
|
||||
const hitRate = totalRequests > 0 ? (metadata.cacheHits / totalRequests * 100) : 0
|
||||
|
||||
return {
|
||||
totalCached: metadata.totalCount || 0,
|
||||
cacheHits: metadata.cacheHits || 0,
|
||||
cacheMisses: metadata.cacheMisses || 0,
|
||||
hitRate: Math.round(hitRate * 100) / 100,
|
||||
lastCleanup: metadata.lastCleanup ? new Date(metadata.lastCleanup) : null
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Clear all avatar cache data
|
||||
* @returns {number} Number of entries cleared
|
||||
*/
|
||||
export function clearAllAvatarCache() {
|
||||
const metadata = getAvatarCacheMetadata()
|
||||
const handles = metadata.handles || []
|
||||
|
||||
handles.forEach(handle => {
|
||||
const cacheKey = `${CACHE_PREFIX}${handle}`
|
||||
dataCache.delete(cacheKey)
|
||||
})
|
||||
|
||||
// Clear metadata
|
||||
dataCache.delete(METADATA_KEY)
|
||||
|
||||
return handles.length
|
||||
}
|
||||
|
||||
/**
|
||||
* Preload avatars for a list of handles
|
||||
* @param {Array<string>} handles - Handles to preload
|
||||
* @param {Function} getAvatar - Avatar fetching function
|
||||
* @returns {Promise<Map>} Map of handle -> avatar URL results
|
||||
*/
|
||||
export async function preloadAvatars(handles, getAvatar) {
|
||||
const results = new Map()
|
||||
const BATCH_SIZE = 3 // Smaller batch for preloading
|
||||
|
||||
for (let i = 0; i < handles.length; i += BATCH_SIZE) {
|
||||
const batch = handles.slice(i, i + BATCH_SIZE)
|
||||
const promises = batch.map(async (handle) => {
|
||||
try {
|
||||
const avatar = await getAvatar({ handle })
|
||||
return { handle, avatar, success: true }
|
||||
} catch (error) {
|
||||
return { handle, avatar: null, success: false, error: error.message }
|
||||
}
|
||||
})
|
||||
|
||||
const batchResults = await Promise.all(promises)
|
||||
batchResults.forEach(({ handle, avatar, success }) => {
|
||||
results.set(handle, { avatar, success })
|
||||
if (success) {
|
||||
addCachedHandle(handle)
|
||||
}
|
||||
})
|
||||
|
||||
// Small delay between batches to avoid overwhelming the API
|
||||
if (i + BATCH_SIZE < handles.length) {
|
||||
await new Promise(resolve => setTimeout(resolve, 100))
|
||||
}
|
||||
}
|
||||
|
||||
return results
|
||||
}
|
||||
|
||||
/**
|
||||
* Validate cached avatar URLs
|
||||
* Check if cached avatar URLs are still valid
|
||||
* @param {number} sampleSize - Number of cached avatars to validate (default: 5)
|
||||
* @returns {Promise<Object>} Validation results
|
||||
*/
|
||||
export async function validateCachedAvatars(sampleSize = 5) {
|
||||
const metadata = getAvatarCacheMetadata()
|
||||
const handles = metadata.handles || []
|
||||
|
||||
if (handles.length === 0) {
|
||||
return { validCount: 0, invalidCount: 0, totalChecked: 0 }
|
||||
}
|
||||
|
||||
// Sample random handles to check
|
||||
const samplesToCheck = handles
|
||||
.sort(() => Math.random() - 0.5)
|
||||
.slice(0, sampleSize)
|
||||
|
||||
let validCount = 0
|
||||
let invalidCount = 0
|
||||
|
||||
for (const handle of samplesToCheck) {
|
||||
const cacheKey = `${CACHE_PREFIX}${handle}`
|
||||
const avatarUrl = dataCache.get(cacheKey)
|
||||
|
||||
if (avatarUrl && typeof avatarUrl === 'string' && avatarUrl.startsWith('http')) {
|
||||
try {
|
||||
const response = await fetch(avatarUrl, { method: 'HEAD' })
|
||||
if (response.ok) {
|
||||
validCount++
|
||||
} else {
|
||||
invalidCount++
|
||||
// Remove invalid cached avatar
|
||||
dataCache.delete(cacheKey)
|
||||
removeCachedHandle(handle)
|
||||
}
|
||||
} catch {
|
||||
invalidCount++
|
||||
// Remove invalid cached avatar
|
||||
dataCache.delete(cacheKey)
|
||||
removeCachedHandle(handle)
|
||||
}
|
||||
} else {
|
||||
invalidCount++
|
||||
// Remove invalid cache entry
|
||||
dataCache.delete(cacheKey)
|
||||
removeCachedHandle(handle)
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
validCount,
|
||||
invalidCount,
|
||||
totalChecked: samplesToCheck.length,
|
||||
validationRate: samplesToCheck.length > 0 ?
|
||||
Math.round((validCount / samplesToCheck.length) * 100) : 0
|
||||
}
|
||||
}
|
||||
@@ -1,158 +0,0 @@
|
||||
import { getPdsFromHandle, getApiConfig } from './pds.js'
|
||||
import { logger } from './logger.js'
|
||||
|
||||
// Avatar取得の状態管理
|
||||
const avatarCache = new Map()
|
||||
const CACHE_DURATION = 30 * 60 * 1000 // 30分
|
||||
|
||||
// Avatar URLが有効かチェック
|
||||
async function isAvatarValid(avatarUrl) {
|
||||
if (!avatarUrl) return false
|
||||
|
||||
try {
|
||||
const response = await fetch(avatarUrl, { method: 'HEAD' })
|
||||
return response.ok
|
||||
} catch (error) {
|
||||
logger.warn('Avatar URL check failed:', error)
|
||||
return false
|
||||
}
|
||||
}
|
||||
|
||||
// handleからDIDを取得
|
||||
async function getDid(handle) {
|
||||
try {
|
||||
const pds = await getPdsFromHandle(handle)
|
||||
const response = await fetch(`${pds}/xrpc/com.atproto.repo.describeRepo?repo=${handle}`)
|
||||
const data = await response.json()
|
||||
return data.did
|
||||
} catch (error) {
|
||||
logger.error('Failed to get DID for handle:', handle, error)
|
||||
throw error
|
||||
}
|
||||
}
|
||||
|
||||
// DIDからプロフィール情報を取得
|
||||
async function getProfile(did, handle) {
|
||||
// Skip test DIDs
|
||||
if (did && did.includes('test-')) {
|
||||
logger.log('Skipping profile fetch for test DID:', did)
|
||||
return null
|
||||
}
|
||||
|
||||
try {
|
||||
// Determine which public API to use based on handle
|
||||
const pds = await getPdsFromHandle(handle)
|
||||
const apiConfig = getApiConfig(pds)
|
||||
|
||||
// Use the appropriate public API endpoint
|
||||
const publicApiUrl = apiConfig.bsky
|
||||
|
||||
logger.log('Getting profile for DID:', did, 'using public API:', publicApiUrl)
|
||||
const response = await fetch(`${publicApiUrl}/xrpc/app.bsky.actor.getProfile?actor=${did}`)
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error(`Profile API error: ${response.status} ${response.statusText}`)
|
||||
}
|
||||
|
||||
const data = await response.json()
|
||||
logger.log('Profile data received:', data)
|
||||
return data
|
||||
} catch (error) {
|
||||
logger.error('Failed to get profile for DID:', did, error)
|
||||
throw error
|
||||
}
|
||||
}
|
||||
|
||||
// 新しいavatar URLを取得
|
||||
async function fetchFreshAvatar(handle, did) {
|
||||
const cacheKey = `${handle}:${did || 'no-did'}`
|
||||
const cached = avatarCache.get(cacheKey)
|
||||
|
||||
// キャッシュチェック
|
||||
if (cached && Date.now() - cached.timestamp < CACHE_DURATION) {
|
||||
logger.log('Using cached avatar for:', handle)
|
||||
return cached.avatar
|
||||
}
|
||||
|
||||
try {
|
||||
logger.log('Fetching fresh avatar for handle:', handle, 'with DID:', did)
|
||||
|
||||
// DIDが不明な場合は取得
|
||||
let actualDid = did
|
||||
if (!actualDid) {
|
||||
logger.log('No DID provided, fetching from handle:', handle)
|
||||
actualDid = await getDid(handle)
|
||||
logger.log('Got DID from handle:', actualDid)
|
||||
}
|
||||
|
||||
// プロフィール取得
|
||||
const profile = await getProfile(actualDid, handle)
|
||||
if (!profile) {
|
||||
// Test DID or profile fetch failed
|
||||
return null
|
||||
}
|
||||
|
||||
const avatarUrl = profile.avatar || null
|
||||
|
||||
// キャッシュに保存
|
||||
avatarCache.set(cacheKey, {
|
||||
avatar: avatarUrl,
|
||||
timestamp: Date.now(),
|
||||
profile: {
|
||||
displayName: profile.displayName,
|
||||
handle: profile.handle
|
||||
}
|
||||
})
|
||||
|
||||
logger.log('Fresh avatar fetched for:', handle, 'Avatar URL:', avatarUrl)
|
||||
return avatarUrl
|
||||
|
||||
} catch (error) {
|
||||
logger.error('Failed to fetch fresh avatar for:', handle, 'Error:', error)
|
||||
return null
|
||||
}
|
||||
}
|
||||
|
||||
// メイン関数: avatarを取得（recordから → 新規取得）
|
||||
export async function getValidAvatar(record) {
|
||||
const author = record?.value?.author
|
||||
if (!author?.handle) {
|
||||
logger.warn('No handle found in record author')
|
||||
return null
|
||||
}
|
||||
|
||||
const { handle, did, avatar: recordAvatar } = author
|
||||
|
||||
// 1. record内のavatarをチェック
|
||||
if (recordAvatar) {
|
||||
const isValid = await isAvatarValid(recordAvatar)
|
||||
if (isValid) {
|
||||
logger.log('Using avatar from record:', recordAvatar)
|
||||
return recordAvatar
|
||||
} else {
|
||||
logger.log('Record avatar is broken, fetching fresh:', recordAvatar)
|
||||
}
|
||||
}
|
||||
|
||||
// 2. 新しいavatarを取得
|
||||
return await fetchFreshAvatar(handle, did)
|
||||
}
|
||||
|
||||
// キャッシュクリア
|
||||
export function clearAvatarCache() {
|
||||
avatarCache.clear()
|
||||
logger.log('Avatar cache cleared')
|
||||
}
|
||||
|
||||
// キャッシュ統計
|
||||
export function getAvatarCacheStats() {
|
||||
return {
|
||||
size: avatarCache.size,
|
||||
entries: Array.from(avatarCache.entries()).map(([key, value]) => ({
|
||||
key,
|
||||
avatar: value.avatar,
|
||||
age: Date.now() - value.timestamp,
|
||||
profile: value.profile
|
||||
}))
|
||||
}
|
||||
}
|
||||
@@ -1,63 +0,0 @@
|
||||
import { logger } from './logger.js'
|
||||
|
||||
class SimpleCache {
|
||||
constructor(ttl = 30000) { // 30秒TTL
|
||||
this.cache = new Map()
|
||||
this.ttl = ttl
|
||||
}
|
||||
|
||||
generateKey(...parts) {
|
||||
return parts.filter(Boolean).join(':')
|
||||
}
|
||||
|
||||
get(key) {
|
||||
const item = this.cache.get(key)
|
||||
if (!item) return null
|
||||
|
||||
if (Date.now() - item.timestamp > this.ttl) {
|
||||
this.cache.delete(key)
|
||||
return null
|
||||
}
|
||||
|
||||
logger.log(`Cache hit: ${key}`)
|
||||
return item.data
|
||||
}
|
||||
|
||||
set(key, data) {
|
||||
this.cache.set(key, {
|
||||
data,
|
||||
timestamp: Date.now()
|
||||
})
|
||||
logger.log(`Cache set: ${key}`)
|
||||
}
|
||||
|
||||
clear() {
|
||||
this.cache.clear()
|
||||
logger.log('Cache cleared')
|
||||
}
|
||||
|
||||
invalidatePattern(pattern) {
|
||||
let deletedCount = 0
|
||||
for (const key of this.cache.keys()) {
|
||||
if (key.includes(pattern)) {
|
||||
this.cache.delete(key)
|
||||
deletedCount++
|
||||
}
|
||||
}
|
||||
logger.log(`Cache invalidated: ${pattern} (${deletedCount} items)`)
|
||||
}
|
||||
|
||||
getStats() {
|
||||
return {
|
||||
size: this.cache.size,
|
||||
keys: Array.from(this.cache.keys())
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export const dataCache = new SimpleCache()
|
||||
|
||||
// デバッグ用：開発環境でのみグローバルからアクセス可能にする
|
||||
if (import.meta.env.DEV) {
|
||||
window.dataCache = dataCache
|
||||
}
|
||||
@@ -1,49 +0,0 @@
|
||||
import { logger } from './logger.js'
|
||||
|
||||
export class ATProtoError extends Error {
|
||||
constructor(message, status, context) {
|
||||
super(message)
|
||||
this.status = status
|
||||
this.context = context
|
||||
this.timestamp = new Date().toISOString()
|
||||
}
|
||||
}
|
||||
|
||||
export function getErrorMessage(error) {
|
||||
if (!error) return '不明なエラー'
|
||||
|
||||
if (error.status === 400) {
|
||||
return 'アカウントまたはレコードが見つかりません'
|
||||
} else if (error.status === 401) {
|
||||
return '認証が必要です。ログインしてください'
|
||||
} else if (error.status === 403) {
|
||||
return 'アクセス権限がありません'
|
||||
} else if (error.status === 429) {
|
||||
return 'アクセスが集中しています。しばらく待ってから再試行してください'
|
||||
} else if (error.status === 500) {
|
||||
return 'サーバーでエラーが発生しました'
|
||||
} else if (error.message?.includes('fetch')) {
|
||||
return 'ネットワーク接続を確認してください'
|
||||
} else if (error.message?.includes('timeout')) {
|
||||
return 'タイムアウトしました。再試行してください'
|
||||
}
|
||||
|
||||
return `エラーが発生しました: ${error.message || '不明'}`
|
||||
}
|
||||
|
||||
export function logError(error, context = 'Unknown') {
|
||||
const errorInfo = {
|
||||
context,
|
||||
message: error.message,
|
||||
status: error.status,
|
||||
timestamp: new Date().toISOString(),
|
||||
url: window.location.href
|
||||
}
|
||||
|
||||
logger.error(`[ATProto Error] ${context}:`, errorInfo)
|
||||
|
||||
// 本番環境では外部ログサービスに送信することも可能
|
||||
// if (import.meta.env.PROD) {
|
||||
// sendToLogService(errorInfo)
|
||||
// }
|
||||
}
|
||||
@@ -1,82 +0,0 @@
|
||||
// Logger utility with environment-based control
|
||||
class Logger {
|
||||
constructor() {
|
||||
this.isDev = import.meta.env.DEV || false
|
||||
this.debugEnabled = import.meta.env.VITE_ENABLE_DEBUG === 'true'
|
||||
this.isEnabled = this.isDev && this.debugEnabled // Enable only in dev AND when debug flag is true
|
||||
}
|
||||
|
||||
log(...args) {
|
||||
if (this.isEnabled) {
|
||||
console.log(...args)
|
||||
}
|
||||
}
|
||||
|
||||
error(...args) {
|
||||
if (this.isEnabled) {
|
||||
console.error(...args)
|
||||
}
|
||||
}
|
||||
|
||||
warn(...args) {
|
||||
if (this.isEnabled) {
|
||||
console.warn(...args)
|
||||
}
|
||||
}
|
||||
|
||||
info(...args) {
|
||||
if (this.isEnabled) {
|
||||
console.info(...args)
|
||||
}
|
||||
}
|
||||
|
||||
// グループログ
|
||||
group(label) {
|
||||
if (this.isEnabled) {
|
||||
console.group(label)
|
||||
}
|
||||
}
|
||||
|
||||
groupEnd() {
|
||||
if (this.isEnabled) {
|
||||
console.groupEnd()
|
||||
}
|
||||
}
|
||||
|
||||
// テーブル表示
|
||||
table(data) {
|
||||
if (this.isEnabled) {
|
||||
console.table(data)
|
||||
}
|
||||
}
|
||||
|
||||
// 時間計測
|
||||
time(label) {
|
||||
if (this.isEnabled) {
|
||||
console.time(label)
|
||||
}
|
||||
}
|
||||
|
||||
timeEnd(label) {
|
||||
if (this.isEnabled) {
|
||||
console.timeEnd(label)
|
||||
}
|
||||
}
|
||||
|
||||
// ログを有効/無効にする
|
||||
enable() {
|
||||
this.isEnabled = true
|
||||
}
|
||||
|
||||
disable() {
|
||||
this.isEnabled = false
|
||||
}
|
||||
}
|
||||
|
||||
// シングルトンインスタンス
|
||||
export const logger = new Logger()
|
||||
|
||||
// 開発環境でのみグローバルアクセス可能にする
|
||||
if (import.meta.env.DEV && import.meta.env.VITE_ENABLE_DEBUG === 'true') {
|
||||
window._logger = logger
|
||||
}
|
||||
@@ -1,39 +0,0 @@
|
||||
import { env } from '../config/env.js'
|
||||
|
||||
// PDS判定からAPI設定を取得 - 実際のPDSエンドポイントに基づいて設定
|
||||
export function getApiConfig(pds) {
|
||||
// pdsからhttps://を除去してドメインのみ取得
|
||||
const cleanPds = pds.replace(/^https?:\/\//, '')
|
||||
|
||||
if (cleanPds.includes(env.pds)) {
|
||||
return {
|
||||
pds: `https://${env.pds}`,
|
||||
bsky: `https://bsky.${env.pds}`,
|
||||
plc: `https://plc.${env.pds}`,
|
||||
web: `https://${env.pds}`
|
||||
}
|
||||
}
|
||||
return {
|
||||
pds: pds.startsWith('http') ? pds : `https://${pds}`,
|
||||
bsky: 'https://public.api.bsky.app',
|
||||
plc: 'https://plc.directory',
|
||||
web: 'https://bsky.app'
|
||||
}
|
||||
}
|
||||
|
||||
// handleがsyu.is系かどうか判定
|
||||
export function isSyuIsHandle(handle) {
|
||||
return env.handleList.includes(handle) || handle.endsWith(`.${env.pds}`)
|
||||
}
|
||||
|
||||
// handleからPDS取得
|
||||
export async function getPdsFromHandle(handle) {
|
||||
const initialPds = isSyuIsHandle(handle)
|
||||
? `https://${env.pds}`
|
||||
: 'https://bsky.social'
|
||||
|
||||
const data = await fetch(`${initialPds}/xrpc/com.atproto.repo.describeRepo?repo=${handle}`)
|
||||
.then(res => res.json())
|
||||
|
||||
return data.didDoc?.service?.[0]?.serviceEndpoint || initialPds
|
||||
}
|
||||
@@ -1,15 +0,0 @@
|
||||
import { defineConfig } from 'vite'
|
||||
import react from '@vitejs/plugin-react'
|
||||
|
||||
export default defineConfig({
|
||||
plugins: [react()],
|
||||
build: {
|
||||
rollupOptions: {
|
||||
output: {
|
||||
entryFileNames: 'assets/comment-atproto-[hash].js',
|
||||
chunkFileNames: 'assets/comment-atproto-[hash].js',
|
||||
assetFileNames: 'assets/comment-atproto-[hash].[ext]'
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
@@ -1,3 +0,0 @@
|
||||
<!-- AI Conversation Display System -->
|
||||
<script type="module" crossorigin src="/ai-assets/comment-atproto-COOgkuRz.js"></script>
|
||||
<link rel="stylesheet" crossorigin href="/ai-assets/comment-atproto-CRtMnSCT.css">
|
||||
@@ -131,9 +131,5 @@
|
||||
</script>
|
||||
|
||||
{% include "oauth-assets.html" %}
|
||||
|
||||
{% if post.extra and post.extra.type == "ai" %}
|
||||
{% include "ai-conversation-assets.html" %}
|
||||
{% endif %}
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -27,40 +27,27 @@
|
||||
</div>
|
||||
</header>
|
||||
|
||||
{% if not post.extra or not post.extra.type or post.extra.type != "ai" %}
|
||||
<nav class="toc">
|
||||
<h3>Contents</h3>
|
||||
<div id="toc-content">
|
||||
<!-- TOC will be generated by JavaScript -->
|
||||
</div>
|
||||
</nav>
|
||||
{% endif %}
|
||||
|
||||
<div class="article-body">
|
||||
{% if post.extra and post.extra.type == "ai" %}
|
||||
<!-- AI Conversation Content (Markdown first) -->
|
||||
{{ post.content | safe }}
|
||||
{% elif not post.extra or not post.extra.type or post.extra.type != "ai" %}
|
||||
{{ post.content | safe }}
|
||||
{% endif %}
|
||||
{{ post.content | safe }}
|
||||
</div>
|
||||
|
||||
{% if not post.extra or not post.extra.type or post.extra.type != "ai" %}
|
||||
<div id="comment-atproto"></div>
|
||||
{% endif %}
|
||||
</article>
|
||||
</div>
|
||||
|
||||
{% if post.extra and post.extra.type == "ai" %}
|
||||
<div id="ai-conversation-atproto"></div>
|
||||
{% endif %}
|
||||
|
||||
<script>
|
||||
// Generate table of contents
|
||||
function generateTableOfContents() {
|
||||
const tocContainer = document.getElementById('toc-content');
|
||||
if (!tocContainer) {
|
||||
// TOC container doesn't exist (e.g., AI conversation type posts)
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{
|
||||
"name": "ailog-oauth",
|
||||
"version": "0.2.8",
|
||||
"version": "0.2.9",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
|
||||
13
scpt/run.zsh
13
scpt/run.zsh
@@ -43,16 +43,6 @@ function _oauth_build() {
|
||||
#npm run preview
|
||||
}
|
||||
|
||||
function _ai_conversation_build() {
|
||||
cd $d/ai-conversation
|
||||
nvm use 21
|
||||
npm i
|
||||
npm run build
|
||||
rm -rf $myblog/static/ai-assets
|
||||
mkdir -p $myblog/static/ai-assets
|
||||
cp -rf dist/assets/* $myblog/static/ai-assets/
|
||||
cp $d/ai-conversation/dist/index.html $myblog/templates/ai-conversation-assets.html
|
||||
}
|
||||
|
||||
function _server_comment() {
|
||||
cargo build
|
||||
@@ -75,9 +65,6 @@ case "${1:-serve}" in
|
||||
oauth|o)
|
||||
_oauth_build
|
||||
;;
|
||||
ai|a)
|
||||
_ai_conversation_build
|
||||
;;
|
||||
n)
|
||||
oauth=$d/oauth_old
|
||||
_oauth_build
|
||||
|
||||
@@ -160,6 +160,7 @@ impl ProfileFetcher {
|
||||
}
|
||||
|
||||
/// Generate profile URL for a given DID and PDS
|
||||
#[allow(dead_code)]
|
||||
pub fn generate_profile_url(did: &str, pds: &str) -> String {
|
||||
let network_config = Self::get_network_config(pds);
|
||||
match pds {
|
||||
@@ -169,6 +170,7 @@ impl ProfileFetcher {
|
||||
}
|
||||
|
||||
/// Convert Profile to JSON format used by the application
|
||||
#[allow(dead_code)]
|
||||
pub fn profile_to_json(&self, profile: &Profile, _pds: &str) -> Value {
|
||||
serde_json::json!({
|
||||
"did": profile.did,
|
||||
|
||||
@@ -608,7 +608,7 @@ async fn get_ai_profile(_client: &reqwest::Client, config: &AuthConfig) -> Resul
|
||||
async fn check_for_duplicates(
|
||||
client: &reqwest::Client,
|
||||
config: &AuthConfig,
|
||||
conversation: &[ConversationPair],
|
||||
_conversation: &[ConversationPair],
|
||||
_url: &str,
|
||||
) -> Result<()> {
|
||||
// Simple check - just get recent records to warn about potential duplicates
|
||||
|
||||
Reference in New Issue
Block a user