From c851c73d84e5a9a1741a058d7d3835cb7fcff9e1 Mon Sep 17 00:00:00 2001 From: Innei Date: Fri, 7 Jul 2023 21:14:23 +0800 Subject: [PATCH] feat: go admin and editing Signed-off-by: Innei --- src/app/(page-detail)/[slug]/pageExtra.tsx | 15 +++++++-- src/app/friends/page.tsx | 4 +-- src/app/notes/[id]/pageExtra.tsx | 13 +++++++- .../(post-detail)/[category]/[slug]/page.tsx | 6 ++++ src/atoms/url.ts | 10 ++++++ .../ui/link-card/LinkCard.module.css | 2 +- .../ui/markdown/parsers/mention.tsx | 2 +- .../widgets/shared/GoToAdminEditingButton.tsx | 31 +++++++++++++++++++ 8 files changed, 75 insertions(+), 8 deletions(-) create mode 100644 src/components/widgets/shared/GoToAdminEditingButton.tsx diff --git a/src/app/(page-detail)/[slug]/pageExtra.tsx b/src/app/(page-detail)/[slug]/pageExtra.tsx index f6bb577df7..2d85a5fee7 100644 --- a/src/app/(page-detail)/[slug]/pageExtra.tsx +++ b/src/app/(page-detail)/[slug]/pageExtra.tsx @@ -8,6 +8,7 @@ import type { PropsWithChildren } from 'react' import { useSetHeaderMetaInfo } from '~/components/layout/header/hooks' import { Markdown } from '~/components/ui/markdown' +import { GoToAdminEditingButton } from '~/components/widgets/shared/GoToAdminEditingButton' import { noopArr } from '~/lib/noop' import { MarkdownImageRecordProvider } from '~/providers/article/MarkdownImageRecordProvider' import { useCurrentPageDataSelector } from '~/providers/page/CurrentPageDataProvider' @@ -63,10 +64,18 @@ export const PageSubTitle = () => { } export const PageTitle = () => { const title = useCurrentPageDataSelector((data) => data?.title) + const id = useCurrentPageDataSelector((data) => data?.id) return ( -

- {title} -

+ <> +

+ {title} +

+ + ) } export const HeaderMetaInfoSetting = () => { diff --git a/src/app/friends/page.tsx b/src/app/friends/page.tsx index e881b589ad..719fcf1b18 100644 --- a/src/app/friends/page.tsx +++ b/src/app/friends/page.tsx @@ -1,3 +1,4 @@ +/* eslint-disable react/jsx-no-target-blank */ 'use client' import { useQuery } from '@tanstack/react-query' @@ -150,7 +151,6 @@ const Card: FC<{ link: LinkModel }> = ({ link }) => { layoutId={link.id} href={link.url} target="_blank" - rel="noreferrer" role="link" aria-label={`Go to ${link.name}'s website`} className="relative flex flex-col items-center justify-center" @@ -183,7 +183,7 @@ const FavoriteSection: FC = ({ data }) => { {data.map((link) => { return (
  • - + {link.name} {link.description || ''} diff --git a/src/app/notes/[id]/pageExtra.tsx b/src/app/notes/[id]/pageExtra.tsx index 3a6f3c54bd..5750112735 100644 --- a/src/app/notes/[id]/pageExtra.tsx +++ b/src/app/notes/[id]/pageExtra.tsx @@ -13,6 +13,7 @@ import { MdiClockOutline } from '~/components/icons/clock' import { useSetHeaderMetaInfo } from '~/components/layout/header/hooks' import { FloatPopover } from '~/components/ui/float-popover' import { Markdown } from '~/components/ui/markdown' +import { GoToAdminEditingButton } from '~/components/widgets/shared/GoToAdminEditingButton' import { parseDate } from '~/lib/datetime' import { noopArr } from '~/lib/noop' import { MarkdownImageRecordProvider } from '~/providers/article/MarkdownImageRecordProvider' @@ -22,9 +23,19 @@ import styles from './page.module.css' export const NoteTitle = () => { const title = useCurrentNoteDataSelector((data) => data?.data.title) + const id = useCurrentNoteDataSelector((data) => data?.data.id) + if (!title) return null return ( -

    {title}

    + <> +

    {title}

    + + + ) } diff --git a/src/app/posts/(post-detail)/[category]/[slug]/page.tsx b/src/app/posts/(post-detail)/[category]/[slug]/page.tsx index c2b3325a17..5178887794 100644 --- a/src/app/posts/(post-detail)/[category]/[slug]/page.tsx +++ b/src/app/posts/(post-detail)/[category]/[slug]/page.tsx @@ -9,6 +9,7 @@ import { PostCopyright } from '~/components/widgets/post/PostCopyright' import { PostOutdate } from '~/components/widgets/post/PostOutdate' import { PostRelated } from '~/components/widgets/post/PostRelated' import { ArticleRightAside } from '~/components/widgets/shared/ArticleRightAside' +import { GoToAdminEditingButton } from '~/components/widgets/shared/GoToAdminEditingButton' import { ReadIndicatorForMobile } from '~/components/widgets/shared/ReadIndicator' import { SubscribeBell } from '~/components/widgets/subscribe/SubscribeBell' import { XLogInfoForPost, XLogSummaryForPost } from '~/components/widgets/xlog' @@ -45,6 +46,11 @@ const PostPage = () => {

    {title}

    + diff --git a/src/atoms/url.ts b/src/atoms/url.ts index 7c85cef111..5cb885cd28 100644 --- a/src/atoms/url.ts +++ b/src/atoms/url.ts @@ -29,3 +29,13 @@ export const useAppUrl = () => { ...url, } } + +export const useResolveAdminUrl = () => { + const { adminUrl } = useAppUrl() + return (path: string) => { + if (!adminUrl) { + return '' + } + return adminUrl.replace(/\/$/, '').concat(path || '') + } +} diff --git a/src/components/ui/link-card/LinkCard.module.css b/src/components/ui/link-card/LinkCard.module.css index 7f3f396941..a6bd21ce5e 100644 --- a/src/components/ui/link-card/LinkCard.module.css +++ b/src/components/ui/link-card/LinkCard.module.css @@ -16,7 +16,7 @@ @apply cursor-pointer border font-sans no-underline; @apply [&_*]:!not-italic; - @apply border border-slate-100 bg-gray-100/80 dark:border-neutral-700 dark:bg-neutral-800; + @apply border border-slate-200/80 bg-gray-100/80 dark:border-neutral-700 dark:bg-zinc-800; @apply transition-colors duration-200; } diff --git a/src/components/ui/markdown/parsers/mention.tsx b/src/components/ui/markdown/parsers/mention.tsx index c52204ad8a..b4d3513955 100644 --- a/src/components/ui/markdown/parsers/mention.tsx +++ b/src/components/ui/markdown/parsers/mention.tsx @@ -63,7 +63,7 @@ export const MentionRule: MarkdownToJSX.Rule = { target="_blank" rel="noreferrer nofollow" href={`${urlPrefix}${name}`} - className="no-underline" + className="underline-offset-2" > {displayName || name} diff --git a/src/components/widgets/shared/GoToAdminEditingButton.tsx b/src/components/widgets/shared/GoToAdminEditingButton.tsx new file mode 100644 index 0000000000..aeab83a2c0 --- /dev/null +++ b/src/components/widgets/shared/GoToAdminEditingButton.tsx @@ -0,0 +1,31 @@ +'use client' + +import { useIsLogged, useResolveAdminUrl } from '~/atoms' +import { clsxm } from '~/lib/helper' + +interface Props { + type: 'notes' | 'pages' | 'posts' + id: string +} +export const GoToAdminEditingButton: Component = (props) => { + const isLogin = useIsLogged() + const resolveAdminUrl = useResolveAdminUrl() + const { id, type, className } = props + if (!isLogin) return null + + return ( + + + 编辑 + + ) +}