Skip to content

Commit

Permalink
feat : added username is still available? , added discord and fixed s…
Browse files Browse the repository at this point in the history
…ocial links
  • Loading branch information
surajhub255 committed Nov 6, 2024
1 parent 006cc05 commit b27758f
Show file tree
Hide file tree
Showing 4 changed files with 225 additions and 9 deletions.
102 changes: 102 additions & 0 deletions src/app/[username]/page.js
Original file line number Diff line number Diff line change
Expand Up @@ -43,6 +43,12 @@ function HomePage({ params }) {
const [showCreatorOptions, setShowCreatorOptions] = useState(false);
const [hoveredOption, setHoveredOption] = useState(null);
const [status, setStatus] = useState('');
const [discord, setDiscord] = useState('');
const [selectedSocialLink, setSelectedSocialLink] = useState('');
const [link, setLink] = useState('');
const [guestdiscord, setGuestDiscord] = useState('');
const [guestselectedSocialLink, setGuestSelectedSocialLink] = useState('');
const [guestlink, setGuestLink] = useState('');

const apikey = process.env.NEXT_PUBLIC_MORALIS_API_KEY;
const baseUri = process.env.NEXT_PUBLIC_URI || 'https://app.myriadflow.com';
Expand Down Expand Up @@ -106,6 +112,9 @@ function HomePage({ params }) {
setGuestX(data.x);
setGuestInstagram(data.instagram);
setGuestWalletAddress(data.wallet_address);
setGuestDiscord(data.discord);
setGuestSelectedSocialLink(data.selected_social_link);
setGuestLink(data.link);
} else {
console.log('No user found');
}
Expand Down Expand Up @@ -139,6 +148,9 @@ function HomePage({ params }) {
setX(data.x);
setInstagram(data.instagram);
setBaseName(data.basename);
setDiscord(data.discord);
setSelectedSocialLink(data.selected_social_link);
setLink(data.link);
} else {
console.log('No user found');
}
Expand Down Expand Up @@ -519,6 +531,51 @@ function HomePage({ params }) {
<img src='/insta.png' style={{ height: '30px', width: '30px', marginLeft: '10px' }} alt="Instagram" />
</a>
)}
{discord && (
<a href={discord} target="_blank" rel="noopener noreferrer">
<img src='/discord.png' style={{ height: '30px', width: '30px', marginLeft: '10px' }} alt="Instagram" />
</a>
)}
{selectedSocialLink === "youtube" && link && (
<a href={link} target="_blank" rel="noopener noreferrer">
<img src='/youtube.png' style={{ height: '30px', width: '30px', marginLeft: '10px' }} alt="Instagram" />
</a>
)}
{selectedSocialLink === "telegram" && link && (
<a href={link} target="_blank" rel="noopener noreferrer">
<img src='/telegram.png' style={{ height: '30px', width: '30px', marginLeft: '10px' }} alt="Instagram" />
</a>
)}
{selectedSocialLink === "linkedin" && link && (
<a href={link} target="_blank" rel="noopener noreferrer">
<img src='/linkedin.png' style={{ height: '30px', width: '30px', marginLeft: '10px' }} alt="Instagram" />
</a>
)}
{selectedSocialLink === "whatsapp" && link && (
<a href={link} target="_blank" rel="noopener noreferrer">
<img src='/whatsapp.png' style={{ height: '30px', width: '30px', marginLeft: '10px' }} alt="Instagram" />
</a>
)}
{selectedSocialLink === "google" && link && (
<a href={link} target="_blank" rel="noopener noreferrer">
<img src='/google.png' style={{ height: '30px', width: '30px', marginLeft: '10px' }} alt="Instagram" />
</a>
)}
{selectedSocialLink === "tiktok" && link && (
<a href={link} target="_blank" rel="noopener noreferrer">
<img src='/tiktok.png' style={{ height: '30px', width: '30px', marginLeft: '10px' }} alt="Instagram" />
</a>
)}
{selectedSocialLink === "snapchat" && link && (
<a href={link} target="_blank" rel="noopener noreferrer">
<img src='/snapchat.png' style={{ height: '30px', width: '30px', marginLeft: '10px' }} alt="Instagram" />
</a>
)}
{selectedSocialLink === "pinterest" && link && (
<a href={link} target="_blank" rel="noopener noreferrer">
<img src='/pinterest.png' style={{ height: '30px', width: '30px', marginLeft: '10px' }} alt="Instagram" />
</a>
)}
</div>

