use discord credentials when available

discord-bot/README.md

@@ -51,6 +51,20 @@ Remember to save your changes.
 https://discord.com/oauth2/authorize?client_id=YOUR_CLIENT_ID_HERE&permissions=8&scope=bot%20applications.commands
 ```
 
+## Discord setup for development
+
+- Create `DISCORD_CLIENT_ID` and `DISCORD_CLIENT_SECRET` keys in the `.env` file
+  in `website`.
+- Go to `https://discord.com/developers/applications` and click on
+  `New Application` and create a new application.
+- Once the new application is created, you will have access to `Client ID` and
+  `Client Secret` in the `OAuth2` section. Copy those values and paste for the
+  respective fields in the `.env` file.
+- In the `Oauth2` section, there is an field called `Redirects` which has to be
+  provided with the following URL. This URL is nothing but the discord callback
+  URL which NextAuth uses - `http://localhost:3000/api/auth/callback/discord`
+  (The PORT number for the localhost could be different based on your setup)
+
 ### Environment Setup
 
 To run the bot:

package-lock.json

@@ -0,0 +1,6 @@
+{
+  "name": "Open-Assistant",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {}
+}

website/.env

@@ -12,3 +12,6 @@ NEXTAUTH_SECRET=O/M2uIbGj+lDD2oyNa8ax4jEOJqCPJzO53UbWShmq98=
 EMAIL_SERVER_HOST=localhost
 EMAIL_SERVER_PORT=1025
 EMAIL_FROM=info@example.com
+
+DISCORD_CLIENT_ID=1058355952459452446
+DISCORD_CLIENT_SECRET=Fz_I1wnexVaCty9zFRscDBQN-gBPcil_

website/.gitignore

@@ -27,6 +27,7 @@ yarn-error.log*
 
 # local env files
 .env*.local
+.env
 
 # vercel
 .vercel

website/next.config.js

@@ -2,6 +2,14 @@
 const nextConfig = {
   output: "standalone",
   reactStrictMode: true,
+  images: {
+    remotePatterns: [
+      {
+        protocol: 'https',
+        hostname: '**.discordapp.com',
+      },
+    ],
+  },
   experimental: {
     /* Disabling this for now only because it causes a warning in the console that cannot be silenced for eslint
        If this can be resolved, we should re-enable this.

website/src/components/Header/UserMenu.tsx

@@ -30,7 +30,7 @@ export function UserMenu() {
             <Popover.Button aria-label="Toggle Account Options" className="flex">
               <div className="flex items-center gap-4 p-1 lg:pr-6 rounded-full border border-slate-300/70 hover:bg-gray-200/50 transition-colors duration-300">
                 <Image
-                  src="/images/temp-avatars/av1.jpg"
+                  src={session.user.image || "/images/temp-avatars/av1.jpg"}
                   alt="Profile Picture"
                   width="40"
                   height="40"