Improve welcome page and add gemini exp

src/lang/en.ts

@@ -186,7 +186,21 @@ export const languageEnglish = {
         hordeProvider: "Horde is a free provider, but the response time is long and the quality is low.",
         setProviderLater: "There are other providers, but you can set it later in settings. select this if you want to set it later.",
         setupOpenAI: "To use OpenAI, you need to get an API key. \n1. go to https://beta.openai.com/ \n2. login with your account \n3. go to https://beta.openai.com/account/api-keys \n4. click 'Create New API Key' and name your key whatever you want. \n5. copy the key in the website.\n6. go back to RisuAI\n7. paste it, and click send button.",
-        setupClaude: "To use Claude, you need to get an API key. \n1. go to https://antropic.com/ \n2. click 'Get Started' \n3. sign up with your account \n4. go to https://antropic.com/keys \n5. click 'Create Key' and name your key whatever you want. \n6. copy the key in the website.\n7. go back to RisuAI\n8. paste it, and click send button.",
+        setupClaude: "To use Claude, you need to get an API key.",
+        setupClaudeSteps: [
+            "Go to this URL and Login as Google",
+            "Input your information and click 'Continue'",
+            "On organization page, just input any name only at the first box, and click 'Create Account'",
+            "Press 'Buy Credits' button",
+            "Press 'Complete Setup' button",
+            "Input just like the image above, except the country section, which you need to input your country. then press 'Continue'",
+            "Add your payment method and press 'Continue'",
+            "After payment has been registered, press 'Add Funds' and add funds. you can add minimum 5$, or you can setup auto add reload.",
+            "After adding funds, go to the dashboard page and press 'Get API Keys' button",
+            'Press "Create API Key" button',
+            "Input just like the image above, and press 'Add'",
+            "Copy the key, and paste it in here and send it.",
+        ],
         setupOpenrouter: "To use Openrouter, you need to get an API key. \n1. go to https://openrouter.ai/keys\n2. click 'Create Key'\n3. set key name whatever you want.\n4. copy the key in the website\n5. go back to RisuAI\n6. paste it, and click send button.",
         allDone: "All Done! please wait a moment.",
         setupLaterMessage: "Welcome {username}! do you want me to guide you to setup or do it yourself?",
@@ -780,4 +794,5 @@ export const languageEnglish = {
     chatHTML: "Chat HTML",
     logShare: "Show Share Log Button",
     preview: "Preview",
+    recommended: "Recommended",
 }

src/lib/Others/WelcomeRisu.svelte

@@ -232,6 +232,13 @@
                     {/if}
                     {#if step === 3}
                         <div class="grid grid-cols-1 gap-4 md:grid-cols-2">
+                            <button class="border-l-gray-500 border-l-4 p-6 flex flex-col transition-shadow hover:ring-1" onclick={() => {
+                                provider = 'claude'
+                                step = 4
+                            }}>
+                                <h1 class="text-2xl font-bold text-start">Claude <span class="text-sm p-1 rounded bg-blue-500 text-white">{language.recommended}</span></h1>
+                                <span class="mt-2 text-textcolor2 text-start">{language.setup.claudeDesc}</span>
+                            </button>
                             <button class="border-l-blue-500 border-l-4 p-6 flex flex-col transition-shadow hover:ring-1" onclick={() => {
                                 provider = 'openai'
                                 step = 4
@@ -239,13 +246,6 @@
                                 <h1 class="text-2xl font-bold text-start">OpenAI</h1>
                                 <span class="mt-2 text-textcolor2 text-start">{language.setup.openAIDesc}</span>
                             </button>
-                            <button class="border-l-gray-500 border-l-4 p-6 flex flex-col transition-shadow hover:ring-1" onclick={() => {
-                                provider = 'claude'
-                                step = 4
-                            }}>
-                                <h1 class="text-2xl font-bold text-start">Claude</h1>
-                                <span class="mt-2 text-textcolor2 text-start">{language.setup.claudeDesc}</span>
-                            </button>
                             <button class="border-l-red-500 border-l-4 p-6 flex flex-col transition-shadow hover:ring-1" onclick={() => {
                                 provider = 'horde'
                                 step = 10
@@ -271,7 +271,12 @@
                             <Chat name="Risu" message={language.setup.setupOpenrouter} isLastMemory={false} />
                         {/if}
                         {#if provider === 'claude'}
-                            <Chat name="Risu" message={language.setup.setupClaude} isLastMemory={false} />
+                            {#each language.setup.setupClaudeSteps as step, i}
+                                <Chat name="Risu" message={
+                                `![alt text](/welcome/claude/ant_${i}.webp)\n\n${i === 0 ? 'https://console.anthropic.com/login?returnTo=%2F%3F\n\n' : ''}` + step
+                            } isLastMemory={false} />
+                                
+                            {/each}
                         {/if}
                     {/if}
                     {#if step >= 5}
@@ -311,6 +316,13 @@
                     {/if}
                     {#if step === 6}
                         <div class="grid grid-cols-1 gap-4 md:grid-cols-2">
+                            <button class="border-l-red-500 border-l-4 p-6 flex flex-col transition-shadow hover:ring-1" onclick={() => {
+                                chatMemorySelection = 2
+                                step = 10
+                            }}>
+                                <h1 class="text-2xl font-bold text-start">{language.setup.chooseCheapOrMemoryOption3} <span class="text-sm p-1 rounded bg-blue-500 text-white">{language.recommended}</span></h1>
+                                <span class="mt-2 text-textcolor2 text-start">{language.setup.chooseCheapOrMemoryOption3Desc}</span>
+                            </button>
                             <button class="border-l-blue-500 border-l-4 p-6 flex flex-col transition-shadow hover:ring-1" onclick={() => {
                                 chatMemorySelection = 0
                                 step = 10
@@ -325,13 +337,6 @@
                                 <h1 class="text-2xl font-bold text-start">{language.setup.chooseCheapOrMemoryOption2}</h1>
                                 <span class="mt-2 text-textcolor2 text-start">{language.setup.chooseCheapOrMemoryOption2Desc}</span>
                             </button>
-                            <button class="border-l-red-500 border-l-4 p-6 flex flex-col transition-shadow hover:ring-1" onclick={() => {
-                                chatMemorySelection = 2
-                                step = 10
-                            }}>
-                                <h1 class="text-2xl font-bold text-start">{language.setup.chooseCheapOrMemoryOption3}</h1>
-                                <span class="mt-2 text-textcolor2 text-start">{language.setup.chooseCheapOrMemoryOption3Desc}</span>
-                            </button>
                             <button class="border-l-yellow-500 border-l-4 p-6 flex flex-col transition-shadow hover:ring-1" onclick={() => {
                                 chatMemorySelection = 3
                                 step = 10

src/lib/UI/ModelList.svelte

@@ -119,6 +119,7 @@
             </Arcodion>
             <Arcodion name="Google Gemini">
                 <button class="hover:bg-selected px-6 py-2 text-lg" onclick={() => {changeModel('gemini-1.5-pro-exp-0827')}}>Gemini Pro 1.5 0827</button>
+                <button class="hover:bg-selected px-6 py-2 text-lg" onclick={() => {changeModel('gemini-exp-1114')}}>Gemini Exp 1114</button>
                 <button class="hover:bg-selected px-6 py-2 text-lg" onclick={() => {changeModel('gemini-1.5-pro-002')}}>Gemini Pro 1.5 002</button>
                 <button class="hover:bg-selected px-6 py-2 text-lg" onclick={() => {changeModel('gemini-1.5-pro-latest')}}>Gemini Pro 1.5</button>
                 <button class="hover:bg-selected px-6 py-2 text-lg" onclick={() => {changeModel('gemini-1.5-flash')}}>Gemini Flash 1.5</button>

src/ts/process/request.ts

@@ -1286,6 +1286,7 @@ export async function requestChatDataMain(arg:requestDataArgument, model:'model'
         case 'gemini-1.5-pro-latest':
         case 'gemini-1.5-pro-exp-0801':
         case 'gemini-1.5-pro-exp-0827':
+        case 'gemini-exp-1114':
         case 'gemini-1.5-flash':
         case 'gemini-1.5-pro-002':
         case 'gemini-ultra':