Merge pull request #7 from perkinsjr/userbutton

Removes the image and adds the UserButton

src/pages/index.tsx

@@ -1,4 +1,4 @@
-import { SignInButton, useUser } from "@clerk/nextjs";
+import { SignInButton, UserButton, useUser } from "@clerk/nextjs";
 import { type NextPage } from "next";
 
 import { api } from "~/utils/api";
@@ -37,13 +37,14 @@ const CreatePostWizard = () => {
  return (
 
  <div className="flex w-full gap-3">
- <Image
- src={user.profileImageUrl}
- alt="Profile image"
- className="h-14 w-14 rounded-full"
- width={56}
- height={56}
- />
+ <UserButton appearance={{
+ elements: {
+ userButtonAvatarBox: {
+ width: 56,
+ height: 56
+ }
+ }
+ }} />
  <input
  placeholder="Type some emojis!"
  className="grow bg-transparent outline-none"