0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-02-17 23:44:39 -05:00

Updated details

This commit is contained in:
Peter Zimon 2025-02-17 17:10:47 +01:00
parent 5cef5d9f20
commit 690888f3ea
3 changed files with 21 additions and 18 deletions

View file

@ -1,10 +1,9 @@
import * as React from 'react';
import APAvatar from '@components/global/APAvatar';
import ActivityItem from '@components/activities/ActivityItem';
import Separator from '@components/global/Separator';
import getName from '@utils/get-name';
import getUsername from '@utils/get-username';
import {Skeleton} from '@tryghost/shade';
import {H4, LucideIcon, Skeleton} from '@tryghost/shade';
import {handleProfileClick} from '@utils/handle-profile-click';
import {useSuggestedProfilesForUser} from '@hooks/use-activity-pub-queries';
@ -14,8 +13,16 @@ const Recommendations: React.FC = () => {
const suggested = suggestedData || Array(3).fill({actor: {}});
return (
<div>
<h2 className='mb-1 text-lg font-semibold'>Suggestions to follow</h2>
<div className='px-3'>
<div className='mb-3 flex flex-col gap-0.5'>
<div className='flex items-center gap-2'>
<LucideIcon.Globe className='text-purple-500' size={20} strokeWidth={1.5} />
<H4>Follow suggestions</H4>
</div>
<span className='text-sm text-gray-600'>
Accounts you might be interested in
</span>
</div>
<ul className='grow'>
{suggested.map((profile, index) => {
const actor = profile.actor;
@ -26,13 +33,12 @@ const Recommendations: React.FC = () => {
onClick={() => handleProfileClick(actor)}
>
{!isLoadingSuggested ? <APAvatar author={actor} /> : <Skeleton className='z-10 h-10 w-10' />}
<div className='flex min-w-0 flex-col'>
<span className='block w-full truncate font-semibold text-black'>{!isLoadingSuggested ? getName(actor) : <Skeleton className='w-24' />}</span>
<span className='block w-full truncate text-sm text-gray-600'>{!isLoadingSuggested ? getUsername(actor) : <Skeleton className='w-40' />}</span>
<div className='flex min-w-0 flex-col'>
<span className='block max-w-[190px] truncate font-semibold text-black'>{!isLoadingSuggested ? getName(actor) : <Skeleton className='w-24' />}</span>
<span className='block max-w-[190px] truncate text-sm text-gray-600'>{!isLoadingSuggested ? getUsername(actor) : <Skeleton className='w-40' />}</span>
</div>
</ActivityItem>
</li>
{index < suggested.length - 1 && <Separator />}
</React.Fragment>
);
})}

View file

@ -19,8 +19,8 @@ const Sidebar: React.FC<SidebarProps> = ({route}) => {
'[&>*]:pointer-events-auto'
)}
>
<div className='flex flex-col gap-8 pl-5 pt-5'>
<div className='flex flex-col gap-px'>
<div className='flex w-full flex-col items-start gap-8 pl-4 pt-4'>
<div className='flex w-full flex-col gap-px'>
<SidebarButton active={route === 'inbox'} onClick={() => updateRoute('inbox')}>
<LucideIcon.Inbox size={18} strokeWidth={1.5} />
Inbox
@ -38,13 +38,10 @@ const Sidebar: React.FC<SidebarProps> = ({route}) => {
Profile
</SidebarButton>
</div>
<div>
<Button className='rounded-full bg-purple-500' onClick={() => updateRoute('feed')}>
<LucideIcon.FilePen />
New note
</Button>
</div>
<Button className='rounded-full bg-purple-500' onClick={() => updateRoute('feed')}>
<LucideIcon.FilePen />
New note
</Button>
<Separator />

View file

@ -60,7 +60,7 @@ const Inbox: React.FC<InboxProps> = ({layout}) => {
return (
<>
<div className='mb-5 mt-4 flex w-full flex-col'>
<div className='my-4 flex w-full flex-col'>
<div className='w-full'>
{activities.length > 0 ? (
<>