mirror of
https://github.com/luminous-devs/lume.git
synced 2024-09-18 11:13:30 +00:00
update widgets
This commit is contained in:
parent
45c5a890b9
commit
09aea3cff5
@ -118,10 +118,11 @@ export function OnboardStep3Screen() {
|
||||
<LoaderIcon className="h-4 w-4 animate-spin text-white" />
|
||||
</div>
|
||||
) : relaysAsArray.length === 0 ? (
|
||||
<div className="flex h-full w-full items-center justify-center">
|
||||
<div className="flex h-full w-full items-center justify-center px-6">
|
||||
<p className="text-center text-white/50">
|
||||
Can't found any relays, you can skip this step and use default relays
|
||||
instead
|
||||
Lume couldn't find any relays from your follows.
|
||||
<br />
|
||||
You can skip this step and use default relays instead.
|
||||
</p>
|
||||
</div>
|
||||
) : (
|
||||
@ -145,7 +146,7 @@ export function OnboardStep3Screen() {
|
||||
))
|
||||
)}
|
||||
{relays.size > 5 && (
|
||||
<div className="sticky bottom-0 left-0 inline-flex w-full items-center justify-center bg-white/10 px-4 py-2 backdrop-blur-2xl backdrop-blur-xl">
|
||||
<div className="sticky bottom-0 left-0 inline-flex w-full items-center justify-center bg-white/10 px-4 py-2 backdrop-blur-2xl">
|
||||
<p className="text-sm text-orange-400">
|
||||
Using too much relay can cause high resource usage
|
||||
</p>
|
||||
|
@ -25,11 +25,12 @@ export function WidgetList({ params }: { params: Widget }) {
|
||||
return (
|
||||
<div className="flex flex-col gap-3">
|
||||
<h3 className="font-medium text-white/50">{row.title}</h3>
|
||||
<div className="grid grid-cols-3 gap-6">
|
||||
<div className="flex flex-col divide-y divide-white/5 overflow-hidden rounded-xl bg-white/10">
|
||||
{row.data.map((item, index) => (
|
||||
<button onClick={() => openWidget(item)} key={index}>
|
||||
<div className="inline-flex aspect-square h-full w-full transform-gpu flex-col items-center justify-center gap-2.5 rounded-2xl bg-white/5 hover:bg-white/10">
|
||||
<h5 className="text-sm font-medium">{item.title}</h5>
|
||||
<div className="inline-flex h-14 w-full flex-col items-start justify-center gap-1 px-4 hover:bg-white/10">
|
||||
<h5 className="font-medium leading-none">{item.title}</h5>
|
||||
<p className="text-xs leading-none text-white/50">{item.description}</p>
|
||||
</div>
|
||||
</button>
|
||||
))}
|
||||
@ -41,11 +42,27 @@ export function WidgetList({ params }: { params: Widget }) {
|
||||
);
|
||||
|
||||
return (
|
||||
<div className="relative h-full shrink-0 grow-0 basis-[400px] overflow-hidden">
|
||||
<div className="relative h-full shrink-0 grow-0 basis-[400px] overflow-hidden bg-white/10">
|
||||
<TitleBar id={params.id} title="Add widget" />
|
||||
<div className="flex flex-col gap-8 px-3">
|
||||
{DefaultWidgets.map((row: WidgetGroup) => renderItem(row))}
|
||||
</div>
|
||||
<div className="mt-6 px-3">
|
||||
<div className="border-t border-white/5 pt-6">
|
||||
<button
|
||||
type="button"
|
||||
disabled
|
||||
className="inline-flex h-14 w-full items-center justify-center gap-2.5 rounded-xl bg-white/5 text-sm font-medium text-white/50"
|
||||
>
|
||||
Build your own widget{' '}
|
||||
<div className="-rotate-3 transform rounded-md bg-white/10 px-1.5 py-1">
|
||||
<span className="bg-gradient-to-t from-fuchsia-200 via-red-200 to-orange-300 bg-clip-text text-xs text-transparent">
|
||||
Coming soon
|
||||
</span>
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@ -125,7 +125,7 @@ export function Composer() {
|
||||
autoCapitalize="off"
|
||||
className={twMerge(
|
||||
'scrollbar-hide markdown max-h-[500px] overflow-y-auto break-all pr-2 outline-none',
|
||||
expand ? 'min-h-[500px]' : 'min-h-[120px]'
|
||||
expand ? 'min-h-[500px]' : reply.id ? 'min-h-min' : 'min-h-[120px]'
|
||||
)}
|
||||
/>
|
||||
{reply.id && (
|
||||
|
@ -46,18 +46,22 @@ export const DefaultWidgets = [
|
||||
{
|
||||
kind: WidgetKinds.tmp.xfeed,
|
||||
title: 'Group feeds',
|
||||
description: 'All posts from specific people you want to keep up with',
|
||||
},
|
||||
{
|
||||
kind: WidgetKinds.local.files,
|
||||
title: 'Files',
|
||||
description: 'All files shared by people in your network',
|
||||
},
|
||||
{
|
||||
kind: WidgetKinds.local.articles,
|
||||
title: 'Articles',
|
||||
description: 'All articles shared by people in your network',
|
||||
},
|
||||
{
|
||||
kind: WidgetKinds.local.follows,
|
||||
title: 'Follows',
|
||||
description: 'All posts from people you are following',
|
||||
},
|
||||
],
|
||||
},
|
||||
@ -67,27 +71,32 @@ export const DefaultWidgets = [
|
||||
{
|
||||
kind: WidgetKinds.tmp.xhashtag,
|
||||
title: 'Hashtag',
|
||||
description: 'All posts have a specific hashtag',
|
||||
},
|
||||
{
|
||||
kind: WidgetKinds.global.files,
|
||||
title: 'Files',
|
||||
description: 'All files shared by people in your current relay set',
|
||||
},
|
||||
{
|
||||
kind: WidgetKinds.global.articles,
|
||||
title: 'Articles',
|
||||
description: 'All articles shared by people in your current relay set',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: 'Trending (nostr.band)',
|
||||
title: 'nostr.band',
|
||||
data: [
|
||||
{
|
||||
kind: WidgetKinds.nostrBand.trendingAccounts,
|
||||
title: 'Accounts',
|
||||
description: 'Trending accounts from the last 24 hours',
|
||||
},
|
||||
{
|
||||
kind: WidgetKinds.nostrBand.trendingNotes,
|
||||
title: 'Notes',
|
||||
description: 'Trending notes from the last 24 hours',
|
||||
},
|
||||
],
|
||||
},
|
||||
|
1
src/utils/types.d.ts
vendored
1
src/utils/types.d.ts
vendored
@ -44,6 +44,7 @@ export interface WidgetGroup {
|
||||
|
||||
export interface WidgetGroupItem {
|
||||
title: string;
|
||||
description: string;
|
||||
kind: number;
|
||||
}
|
||||
|
||||
|
Loading…
Reference in New Issue
Block a user