Update app.py

app.py

@@ -1,8 +1,10 @@
+```python
 import streamlit as st
 import google.generativeai as genai
 import requests
 import os
-import re  # HTMLタグ除去用のライブラリ
+import re
+from datetime import datetime
 
 # --- 初期設定 ---
 GEMINI_KEY = os.environ.get("GEMINI_API_KEY")
@@ -13,19 +15,25 @@ AUTHOR_LIST = ["にき", "かん", "なごみ", "蜜柑餅"]
 if GEMINI_KEY:
     genai.configure(api_key=GEMINI_KEY)
 
-# --- デバッグ用コード（将来のモデル確認用） ---
-# 画面に常に表示されると邪魔な場合は、サイドバーに隠しておくこともできます
-with st.sidebar.expander("🔍 デバッグ・モデル確認モード"):
-    if not GEMINI_KEY:
-        st.error("❌ GEMINI_API_KEY 未設定")
-    else:
-        st.success("✅ APIキー読み込み済み")
-        try:
-            available_models = [m.name for m in genai.list_models() if 'generateContent' in m.supported_generation_methods]
-            st.write("利用可能なモデル一覧:")
-            st.write(available_models)
-        except Exception as e:
-            st.error(f"取得エラー: {e}")
+# --- サイドバー：デバッグ & モデル設定 ---
+with st.sidebar:
+    st.title("⚙️ 設定")
+    model_choice = st.selectbox(
+        "使用するAIモデル",
+        ["gemini-1.5-flash", "gemini-1.5-pro", "gemini-2.0-flash-exp"],
+        index=0,
+        help="Proは賢いですが少し遅いです。Flashは爆速です。"
+    )
+    
+    with st.expander("🔍 デバッグ情報"):
+        if not GEMINI_KEY:
+            st.error("❌ APIキー未設定")
+        else:
+            try:
+                available_models = [m.name for m in genai.list_models() if 'generateContent' in m.supported_generation_methods]
+                st.write("利用可能モデル:", available_models)
+            except Exception as e:
+                st.error(f"取得失敗: {e}")
 
 # --- 関数：microCMSから記事を取得 ---
 def get_articles():
@@ -43,8 +51,8 @@ def get_articles():
 # --- 画面制御 ---
 params = st.query_params
 
-# 1. 個別記事ページ（URLに ?id=xxx がある場合）
 if "id" in params:
+    # --- 個別記事ページ ---
     article_id = params["id"]
     articles = get_articles()
     article = next((a for a in articles if a["id"] == article_id), None)
@@ -55,16 +63,14 @@ if "id" in params:
             st.rerun()
             
         st.title(article.get("title", "無題"))
-        st.caption(f"著者: {article.get('author')} | 公開日: {article.get('publishedAt')[:10]}")
+        st.caption(f"👤 {article.get('author')} | 📅 {article.get('publishedAt')[:10]}")
         st.divider()
-        # 本文をHTMLとして表示
         st.markdown(article.get("content", ""), unsafe_allow_html=True)
         st.divider()
         
-        # SNS共有用URL
-        space_id = os.environ.get('SPACE_ID', 'your-space-id')
+        space_id = os.environ.get('SPACE_ID', 'default')
         share_url = f"https://huggingface.co/spaces/{space_id}?id={article_id}"
-        st.write("🔗 この記事の固定リンク:")
+        st.write("🔗 固定リンク:")
         st.code(share_url)
     else:
         st.error("記事が見つかりませんでした。")
@@ -72,71 +78,69 @@ if "id" in params:
             st.query_params.clear()
             st.rerun()
 
-# 2. メイン画面（一覧表示 & 投稿）
 else:
+    # --- メイン画面 ---
     tab_view, tab_post = st.tabs(["📖 ブログを読む", "✍️ 記事を書く"])
 
     with tab_view:
         st.title("サークル活動ブログ")
-        
-        # 検索・絞り込み機能
         search_col1, search_col2 = st.columns(2)
         with search_col1:
-            search_query = st.text_input("🔍 タイトル・本文で検索", "")
+            search_query = st.text_input("🔍 本文・タイトル検索", "")
         with search_col2:
-            # 検索用リストには「全員」を追加
             search_author_list = ["全員"] + AUTHOR_LIST
             author_filter = st.selectbox("👤 著者で絞り込み", search_author_list)
 
-            articles = get_articles()
-
-        # 一覧表示
+        articles = get_articles()
         for a in articles:
             title = a.get("title", "無題")
             content_html = a.get("content", "")
             author = a.get("author", "不明")
             pub_date = a.get("publishedAt", "-----")[:10]
-
             clean_text = re.sub(r'<[^>]*?>', '', content_html)
 
-            # フィルタリング判定
-            author_match = (author_filter == "全員") or (author_filter == author)
-            search_match = (search_query.lower() in title.lower() or search_query.lower() in clean_text.lower())
-
-            if author_match and search_match:
+            if ((author_filter == "全員") or (author_filter == author)) and \
+               (search_query.lower() in title.lower() or search_query.lower() in clean_text.lower()):
                 with st.container():
                     st.subheader(title)
-                    st.caption(f"著者: {author} | 公開日: {pub_date}")
+                    st.caption(f"👤 {author} | 📅 {pub_date}")
                     snippet = clean_text[:100] + "..."
                     st.write(f'<p style="font-size:0.9em; color:#555;">{snippet}</p>', unsafe_allow_html=True)
-                    
                     if st.button("続きを読む", key=a["id"]):
                         st.query_params.id = a["id"]
                         st.rerun()
                     st.divider()
 
-    # 記事投稿画面（tab_post のスコープ内にすべて収める）
     with tab_post:
         st.title("秘密の管理画面")
-        
-        password = st.text_input("合言葉を入力してください", type="password")
+        password = st.text_input("合言葉", type="password")
         
         if password == "1234":
             st.success("ログイン成功！")
             
-            title_input = st.text_input("タイトル")
-            author_select = st.selectbox("著者を選択", AUTHOR_LIST)
-            raw_content = st.text_area("本文を入力 (メモ書きでOK)", height=150)
+            # 入力エリア
+            col_t, col_a = st.columns([2, 1])
+            with col_t:
+                title_input = st.text_input("記事タイトル")
+            with col_a:
+                author_select = st.selectbox("著者", AUTHOR_LIST)
+            
+            raw_content = st.text_area("本文メモ（AIが装飾します）", height=150)
             
-            if st.button("✨ AIモードでブログ風に装飾する"):
+            if st.button("✨ AIモードで装飾・プレビュー生成"):
                 if raw_content:
                     try:
-                        # 解決済みの最新モデル指定
-                        model = genai.GenerativeModel(model_name='gemini-2.5-flash')
-                        prompt = f"以下の文章をブログ記事用に、読みやすいHTMLタグ(h3, p, strong, br等)を使って装飾してください。なお、出力結果には余計な回答(```html等)は含めず純粋なhtmlコードのみを必ず出力すること。本文: {raw_content}"
-                        with st.spinner('Geminiが執筆中...'):
+                        model = genai.GenerativeModel(model_name=model_choice)
+                        prompt = f"""
+                        以下の文章をブログ記事用に、読みやすいHTMLタグ(h3, p, strong, br等)を使って装飾してください。
+                        【ルール】
+                        - 返答は純粋なHTMLコードのみ。
+                        - 挨拶や解説、```html などの囲みは一切不要。
+                        - オシャレでモダンな作りかつ、読者がワクワクするような構成。
+                        本文: {raw_content}
+                        """
+                        with st.spinner(f'{model_choice} が執筆中...'):
                             ai_response = model.generate_content(prompt)