<div style={{ marginTop: '2.5rem', padding: '1.5rem', backgroundColor: '#FFFFFF', borderRadius: '0.5rem', boxShadow: '0 10px 10px rgba(0, 0, 0, 0.1)' }}>
Expand Down Expand Up @@ -863,6 +920,51 @@ function HomePage({ params }) {
<img src='/insta.png' style={{ height: '30px', width: '30px', marginLeft: '10px' }} alt="Instagram" />
</a>
)}
{guestdiscord && (
<a href={guestdiscord} target="_blank" rel="noopener noreferrer">
<img src='/discord.png' style={{ height: '30px', width: '30px', marginLeft: '10px' }} alt="Instagram" />
</a>
)}
{guestselectedSocialLink === "youtube" && guestlink && (
<a href={guestlink} target="_blank" rel="noopener noreferrer">
<img src='/youtube.png' style={{ height: '30px', width: '30px', marginLeft: '10px' }} alt="Instagram" />
</a>
)}
{guestselectedSocialLink === "telegram" && guestlink && (
<a href={guestlink} target="_blank" rel="noopener noreferrer">
<img src='/telegram.png' style={{ height: '30px', width: '30px', marginLeft: '10px' }} alt="Instagram" />
</a>
)}
{guestselectedSocialLink === "linkedin" && guestlink && (
<a href={guestlink} target="_blank" rel="noopener noreferrer">
<img src='/linkedin.png' style={{ height: '30px', width: '30px', marginLeft: '10px' }} alt="Instagram" />
</a>
)}
{guestselectedSocialLink === "whatsapp" && guestlink && (
<a href={guestlink} target="_blank" rel="noopener noreferrer">
<img src='/whatsapp.png' style={{ height: '30px', width: '30px', marginLeft: '10px' }} alt="Instagram" />
</a>
)}
{guestselectedSocialLink === "google" && guestlink && (
<a href={guestlink} target="_blank" rel="noopener noreferrer">
<img src='/google.png' style={{ height: '30px', width: '30px', marginLeft: '10px' }} alt="Instagram" />
</a>
)}
{guestselectedSocialLink === "tiktok" && guestlink && (
<a href={guestlink} target="_blank" rel="noopener noreferrer">
<img src='/tiktok.png' style={{ height: '30px', width: '30px', marginLeft: '10px' }} alt="Instagram" />
</a>
)}
{guestselectedSocialLink === "snapchat" && guestlink && (
<a href={guestlink} target="_blank" rel="noopener noreferrer">
<img src='/snapchat.png' style={{ height: '30px', width: '30px', marginLeft: '10px' }} alt="Instagram" />
</a>
)}
{guestselectedSocialLink === "pinterest" && guestlink && (
<a href={guestlink} target="_blank" rel="noopener noreferrer">
<img src='/pinterest.png' style={{ height: '30px', width: '30px', marginLeft: '10px' }} alt="Instagram" />
</a>
)}
</div>

<div style={{ marginTop: '2.5rem', padding: '1.5rem', backgroundColor: '#FFFFFF', borderRadius: '0.5rem', boxShadow: '0 10px 10px rgba(0, 0, 0, 0.1)' }}>
Expand Down
38 changes: 37 additions & 1 deletion src/app/elevate-africa/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,7 @@ export default function Home() {
const [email, setEmail] = useState('')
const [tosChecked, setTosChecked] = useState(false)
const [newsletterChecked, setNewsletterChecked] = useState(false)
const [allusernames, setAllUsernames] = useState([]);

const baseUri = process.env.NEXT_PUBLIC_URI || 'https://app.myriadflow.com'

Expand Down Expand Up @@ -76,6 +77,35 @@ export default function Home() {
checkEmailExists()
}, [address])

useEffect(() => {
if (address) {
const getAllProfile = async () => {
try {
const usernameData = await fetch(`${baseUri}/profiles/all`, {
method: "GET",
headers: {
'Content-Type': 'application/json',
},
});

if (usernameData.ok) {
const usernamedata = await usernameData.json();
setAllUsernames(usernamedata);
}
} catch (error) {
console.error('Error fetching address data', error);
}
};

getAllProfile();
}
}, [address])

interface Profile {
username: string;
}
const allusername: Profile[] = allusernames;

