Skip to content

Commit

Permalink
Fix: Add profile picture links
Browse files Browse the repository at this point in the history
  • Loading branch information
akhilalekha committed Jul 12, 2021
1 parent 77819c7 commit fe4ac46
Show file tree
Hide file tree
Showing 10 changed files with 78 additions and 120 deletions.
8 changes: 3 additions & 5 deletions component/layout/BlogListing/AuthorDetails.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,17 +2,15 @@ import styles from "./AuthorDetails.module.scss";
import Image from "next/image";
import Link from "next/link";

export default function Details(props) {
const { username } = props;
// console.log(username);
export default function Details({ username, avatar }) {
return (
<>
<div className={styles.authorDetails}>
<div className={styles.authorDetails__icon}>
<Link href={`/u/${username}`}>
<a>
<Image
src="/images/temp/avatar1.png"
<img
src={avatar ? avatar : "/images/dummy-profile.png"}
alt="Author"
width={150}
height={150}
Expand Down
49 changes: 4 additions & 45 deletions component/layout/BlogListing/ListingFeatured.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -42,54 +42,13 @@ export default function ListingFeatured(props) {
{/* <span>5 Min Read</span> */}
</p>

<Details username={props.blog[0]?.primaryAuthor.username} />
<Details
username={props.blog[0]?.primaryAuthor.username}
avatar={props.blog[0]?.primaryAuthor.avatar}
/>
</div>
</Fade>
</div>
{/* <div className="container container--small md:flex">
<div className="md:w-1/3 md:pr-6">
<Fade>
<figure>
<Image
src="/images/temp/blog-featured.png"
alt="Blog image"
width={380}
height={318}
layout="responsive"
/>
</figure>
</Fade>
</div>
<Fade>
<div className={` ${styles.text} md:w-2/3 md:pl-6`}>
<div className="tags">
<a href="" className="tags__item">
Development
</a>
<a href="" className="tags__item">
Latest Updates
</a>
</div>
<h3>
<Link href="/">
<a>Creative Search Bar and Input Field Design Inspiration</a>
</Link>
</h3>
<p>
A successful UI design can attract new customers, increase
customer engagement and enhance business. A well-designed search
bar and input field will enhance user experience.Styled Search Bar
Design with Code LinkIn the
</p>
<p className={styles.time}>
<span>February 26,2021</span>
<span>5 Min Read</span>
</p>
<Details />
</div>
</Fade>
</div> */}
</section>
);
}
5 changes: 4 additions & 1 deletion component/layout/BlogListing/ListingItem.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -44,7 +44,10 @@ export default function ListingItem(props) {
{/* <span> 5 Min Read</span> */}
</p>
</div>
<Details username={item.primaryAuthor.username} />
<Details
username={item.primaryAuthor.username}
avatar={item.primaryAuthor.avatar}
/>
</div>
))}
</>
Expand Down
75 changes: 30 additions & 45 deletions component/layout/BlogPost/BlogSpotlight.jsx
Original file line number Diff line number Diff line change
@@ -1,50 +1,35 @@
import styles from './BlogSpotlight.module.scss';
import AuthorDetails from '../BlogListing/AuthorDetails';

import moment from 'moment'
import styles from "./BlogSpotlight.module.scss";
import AuthorDetails from "../BlogListing/AuthorDetails";

import moment from "moment";

export default function BlogSpotlight(props) {
const { title, bannerImage, createdAt, primaryAuthor } = props;
const { username } = primaryAuthor;
const { title, bannerImage, createdAt, primaryAuthor } = props;
const { username, avatar } = primaryAuthor;

return (
<>
<section className={styles.postTitle}>
<div className="container">
<div className={styles.title}>
{/* <h2>Creative Search Bar and Input Field Design Inspiration</h2> */}
<h2>
{title}
</h2>
{/* <h3 className="date">12 May 2021</h3> */}
<h3 className="date">{moment(createdAt).format('Do MMMM YYYY')}</h3>
</div>
</div>
</section>
<section className={styles.section}>
<div className={styles.postWrap}>
<figure>
{!bannerImage && (
<img src="/images/temp/blogmain.png" alt=""/>
)}
<img src={bannerImage} alt=""/>
</figure>
<div className={styles.author}>
<div className={styles.item}>
<AuthorDetails
username={username}
/>
</div>
{/* <div className={styles.item}>
<AuthorDetails />
</div>
<div className={styles.item}>
<AuthorDetails />
</div> */}
</div>
return (
<>
<section className={styles.postTitle}>
<div className="container">
<div className={styles.title}>
<h2>{title}</h2>
<h3 className="date">{moment(createdAt).format("Do MMMM YYYY")}</h3>
</div>
</div>
</section>
<section className={styles.section}>
<div className={styles.postWrap}>
<figure>
{!bannerImage && <img src="/images/temp/blogmain.png" alt="" />}
<img src={bannerImage} alt="blog" />
</figure>
<div className={styles.author}>
<div className={styles.item}>
<AuthorDetails username={username} avatar={avatar} />
</div>
</section>
</>
);
}
</div>
</div>
</section>
</>
);
}
32 changes: 16 additions & 16 deletions component/layout/BlogPost/SectionAuthor.jsx
Original file line number Diff line number Diff line change
@@ -1,9 +1,9 @@
import styles from "./SectionAuthor.module.scss";
import Link from "next/link";
import AuthorDetails from "../BlogListing/AuthorDetails";
import styles from "./SectionAuthor.module.scss";

