Creating the Batch page #13
Conversation
|
@leojay-net is attempting to deploy a commit to the BuidlGuidl Team on Vercel. A member of the Team first needs to authorize it. |
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
There was a problem hiding this comment.
Your PR's only purpose is to add your personal page to the project.
However, it also includes code related to the Check-in.
Please make sure to remove any unrelated code from this PR.
Let me know on Telegram if you need help doing that with Git.
There was a problem hiding this comment.
This change is also unrelated to your personal page, please remove it from the PR.
There was a problem hiding this comment.
This change is also unrelated to your personal page, please remove it from the PR.
There was a problem hiding this comment.
This change is also unrelated to your personal page, please remove it from the PR.
| </h1> | ||
| <div className="flex items-center gap-2 mt-1"> | ||
| <div className="px-2 py-1 bg-gray-100 rounded-full text-xs font-medium text-blue-600 flex items-center"> | ||
| <span>{truncateAddress(walletAddress)}</span> |
There was a problem hiding this comment.
There's a component in the project specifically for displaying addresses in a visually appealing way. You should check it out.
| rel="noopener noreferrer" | ||
| aria-label={`${link.platform} profile`} | ||
| > | ||
| <img src={link.icon} alt={link.platform} className="w-full h-full object-cover" /> |
There was a problem hiding this comment.
It's recommended to use Next's <Image> component for better performance when displaying images.
| <div className="flex flex-col items-center md:flex-row md:gap-6"> | ||
| {/* Avatar */} | ||
| <div className="w-28 h-28 rounded-full border-4 border-gray-200 shadow-lg overflow-hidden"> | ||
| <img src={avatarUrl} alt={name} className="w-full h-full object-cover" /> |
There was a problem hiding this comment.
Use Next's <Image> here as well.
| import React, { useState } from "react"; | ||
| import { Check, Copy, ExternalLink } from "lucide-react"; | ||
|
|
||
| const Web3Profile = () => { |
There was a problem hiding this comment.
Since there will be many profiles, give your page a unique name. Use your name or nickname.
And it's also a good idea to explicitly add the NextPage type.
There was a problem hiding this comment.
This change is also unrelated to your personal page, please remove it from the PR.
There was a problem hiding this comment.
You're not using Chai, Hardhat, or Mocha on your personal page, so it's better to remove them.
Also, there are many unrelated changes in yarn.lock. I recommend resetting the file and reinstalling the dependencies so that only the changes related to lucide-react remain.
Description
I created a page.tsx file in the app/builders/[address]/ directory and implemented a component to display my profile/Batch page. The component features an avatar, full name, nickname, wallet address, an 'About' section, and a 'Socials' section, providing a comprehensive overview of my profile.
Additional Information
Related Issues
_Closes #8
Your ENS/address:
0xA35D2C518710D3f953Ce4F69CDDEAaFc0c6b156c