reya/lume
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add topic widget

Browse Source
This commit is contained in:
reya
2023-11-09 09:12:42 +07:00
parent 108ecafab7
commit cb9006abb2
16 changed files with 489 additions and 96 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/app/auth/onboarding/hashtag.tsx
View File

@@ -6,7 +6,7 @@ import { useStorage } from '@libs/storage/provider';
import { ArrowLeftIcon, CheckCircleIcon, LoaderIcon } from '@shared/icons';
import { HASHTAGS, WidgetKinds } from '@stores/constants';
import { HASHTAGS, WIDGET_KIND } from '@stores/constants';
import { useOnboarding } from '@stores/onboarding';
export function OnboardHashtagScreen() {
@@ -35,7 +35,7 @@ export function OnboardHashtagScreen() {
setLoading(true);
for (const tag of tags) {
await db.createWidget(WidgetKinds.global.hashtag, tag, tag.replace('#', ''));
await db.createWidget(WIDGET_KIND.global.hashtag, tag, tag.replace('#', ''));
}
setHashtag();

4
src/app/space/components/toggle.tsx
View File

@@ -1,7 +1,7 @@
import { PlusIcon } from '@shared/icons';
import { WidgetWrapper } from '@shared/widgets';
import { WidgetKinds } from '@stores/constants';
import { WIDGET_KIND } from '@stores/constants';
import { useWidget } from '@utils/hooks/useWidget';
@@ -14,7 +14,7 @@ export function ToggleWidgetList() {
<button
type="button"
onClick={() =>
addWidget.mutate({ kind: WidgetKinds.tmp.list, title: '', content: '' })
addWidget.mutate({ kind: WIDGET_KIND.tmp.list, title: '', content: '' })
}
className="inline-flex h-9 items-center gap-2 rounded-full bg-neutral-200 px-3 text-neutral-900 hover:bg-neutral-300 dark:bg-neutral-800 dark:text-neutral-100 dark:hover:bg-neutral-700"
>

81
src/app/space/components/widgetList.tsx
View File

@@ -13,7 +13,7 @@ import {
import { TitleBar } from '@shared/titleBar';
import { WidgetWrapper } from '@shared/widgets';
import { DefaultWidgets, WidgetKinds } from '@stores/constants';
import { DEFAULT_WIDGETS, WIDGET_KIND } from '@stores/constants';
import { useWidget } from '@utils/hooks/useWidget';
import { Widget, WidgetGroup, WidgetGroupItem } from '@utils/types';
@@ -22,55 +22,48 @@ export function WidgetList({ params }: { params: Widget }) {
const { addWidget, removeWidget } = useWidget();
const open = (item: WidgetGroupItem) => {
addWidget.mutate({ kind: item.kind, title: item.title, content: '' });
addWidget.mutate({
kind: item.kind,
title: item.title,
content: JSON.stringify(item.content),
});
removeWidget.mutate(params.id);
};
const renderIcon = useCallback(
(kind: number) => {
switch (kind) {
case WidgetKinds.tmp.xfeed:
return (
<GroupFeedsIcon className="h-5 w-5 text-neutral-900 dark:text-neutral-100" />
);
case WidgetKinds.local.follows:
return (
<FollowsIcon className="h-5 w-5 text-neutral-900 dark:text-neutral-100" />
);
case WidgetKinds.local.files:
case WidgetKinds.global.files:
return <FileIcon className="h-5 w-5 text-neutral-900 dark:text-neutral-100" />;
case WidgetKinds.local.articles:
case WidgetKinds.global.articles:
return (
<ArticleIcon className="h-5 w-5 text-neutral-900 dark:text-neutral-100" />
);
case WidgetKinds.tmp.xhashtag:
return (
<HashtagIcon className="h-5 w-5 text-neutral-900 dark:text-neutral-100" />
);
case WidgetKinds.nostrBand.trendingAccounts:
case WidgetKinds.nostrBand.trendingNotes:
return (
<TrendingIcon className="h-5 w-5 text-neutral-900 dark:text-neutral-100" />
);
case WidgetKinds.local.notification:
return <BellIcon className="h-5 w-5 text-neutral-900 dark:text-neutral-100" />;
case WidgetKinds.other.learnNostr:
return (
<ThreadsIcon className="h-5 w-5 text-neutral-900 dark:text-neutral-100" />
);
default:
return null;
}
},
[DefaultWidgets]
);
const renderIcon = useCallback((kind: number) => {
switch (kind) {
case WIDGET_KIND.tmp.xfeed:
return (
<GroupFeedsIcon className="h-5 w-5 text-neutral-900 dark:text-neutral-100" />
);
case WIDGET_KIND.local.follows:
return <FollowsIcon className="h-5 w-5 text-neutral-900 dark:text-neutral-100" />;
case WIDGET_KIND.local.files:
case WIDGET_KIND.global.files:
return <FileIcon className="h-5 w-5 text-neutral-900 dark:text-neutral-100" />;
case WIDGET_KIND.local.articles:
case WIDGET_KIND.global.articles:
return <ArticleIcon className="h-5 w-5 text-neutral-900 dark:text-neutral-100" />;
case WIDGET_KIND.tmp.xhashtag:
return <HashtagIcon className="h-5 w-5 text-neutral-900 dark:text-neutral-100" />;
case WIDGET_KIND.nostrBand.trendingAccounts:
case WIDGET_KIND.nostrBand.trendingNotes:
return (
<TrendingIcon className="h-5 w-5 text-neutral-900 dark:text-neutral-100" />
);
case WIDGET_KIND.local.notification:
return <BellIcon className="h-5 w-5 text-neutral-900 dark:text-neutral-100" />;
case WIDGET_KIND.other.learnNostr:
return <ThreadsIcon className="h-5 w-5 text-neutral-900 dark:text-neutral-100" />;
default:
return null;
}
}, []);
const renderItem = useCallback((row: WidgetGroup, index: number) => {
return (
<div key={index} className="flex flex-col gap-2">
<h3 className="text-sm font-semibold">{row.title}</h3>
<h3 className="font-semibold">{row.title}</h3>
<div className="flex flex-col divide-y divide-neutral-200 overflow-hidden rounded-xl bg-neutral-100 dark:divide-neutral-800 dark:bg-neutral-900">
{row.data.map((item, index) => (
<button
@@ -111,7 +104,7 @@ export function WidgetList({ params }: { params: Widget }) {
<TitleBar id={params.id} title="Add widget" />
<div className="flex-1 overflow-y-auto pb-10 scrollbar-none">
<div className="flex flex-col gap-6 px-3">
{DefaultWidgets.map((row: WidgetGroup, index: number) =>
{DEFAULT_WIDGETS.map((row: WidgetGroup, index: number) =>
renderItem(row, index)
)}
<div className="border-t border-neutral-200 pt-6 dark:border-neutral-800">

36
src/app/space/index.tsx
View File

@@ -25,7 +25,7 @@ import {
XhashtagWidget,
} from '@shared/widgets';
import { WidgetKinds } from '@stores/constants';
import { WIDGET_KIND } from '@stores/constants';
import { Widget } from '@utils/types';
@@ -43,13 +43,13 @@ export function SpaceScreen() {
id: '9998',
title: 'Notification',
content: '',
kind: WidgetKinds.local.notification,
kind: WIDGET_KIND.local.notification,
},
{
id: '9999',
title: 'Newsfeed',
content: '',
kind: WidgetKinds.local.network,
kind: WIDGET_KIND.local.network,
},
];
@@ -63,35 +63,35 @@ export function SpaceScreen() {
const renderItem = useCallback((widget: Widget) => {
switch (widget.kind) {
case WidgetKinds.local.feeds:
case WIDGET_KIND.local.feeds:
return <LocalFeedsWidget key={widget.id} params={widget} />;
case WidgetKinds.local.files:
case WIDGET_KIND.local.files:
return <LocalFilesWidget key={widget.id} params={widget} />;
case WidgetKinds.local.articles:
case WIDGET_KIND.local.articles:
return <LocalArticlesWidget key={widget.id} params={widget} />;
case WidgetKinds.local.user:
case WIDGET_KIND.local.user:
return <LocalUserWidget key={widget.id} params={widget} />;
case WidgetKinds.local.thread:
case WIDGET_KIND.local.thread:
return <LocalThreadWidget key={widget.id} params={widget} />;
case WidgetKinds.global.hashtag:
case WIDGET_KIND.global.hashtag:
return <GlobalHashtagWidget key={widget.id} params={widget} />;
case WidgetKinds.global.articles:
case WIDGET_KIND.global.articles:
return <GlobalArticlesWidget key={widget.id} params={widget} />;
case WidgetKinds.global.files:
case WIDGET_KIND.global.files:
return <GlobalFilesWidget key={widget.id} params={widget} />;
case WidgetKinds.nostrBand.trendingAccounts:
case WIDGET_KIND.nostrBand.trendingAccounts:
return <TrendingAccountsWidget key={widget.id} params={widget} />;
case WidgetKinds.nostrBand.trendingNotes:
case WIDGET_KIND.nostrBand.trendingNotes:
return <TrendingNotesWidget key={widget.id} params={widget} />;
case WidgetKinds.tmp.xfeed:
case WIDGET_KIND.tmp.xfeed:
return <XfeedsWidget key={widget.id} params={widget} />;
case WidgetKinds.tmp.xhashtag:
case WIDGET_KIND.tmp.xhashtag:
return <XhashtagWidget key={widget.id} params={widget} />;
case WidgetKinds.tmp.list:
case WIDGET_KIND.tmp.list:
return <WidgetList key={widget.id} params={widget} />;
case WidgetKinds.local.notification:
case WIDGET_KIND.local.notification:
return <NotificationWidget key={widget.id} />;
case WidgetKinds.local.network:
case WIDGET_KIND.local.network:
return <NewsfeedWidget key={widget.id} />;
default:
return null;