Ahsan AI Assistant Website

 Welcome to Ahsan AI Assistant! This guide will walk you through all the features of the application.

Part 1: Getting Started - Account Management

1. Registration:

   • Navigate to the "Register" page (if you're not already there).
   • You'll see fields for Email, Password, and Confirm Password.
   • Email: Enter a valid email address.
   • Password: Create a strong password. It must be at least 8 characters long and include at least one uppercase letter, one lowercase letter, one number, and one special character (e.g., !, @, #, $).
   • Confirm Password: Re-enter your password to ensure it matches.
   • Complete the hCaptcha verification by checking the "I am human" box and following any prompts.
   • Click the "Register" button.
   • Email Verification: A verification email will be sent to the address you provided. Check your inbox (and spam/junk folder). Click the verification link in the email to activate your account.

2. Logging In:

   • Go to the "Login" page.
   • Enter your registered Email and Password.
   • Complete the hCaptcha verification.
   • Click the "Login" button.
   • If your email is verified, you'll be taken to the Chat page. If not, you'll be redirected to the "Verify Email" page.

3. Forgot Password:

   • If you've forgotten your password, click the "Forgot Password?" link on the Login page.
   • Enter your registered email address.
   • Click "Send Reset Link".
   • An email with instructions to reset your password will be sent to your email address (if an account exists for that email). Check your inbox and spam folder.

4. Email Verification (If not done during registration):

   • If you log in and your email isn't verified, you'll be taken to the "Verify Your Email" page.
   • It will show the email address the verification link was sent to.
   • Check Your Email: Find the verification email and click the link.
   • Resend Email: If you can't find it, click "Resend Verification Email".
   • Check Status: Once you've clicked the link in your email, click "I've Verified, Check Status" on the webpage. You should then be redirected to the Chat page.
     
     
     
     
     
     
     
     
     

Part 2: The Main Interface - Chatting with Ahsan AI

Once logged in and verified, you'll land on the main Chat page.

1. Sidebar Navigation (Left Panel):

   • Ahsan AI Logo & Name: At the top, acts as a home/chat link.
   • New Chat Button:
     • Click this to start a fresh chat session. This clears the current chat view on your screen but preserves your entire chat history, which you can access later. A confirmation dialog will appear before starting a new session.
   • Navigation Links:
     • Chat: Takes you to the main AI chat interface.
     • Image Generator: (Currently shows a "Coming Soon" page).
     • Chat History: View your past conversations.
     • About Developer: Learn more about Ahsan Ali, the creator of this assistant.
   • User Role Selection:
     • Choose your role (e.g., General, Student, Developer, Content Creator, Beginner). The AI will tailor its responses to be more helpful for your selected role.
   • Theme Selection:
     • Choose between Light, Dark, or System theme to customize the app's appearance. Your preference is saved.
   • Daily Tip:
     • A helpful motivational, educational, tech, productivity, or well-being tip is displayed here. It changes daily!
   • User Profile Section (Bottom of Sidebar):
     • Profile Picture: Displays your current profile picture. Click it to open a dialog to update your picture using an image URL.
       • Updating Profile Picture:
         • Click your avatar.
         • In the dialog, paste a direct URL to your desired image (e.g., one ending in .jpg, .png).
         • You can click "Watch Tutorial" to open a video guide on how to get an image URL.
         • Click "Save Picture".
     • Display Name: Shows your current display name. Click it to open a dialog and change it.
     • Email Address: Your registered email address is displayed.
     • Reset Password Button: Allows you to send a password reset link to your email if you want to change your password while logged in.
     • Logout Button: Securely logs you out of the application.

2. Chat Area:

   • Header: Displays "AI Chat Room". This header is fixed and won't scroll.
   • Welcome Message (for new sessions/empty chats):
     • A friendly greeting from Ahsan AI Assistant with some information about the developer, Ahsan Ali, and clickable links to his social media profiles (Instagram, Website, Facebook, Twitter).
   • Message Bubbles:
     • Your messages appear on the right, typically in a primary color.
     • AI responses appear on the left, typically in a card/secondary color.
     • Each message shows an avatar (your profile picture or initial for you, AI icon for the assistant).
   • Message Actions (appear when you hover over a message bubble, typically at the top-right):
     • Copy Full Message: (Copy icon) Copies the entire text content of that specific message bubble to your clipboard.
     • Copy Selected Text: (Grab/Hand icon) Allows you to first select a portion of text within that message bubble with your mouse, and then click this button to copy only your selection.
     • Regenerate AI Response: (Refresh icon, appears only on AI messages) Click this to ask the AI to generate a new response for the preceding user prompt.
     • Message Version Arrows: (ChevronLeft/ChevronRight icons, appear only on your user messages if they have been edited)
       • If you edit one ofyour messages, it creates a new version.
       • Use these arrows to navigate between different versions of your message. The AI's response displayed will correspond to the user message version you are currently viewing.
       • The text "(Edited: [time])" and "Version X of Y" will appear on edited messages.
   • Typing Indicator: When the AI is processing your request, a "Ahsan AI is typing..." indicator will appear.

3. Chat Input Area (Footer):

   • This area is fixed at the bottom and won't scroll.
   • Textarea: Type your message to the AI here. Press Enter to send, or Shift+Enter for a new line. The input box will expand automatically as you type, up to a certain height.
   • Send Button: (Paper plane icon) Click to send your message. Becomes disabled while the AI is responding.
   • Disclaimer: "AI-generated responses may not always be 100% accurate. Please verify critical information."
   • Footer Links:
     • Feedback: Click to open a Google Form where you can provide feedback about the application.
     • Support: Click to open a Tawk.to live chat window to get help or report issues.
     • Need Help? Chat with Agent: Also opens the Tawk.to live chat window for direct assistance.
       
       
       
       
       
       
       
       

Part 3: Chat History Page

• Access this page from the sidebar.
• View Past Conversations: All your previous chat messages (from all sessions) are displayed here, grouped by date.
• Search Bar: Type keywords to search through your entire chat history (both your messages and AI responses).
• Message Display:
  • Similar to the main chat, user messages are on the right, AI on the left.
  • All Versions Shown: If a user message was edited, all versions of that user message will be displayed, each followed by the AI response that was generated for that specific version.
  • This allows you to see the full evolution of a conversation.
• Message Actions (on hover):
  • Copy Full Message: Works the same as in the main chat.
  • Copy Selected Text: Works the same as in the main chat.
• Clear History Button:
  • (Trash icon) Allows you to permanently delete your entire chat history. A confirmation dialog will appear before deletion.

Part 4: Image Generator Page

• Currently, this page shows a "Coming Soon!" message. This feature is under development.

Part 5: About Developer Page

• Learn more about Ahsan Ali, the student and developer behind Ahsan AI Assistant.
• Find clickable links to his social media profiles (Instagram, Website, Facebook, Twitter).
• Displays the application version (e.g., Version 1.0.0).

General Tips:

• Responsiveness: The application is designed to work well on desktops, tablets, and mobile phones.
• Theme: Don't forget you can switch between light, dark, and system themes using the selector in the sidebar for your viewing comfort.
• User Role: Experiment with different user roles in the sidebar to see how the AI's responses change!

We hope you enjoy using Ahsan AI Assistant!