Add user profile to user page
This commit is contained in:
parent
bb846def85
commit
2678450ecf
|
@ -62,11 +62,20 @@ export const fetchComments = async (galleryID: string): Promise<Comment[]> => {
|
|||
/* eslint-enable max-len */
|
||||
}
|
||||
|
||||
export const fetchUserInfo = async (userID: string): Promise<UserResult> => {
|
||||
// https://api.imgur.com/account/v1/accounts/hughjaniss?client_id=${CLIENT_ID}
|
||||
const response = await got(
|
||||
`https://api.imgur.com/account/v1/accounts/${userID.toLowerCase()}?client_id=${CONFIG.imgur_client_id}&include=`,
|
||||
{ agent }
|
||||
);
|
||||
return JSON.parse(response.body);
|
||||
}
|
||||
|
||||
export const fetchUserPosts = async (userID: string, sort: Sorting = 'newest'): Promise<Post[]> => {
|
||||
/* eslint-disable max-len */
|
||||
// https://api.imgur.com/3/account/mombotnumber5/submissions/0/newest?album_previews=1&client_id=${CLIENT_ID}
|
||||
const response = await got(
|
||||
`https://api.imgur.com/3/gallery/${userID.toLowerCase()}/submissions/0/${sort}?album_previews=1&client_id=${CONFIG.imgur_client_id}`,
|
||||
`https://api.imgur.com/3/account/${userID.toLowerCase()}/submissions/0/${sort}?album_previews=1&client_id=${CONFIG.imgur_client_id}`,
|
||||
{ agent }
|
||||
);
|
||||
return JSON.parse(response.body).data;
|
||||
|
|
|
@ -1,7 +1,9 @@
|
|||
import Hapi = require('@hapi/hapi');
|
||||
import '@hapi/vision';
|
||||
import { fetchAlbum, fetchAlbumURL, fetchComments, fetchGallery, fetchMedia, fetchTagPosts, fetchUserPosts }
|
||||
from './fetchers';
|
||||
import
|
||||
{
|
||||
fetchAlbum, fetchAlbumURL, fetchComments, fetchGallery, fetchMedia, fetchTagPosts, fetchUserInfo, fetchUserPosts
|
||||
} from './fetchers';
|
||||
import * as util from './util';
|
||||
|
||||
import CONFIG from './config';
|
||||
|
@ -42,9 +44,11 @@ export const handleUser = async (request: Hapi.Request, h: Hapi.ResponseToolkit)
|
|||
return 'User page disabled. Rimgu administrator needs to enable API for this to work.';
|
||||
}
|
||||
const userID = request.params.userID;
|
||||
const user = await fetchUserInfo(userID);
|
||||
const posts = await fetchUserPosts(userID);
|
||||
return h.view('user-posts', {
|
||||
posts,
|
||||
user,
|
||||
pageTitle: CONFIG.page_title,
|
||||
util,
|
||||
});
|
||||
|
|
|
@ -128,3 +128,16 @@ interface TagResult extends PostTag {
|
|||
success: boolean;
|
||||
status: number;
|
||||
}
|
||||
|
||||
interface UserResult {
|
||||
id: number;
|
||||
username: string;
|
||||
bio: string;
|
||||
reputation_count: number;
|
||||
reputation_name: string;
|
||||
avatar_id: string;
|
||||
avatar_url: string;
|
||||
cover_id: string;
|
||||
cover_url: string;
|
||||
created_at: string;
|
||||
}
|
||||
|
|
|
@ -390,8 +390,66 @@ Post-item-title {
|
|||
max-height: 500px;
|
||||
}
|
||||
|
||||
/* USER HEADER */
|
||||
|
||||
/* TAG PAGE */
|
||||
.ProfileMeta-stats {
|
||||
font-size: 14px;
|
||||
font-weight: 600;
|
||||
text-transform: uppercase;
|
||||
margin-top: 8px;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.ProfileCover-header {
|
||||
height: 258px;
|
||||
/* padding: 52px 0 0; */
|
||||
padding: 52px 16px 0;
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
min-width: 450px;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.ProfileMeta {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
.ProfileMeta .UserAvatar {
|
||||
position: relative;
|
||||
height: 128px;
|
||||
width: 128px;
|
||||
overflow: hidden;
|
||||
flex-grow: 0;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.UserAvatar {
|
||||
border-radius: 50%;
|
||||
background: grey;
|
||||
background-image: none;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.ProfileMeta-data {
|
||||
margin: auto 24px;
|
||||
color: #f2f2f2;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.ProfileMeta-user {
|
||||
font-size: 44px;
|
||||
font-family: Proxima Nova ExtraBold,Helvetica Neue,Helvetica,Arial,sans-serif;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.ProfileMeta-divider {
|
||||
margin: auto 15px;
|
||||
}
|
||||
|
||||
|
||||
/* TAG HEADER */
|
||||
|
||||
.Cover-item-count {
|
||||
text-transform: uppercase;
|
||||
|
|
|
@ -11,7 +11,16 @@ html
|
|||
.Cover-stats
|
||||
.Cover-item-count #{tag.total_items} posts
|
||||
else if user
|
||||
.App-cover.NewCover.ProfileCover
|
||||
.App-cover.NewCover.ProfilesCover(style='background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), url("' + util.proxyURL(user.cover_url) + '");')
|
||||
.ProfileCover-header
|
||||
.ProfileMeta
|
||||
span.UserAvatar.ProfileMeta-avatar(style='background-image: url("' + util.proxyURL(user.avatar_url) + '");' title=user.username)
|
||||
.ProfileMeta-data
|
||||
.ProfileMeta-user= user.username
|
||||
.ProfileMeta-stats
|
||||
| #{user.reputation_count} pts
|
||||
span.ProfileMeta-divider •
|
||||
| #{user.reputation_name}
|
||||
.ProfilePosts-posts
|
||||
.ProfilePosts-top
|
||||
each post in posts
|
||||
|
@ -54,5 +63,3 @@ html
|
|||
title Post views
|
||||
| <path d="M8 2.5C4.74998 2.5 2.30142 5.50267 1.27514 6.77517C0.925337 7.20917 0.908553 7.76483 1.2278 8.16583C2.22527 9.41833 4.6991 12.5 8 12.5C11.3686 12.5 13.8396 9.31133 14.796 8.0905C15.0769 7.732 15.0674 7.2535 14.7692 6.8755C13.7938 5.6395 11.3376 2.5 8 2.5ZM7.98224 9.33333C6.90897 9.33333 6.03887 8.51233 6.03887 7.5C6.03887 6.4875 6.90897 5.66667 7.98224 5.66667C9.05551 5.66667 9.92561 6.4875 9.92561 7.5C9.92561 8.51233 9.05551 9.33333 7.98224 9.33333Z" fill="currentColor"></path>
|
||||
.MediaBody= post.views
|
||||
|
||||
|
||||
|
|
Loading…
Reference in New Issue