-                            # 万が一 ``` が含まれた場合の除去
                             clean_html = ai_response.text.replace('```html', '').replace('```', '').strip()
                             st.session_state.formatted_html = clean_html
                     except Exception as e:
@@ -144,21 +148,48 @@ else:
                 else:
                     st.warning("本文を入力してください")
 
+            # プレビュー & 最終編集エリア
             if "formatted_html" in st.session_state:
-                st.write("▼ AIが作成したHTML（微調整可）")
-                final_html = st.text_area("HTML内容", value=st.session_state.formatted_html, height=200)
+                st.divider()
+                st.subheader("👀 プレビュー・最終確認")
                 
-                if st.button("🚀 ブログを公開する"):
+                # プレビュー表示
+                with st.container():
+                    st.info("実際の表示イメージ:")
+                    st.markdown(f"""
+                    <div style="border:1px solid #ddd; padding:20px; border-radius:10px; background:#fff; color:#333;">
+                        <h3>{title_input}</h3>
+                        <small>著者: {author_select}</small>
+                        <hr>
+                        {st.session_state.formatted_html}
+                    </div>
+                    """, unsafe_allow_html=True)
+
+                st.write("▼ HTMLを微調整（必要であれば）")
+                final_html = st.text_area("編集用コード", value=st.session_state.formatted_html, height=150)
+                
+                # 公開設定
+                status = st.radio("公開設定", ["すぐに公開", "下書きとして保存"], horizontal=True)
+                
+                if st.button("🚀 microCMSへ送信"):
                     url = f"https://{CMS_SERVICE_ID}.microcms.io/api/v1/blog"
                     headers = {"X-MICROCMS-API-KEY": CMS_API_KEY, "Content-Type": "application/json"}
-                    post_data = {"title": title_input, "content": final_html, "author": author_select}
+                    
+                    
+                    display_title = title_input if status == "すぐに公開" else f"【下書き】{title_input}"
+                    
+                    post_data = {
+                        "title": display_title,
+                        "content": final_html,
+                        "author": author_select
+                    }
                     
                     res = requests.post(url, headers=headers, json=post_data)
                     if res.status_code == 201:
-                        st.success("投稿完了！「ブログを読む」タブを確認してください。")
-                        if "formatted_html" in st.session_state:
-                            del st.session_state.formatted_html
+                        st.success(f"送信完了！ステータス: {status}")
+                        del st.session_state.formatted_html
                     else:
-                        st.error(f"投稿失敗：{res.text}")
+                        st.error(f"送信失敗：{res.text}")
         elif password != "":
             st.error("合言葉が違います。")
+