export default function SectionAuthor({ primaryAuthor }) {
const { bio, username } = primaryAuthor;
const { bio, username, avatar } = primaryAuthor;
return (
<section className={`${styles.section} py-10 lg:py-20`}>
<div className="container container--post">
Expand All @@ -19,22 +19,22 @@ export default function SectionAuthor({ primaryAuthor }) {
</div>
<div className={styles.widget}>
<div className={styles.details}>
<AuthorDetails username={username} />
<AuthorDetails username={username} avatar={avatar} />

{/* <div className={styles.stats}>
<div className={styles.statsItem}>
<strong>1157</strong>
<span>Blogs</span>
</div>
<div className={styles.statsItem}>
<strong>45</strong>
<span>Followers</span>
</div>
<div className={styles.statsItem}>
<strong>678</strong>
<span>Following</span>
</div>
</div> */}
<div className={styles.statsItem}>
<strong>1157</strong>
<span>Blogs</span>
</div>
<div className={styles.statsItem}>
<strong>45</strong>
<span>Followers</span>
</div>
<div className={styles.statsItem}>
<strong>678</strong>
<span>Following</span>
</div>
</div> */}
</div>
<div className={styles.description}>
<p>{bio}</p>
Expand Down
5 changes: 4 additions & 1 deletion component/layout/BlogPost/SectionRelated.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -43,7 +43,10 @@ export default function SectionRelated({ title, posts }) {
</a>
</Link>
</h3>
<AuthorDetails username={post.primaryAuthor.username} />
<AuthorDetails
username={post.primaryAuthor.username}
avatar={post.primaryAuthor.avatar}
/>
</div>
</div>
))
Expand Down
8 changes: 5 additions & 3 deletions component/layout/Profile/Profile.js
Original file line number Diff line number Diff line change
Expand Up @@ -37,10 +37,12 @@ export default function Profile({ onLogout, username }) {
<div className={styles.userInfo}>
<div className={styles.profile__icon}>
<img
src={userCookie.avatar}
src={
userCookie.avatar ? userCookie.avatar : "/images/dummy-profile.png"
}
alt="avatar"
width="32"
height="32"
width="32px"
height="32px"
className="rounded-full"
/>
</div>
Expand Down
5 changes: 4 additions & 1 deletion component/layout/SectionBlogs/SectionBlogs.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,10 @@ export default function SectionBlogs(props) {
<a href={`/${item.slug}`}>{item.title}</a>
</h3>

<AuthorDetails username={item.primaryAuthor.username} />
<AuthorDetails
username={item.primaryAuthor.username}
avatar={item.primaryAuthor.avatar}
/>
</div>
))}
</div>
Expand Down
11 changes: 8 additions & 3 deletions pages/settings.js
Original file line number Diff line number Diff line change
Expand Up @@ -85,7 +85,14 @@ export default function Settings({ profileData }) {
userCookie,
profile
);
// console.log(response);

// if (profile.avatar) {
document.cookie = `userNullcast=${JSON.stringify({
...userCookie,
avatar: profile.avatar
})}`;
// console.log(cookies.get("userNullcast"));
// }
notify(response.message);
} catch (err) {
// console.log(err.response.data.message);
Expand All @@ -94,8 +101,6 @@ export default function Settings({ profileData }) {
};
const handleSettings = (e) => {
e.preventDefault();
// console.log(e.target);
// console.log({ profile });
updateProfile();
};

Expand Down
Binary file added public/images/dummy-profile.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit fe4ac46

Please sign in to comment.