const handleSubmit = async () => {
if (userName.length < 4) {
setValidationError('Username must be at least 4 characters long.')
Expand All @@ -86,7 +116,13 @@ export default function Home() {
} else if (userName.includes(' ')) {
setValidationError('Username cannot contain spaces.')
return
} else {
} else if (allusername.some(profile => profile.username === userName)) {
setValidationError('This username is already taken.');
return;
} else if (!/^[a-z]+$/.test(userName)) {
setValidationError('Username can only contain letters (no special characters).');
return;
} else {
setValidationError('')
}

Expand Down
38 changes: 37 additions & 1 deletion src/app/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,7 @@ export default function Home() {
const [email, setEmail] = useState('')
const [tosChecked, setTosChecked] = useState(false)
const [newsletterChecked, setNewsletterChecked] = useState(false)
const [allusernames,setAllUsernames] = useState([]);

const baseUri = process.env.NEXT_PUBLIC_URI || 'https://app.myriadflow.com'

Expand Down Expand Up @@ -76,6 +77,35 @@ export default function Home() {
checkEmailExists()
}, [address])

useEffect(() => {
if (address) {
const getAllProfile = async () => {
try {
const usernameData = await fetch(`${baseUri}/profiles/all`, {
method: "GET",
headers: {
'Content-Type': 'application/json',
},
});

if (usernameData.ok) {
const usernamedata = await usernameData.json();
setAllUsernames(usernamedata);
}
} catch (error) {
console.error('Error fetching address data', error);
}
};

getAllProfile();
}
}, [address])

interface Profile {
username: string;
}
const allusername: Profile[] = allusernames;

const handleSubmit = async () => {
if (userName.length < 4) {
setValidationError('Username must be at least 4 characters long.')
Expand All @@ -86,7 +116,13 @@ export default function Home() {
} else if (userName.includes(' ')) {
setValidationError('Username cannot contain spaces.')
return
} else {
} else if (allusername.some(profile => profile.username === userName)) {
setValidationError('This username is already taken.');
return;
} else if (!/^[a-z]+$/.test(userName)) {
setValidationError('Username can only contain letters (no special characters).');
return;
} else {
setValidationError('')
}

Expand Down
56 changes: 49 additions & 7 deletions src/app/profile-setting/page.js
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,8 @@ function ProfileSettingsPage() {
const [website, setWebsite] = useState('');
const [x, setx] = useState('');
const [instagram, setInstagram] = useState('');
const [discord, setDiscord] = useState('');
const [allusernames,setAllUsernames] = useState([]);
const [coverImage, setCoverImage] = useState('');
const [profileImage, setProfileImage] = useState('');
const [email, setEmail] = useState('');
Expand Down Expand Up @@ -118,6 +120,12 @@ function ProfileSettingsPage() {
} else if (userName.includes(' ')) {
setValidationError('Username cannot contain spaces.');
return;
} else if (allusernames.some(profile => profile.username === userName)) {
setValidationError('This username is already taken.');
return;
} else if (!/^[a-z]+$/.test(userName)) {
setValidationError('Username can only contain letters (no special characters).');
return;
} else {
setValidationError('');
}
Expand All @@ -130,6 +138,7 @@ function ProfileSettingsPage() {
website: website,
x: x,
instagram: instagram,
discord: discord,
cover_image: coverImage,
profile_image: profileImage,
selected_social_link: selectedSocialLink,
Expand Down Expand Up @@ -266,6 +275,7 @@ function ProfileSettingsPage() {
setWebsite(data.website);
setx(data.x);
setInstagram(data.instagram);
setDiscord(data.discord);
setSelectedSocialLink(data.selected_social_link);
setLink(data.link);
setEmail(data.email);
Expand Down Expand Up @@ -304,6 +314,30 @@ function ProfileSettingsPage() {
}
}, [profileid])

useEffect(() => {
if (address) {
const getAllProfile = async () => {
try {
const usernameData = await fetch(`${baseUri}/profiles/all`, {
method: "GET",
headers: {
'Content-Type': 'application/json',
},
});

if (usernameData.ok) {
const usernamedata = await usernameData.json();
setAllUsernames(usernamedata);
}
} catch (error) {
console.error('Error fetching address data', error);
}
};

getAllProfile();
}
}, [address])

return (
<>
<div style={{ zIndex: 10, position: 'fixed', left: 0, right: 0, top: 0 }}>
Expand Down Expand Up @@ -541,6 +575,18 @@ function ProfileSettingsPage() {
style={{ padding: '10px', borderRadius: '8px', border: '1px solid #D1D5DB', width: '50%', marginBottom: '20px' }}
/>

<label style={{ display: 'block', fontWeight: '500', marginBottom: '10px' }}>Discord</label>
<input
className='w-1/2'
type='text'
value={discord}
onChange={(e) => {
setDiscord(e.target.value);
setIsEditing(true);
}}
style={{ padding: '10px', borderRadius: '8px', border: '1px solid #D1D5DB', width: '50%', marginBottom: '20px' }}
/>

<select
className='border-0 bg-[#0000001A] rounded w-1/2 h-10 mt-8 mb-6'
style={{ display: 'block' }}
Expand Down Expand Up @@ -634,20 +680,16 @@ function ProfileSettingsPage() {
style={{ display: 'block', marginBottom: '10px', padding: '10px', borderRadius: '8px', border: '1px solid #D1D5DB' }}
/>
<label style={{ display: 'block', fontWeight: '500', marginBottom: '10px' }}>Country</label>
<select
<input
className='w-1/2'
type='text'
value={address.country}
onChange={(e) => {
handleAddressChange(index, 'country', e.target.value);
setIsEditing(true);
}}
style={{ display: 'block', marginBottom: '10px', padding: '10px', borderRadius: '8px', border: '1px solid #D1D5DB' }}
>
<option value=''>+ Choose</option>
{countries.map((country, i) => (
<option key={i} value={country}>{country}</option>
))}
</select>
/>
<button className='p-4' style={{
backgroundColor: '#7D4AB5',
color: '#ffffff',
Expand Down

0 comments on commit b27758f

Please sign in to comment.