auto update repo info

components/CommentBox.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="mb-4 rounded-lg border border-gray-200 dark:border-gray-700 ">
-    <div v-if="user" class="p-3">
+    <div v-if="isLoggedIn" class="p-3">
       <div class="flex items-start space-x-3">
         <img :src="user.user_metadata.avatar_url" :alt="user.user_metadata.full_name" class="w-8 h-8 rounded-full">
         <div class="flex-grow">
@@ -26,10 +26,25 @@ const user = useSupabaseUser()
 const supabase = useSupabaseClient()
 const route = useRoute()
 
+// console.log("user: ", user)
 const commentText = ref('')
+const isLoggedIn = ref(false)
 
 const emit = defineEmits(['comment-submitted'])
 
+// 新增：检查登录状态的函数
+const checkLoginStatus = () => {
+  const githubToken = useCookie('github_token').value
+  const githubUser = useCookie('github_username').value
+  isLoggedIn.value = !!githubToken && !!githubUser
+}
+
+// 在组件挂载时检查登录状态
+onMounted(() => {
+  checkLoginStatus()
+})
+
+
 const submitComment = async () => {
   if (commentText.value.trim()) {
     try {
@@ -40,6 +55,7 @@ const submitComment = async () => {
           commentText: commentText.value
         }
       })
+      console.log(response)
       emit('comment-submitted', response) // 发出包含新评论数据的事件
       commentText.value = '' // 清空输入框
     } catch (error) {

pages/blog/[id].vue

@@ -35,7 +35,6 @@
             <div v-if="post.comments && post.comments.length > 0">
                 <PostComment v-for="comment in post.comments" :key="comment.id" :comment="comment" />
             </div>
-            <p v-else class="text-gray-600 dark:text-gray-400">No comments yet.</p>
         </div>
     </main>
 </template>

pages/repo/[repo_owner]/[repo_name]/blog/[id].vue

@@ -35,7 +35,6 @@
             <div v-if="post.comments && post.comments.length > 0">
                 <PostComment v-for="comment in post.comments" :key="comment.id" :comment="comment" />
             </div>
-            <p v-else class="text-gray-600 dark:text-gray-400">No comments yet.</p>
         </div>
     </main>
 </template>

pages/repo/[repo_owner]/[repo_name]/index.vue

@@ -37,7 +37,7 @@ const fetchBlogPosts = async (page = 1) => {
 // Fetch initial data
 await fetchBlogPosts()
 
-console.log(totalItems.value, perPage.value, currentPage.value)
+// console.log(totalItems.value, perPage.value, currentPage.value)
 
 // Handle page changes
 const onPageChange = async (page: number) => {

server/api/github/create-comment.ts

@@ -9,7 +9,7 @@ export default defineEventHandler(async (event) => {
     const githubUser = getCookie(event, 'github_username')
     // console.log("github user:", githubUser, "repo:", config.public.repoName, "token:", token)
 
-    if (!token) {
+    if (!token || !githubUser) {
         throw createError({
             statusCode: 401,
             message: 'GitHub token not found'

server/api/github/issues.ts

@@ -0,0 +1,50 @@
+import { H3Event } from 'h3'
+import { useRuntimeConfig } from '#imports'
+import { Octokit } from '@octokit/rest'
+
+export async function getIssuesList(event: H3Event, repo_owner: string, repo_name: string, labels: string, perPage: number, page: number) {
+  const config = useRuntimeConfig()
+  var token = getCookie(event, 'github_token')
+  if (!token) {
+    token = config.private.githubToken
+  }
+  const octokit = new Octokit({ auth: token })
+  var req_data = {
+    owner: repo_owner,
+    repo: repo_name,
+    // state: 'open', // 只获取开放的 issues
+    sort: 'created',
+    direction: 'desc',
+    per_page: perPage,// 限制返回的数量，你可以根据需要调整
+    page: page,
+    labels: labels
+  }
+  req_data.labels = labels
+  // console.log("req: ", req_data)
+
+  try {
+
+    const { data: issues, headers } = await octokit.issues.listForRepo(req_data)
+
+    const formattedIssues = issues.map(issue => ({
+      number: issue.number,
+      title: issue.title,
+      body: issue.body,
+      created_at: issue.created_at,
+      labels: issue.labels,
+      reactions: issue.reactions,
+      comments: issue.comments,
+      html_url: `/repo/${repo_owner}/${repo_name}/blog/${issue.number}`,
+      github_url: issue.html_url,
+      updated_at: issue.updated_at,
+      author: issue.user.login,
+      repo_url: `/repo/${repo_owner}/${repo_name}`,
+      url: issue.html_url
+    }))
+
+    return { issues: formattedIssues, headers }
+  } catch (error) {
+    console.error('GitHub API error:', error)
+    throw createError({ statusCode: 500, statusMessage: 'Failed to fetch issues from GitHub' })
+  }
+}

server/api/github/repos.ts

@@ -0,0 +1,25 @@
+import { H3Event } from 'h3'
+import { Octokit } from '@octokit/rest'
+
+export async function getGitHubRepoInfo(event: H3Event, owner: string, repo: string) {
+  const config = useRuntimeConfig()
+  const octokit = new Octokit({ auth: config.githubToken })
+
+  try {
+    const { data: githubRepo } = await octokit.repos.get({ owner, repo })
+
+    return {
+      repo_id: githubRepo.id,
+      repo_owner: owner,
+      repo_name: repo,
+      repo_description: githubRepo.description,
+      stars_count: githubRepo.stargazers_count,
+      forks_count: githubRepo.forks_count,
+      updated_at: new Date().toISOString(),
+      repo_detail: githubRepo
+    }
+  } catch (error) {
+    console.error('GitHub API error:', error)
+    throw createError({ statusCode: 500, statusMessage: 'Failed to fetch repo info from GitHub' })
+  }
+}

server/api/repo/[repo_owner]/[repo_name]/blog-posts.ts

@@ -1,89 +1,68 @@
 // server/api/repo/[repo_owner]/[repo_name]/blog-posts.ts
 
 import { defineEventHandler } from 'h3'
-import { Octokit } from '@octokit/rest'
+import { getGitHubRepoInfo } from '../../../github/repos'
+import { getIssuesList } from '../../../github/issues'
+import { getRepoById, updateOrCreateRepo } from '../../../repos'
+
 
 export default defineEventHandler(async (event) => {
-    const { repo_owner, repo_name } = event.context.params
     const query = getQuery(event)
-    const tag = query.tag as string
     const page = parseInt(query.page as string) || 1
     const perPage = parseInt(query.perPage as string) || 20
+    const { repo_owner, repo_name } = event.context.params
+    const tag = query.tag as string
+
+    try {
+        let repoData
+        try {
+            // 尝试从 /api/repos/list 获取数据
+            repoData = await getRepoById(event, `${repo_owner}/${repo_name}`)
+        } catch (error) {
+            console.error('Failed to fetch repos from DB, errpr: ', error)
+        }
 
-    // console.log("github issus: ", repo_owner, repo_name, tag)
-    var token = getCookie(event, 'github_token')
+        const now = new Date()
+        const shouldFetchFromGitHub = !repoData ||
+            (now.getTime() - new Date(repoData.updated_at).getTime() > 3600000) // 1 hour in milliseconds
 
-    const config = useRuntimeConfig()
-    if (!token) {
-        token = config.private.githubToken
-    }
-    // console.log("github token: ", token)
-    const octokit = new Octokit({
-        auth: token
-    })
+        // console.log("update time,", repoData)
+        // console.log("shouldFetchFromGitHub", shouldFetchFromGitHub, now.getTime(), new Date(repoData.updated_at).getTime())
 
-    try {
-        // 获取仓库信息
-        const { data: repoData } = await octokit.repos.get({
-            owner: repo_owner,
-            repo: repo_name,
-        })
+        if (shouldFetchFromGitHub) {
+            try {
+                const githubRepoInfo = await getGitHubRepoInfo(event, repo_owner, repo_name)
 
-        var req_data = {
-            owner: repo_owner,
-            repo: repo_name,
-            // state: 'open', // 只获取开放的 issues
-            sort: 'created',
-            direction: 'desc',
-            per_page: perPage,// 限制返回的数量，你可以根据需要调整
-            page: page,
-            labels: tag
+                // console.log("githubRepoInfo, ", githubRepoInfo)
+                try {
+                    // 更新或插入数据库
+                    repoData = await updateOrCreateRepo(event, githubRepoInfo, repoData)
+                } catch (error) {
+                    console.error('Failed to fetch repos from DB, errpr: ', error)
+                }
+            } catch (error) {
+                console.error('Failed to fetch or update repo info:', error)
+            }
         }
-        req_data.labels = tag
-        // console.log("request: ", req_data)
 
-        // 获取仓库的 issues 列表
-        const { data: issues, headers } = await octokit.issues.listForRepo(req_data)
-        // console.log("issues: ", headers)
+        const { issues, headers } = await getIssuesList(event, repo_owner, repo_name, tag, perPage, page)
         const totalItems = getTotalPages(headers, page) * perPage
+        // console.log("totalItems: ", totalItems, page, perPage)
+        // console.log("repoData: ", repoData)
 
-        // console.log("query:", query, "page:", page, "perPage: ", perPage, "total: ", totalItems, repo_owner, repo_name)
-        // Get total count of issues
-        // console.log("total: ", totalItems)
         return {
-            repo: {
-                name: repoData.name,
-                description: repoData.description,
-                stars: repoData.stargazers_count,
-                forks: repoData.forks_count,
-            },
-            blogPosts: issues.map(issue => ({
-                number: issue.number,
-                title: issue.title,
-                body: issue.body,
-                created_at: issue.created_at,
-                labels: issue.labels,
-                reactions: issue.reactions,
-                comments: issue.comments,
-                html_url: `/repo/${repo_owner}/${repo_name}/blog/${issue.number}`,
-                github_url: issue.html_url,
-                updated_at: issue.updated_at,
-                author: issue.user.login,
-                repo_url: `/repo/${repo_owner}/${repo_name}`,
-                url: issue.html_url
-            })),
+            repo: repoData,
+            blogPosts: issues,
             pagination: {
                 currentPage: page,
                 totalItems: totalItems,
                 perPage: perPage
             }
+
         }
     } catch (error) {
-        console.error('Error fetching data from GitHub:', error)
-        throw createError({
-            statusCode: 500,
-            statusMessage: 'Error fetching data from GitHub'
-        })
+        console.error('Error in blog-posts:', error)
+        throw createError({ statusCode: 500, statusMessage: 'Internal Server Error' })
     }
 })
 

server/api/repo/list.ts

@@ -1,6 +1,7 @@
 import { defineEventHandler, getQuery } from 'h3'
+import { getReposList } from '../repos'
 
-const repos = [
+const defaultRepos = [
     {
         name: "path-meme-db",
         description: "一些胡言乱语",
@@ -28,16 +29,28 @@ const repos = [
     // ... 添加更多仓库数据
 ]
 
-export default defineEventHandler((event) => {
+export default defineEventHandler(async (event) => {
     const query = getQuery(event)
     const page = parseInt(query.page as string) || 1
     const limit = parseInt(query.limit as string) || 10
 
+    let repos
+    try {
+        // 尝试从 /api/repos/list 获取数据
+        repos = await getReposList(event)
+        if (repos.length == 0) {
+            repos = defaultRepos
+        }
+    } catch (error) {
+        console.error('Failed to fetch repos from API, using default data', error)
+        repos = defaultRepos
+    }
+
+    console.log("repos: ", repos)
     const startIndex = (page - 1) * limit
     const endIndex = page * limit
 
     const paginatedRepos = repos.slice(startIndex, endIndex)
-
     return {
         repos: paginatedRepos,
         totalItems: repos.length,