xiaoxue_admin
/
xLog
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: tips for operator restrictions

This commit is contained in:
DIYgod 2023-02-01 22:58:06 +00:00
parent cd1828f9f3
commit a30872e93a
No known key found for this signature in database
6 changed files with 55 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/components/dashboard/DashboardLayout.tsx
View File

@ -16,7 +16,7 @@ import {
useShowNotificationModal,
useNotifications,
} from "@crossbell/notification"
import { useIsOwner } from "~/hooks/useIsOwner"
import { useUserRole } from "~/hooks/useUserRole"
export function DashboardLayout({
children,
@ -30,13 +30,13 @@ export function DashboardLayout({
const site = useGetSite(subdomain)
const userSite = useAccountSites()
const isOwner = useIsOwner(subdomain)
const userRole = useUserRole(subdomain)
useEffect(() => {
if (isOwner.isSuccess && !isOwner.data) {
if (userRole.isSuccess && !userRole.data) {
router.push("/dashboard")
}
}, [router, isOwner])
}, [router, userRole])
const showNotificationModal = useShowNotificationModal()
const { isAllRead } = useNotifications()

8
src/components/site/PostMeta.tsx
View File

@ -8,7 +8,7 @@ import { CharacterFloatCard } from "~/components/common/CharacterFloatCard"
import { getSiteLink } from "~/lib/helpers"
import { Avatar } from "~/components/ui/Avatar"
import { EyeIcon, PencilSquareIcon } from "@heroicons/react/24/outline"
import { useIsOwner } from "~/hooks/useIsOwner"
import { useUserRole } from "~/hooks/useUserRole"
export const PostMeta: React.FC<{
page: Note
@ -22,12 +22,12 @@ export const PostMeta: React.FC<{
}, [])
const [showEdit, setShowEdit] = useState(false)
const isOwner = useIsOwner(site?.username)
const userRole = useUserRole(site?.username)
useEffect(() => {
if (isOwner.isSuccess && isOwner.data) {
if (userRole.isSuccess && userRole.data) {
setShowEdit(true)
}
}, [isOwner.isSuccess, isOwner.data])
}, [userRole.isSuccess, userRole.data])
return (
<div className="text-zinc-400 mt-4 xlog-post-meta space-x-5 flex items-center">

7
src/components/site/SiteLayout.tsx
View File

@ -10,7 +10,7 @@ import { useGetPage } from "~/queries/page"
import { OUR_DOMAIN, SITE_URL } from "~/lib/env"
import { IS_PROD } from "~/lib/constants"
import { toGateway } from "~/lib/ipfs-parser"
import { useIsOwner } from "~/hooks/useIsOwner"
import { useUserRole } from "~/hooks/useUserRole"
import { useGetSubscription } from "~/queries/site"
import clsx from "clsx"
import { useCheckLike, useCheckMint } from "~/queries/page"
@ -45,7 +45,7 @@ export const SiteLayout: React.FC<SiteLayoutProps> = ({
const site = useGetSite(domainOrSubdomain)
const isConnected = useAccountState((s) => !!s.computed.account)
const isOwner = useIsOwner(domainOrSubdomain)
const userRole = useUserRole(domainOrSubdomain)
const subscription = useGetSubscription(domainOrSubdomain)
const isLike = useCheckLike({ pageId: page.data?.id })
const isMint = useCheckMint(page.data?.id)
@ -67,7 +67,8 @@ export const SiteLayout: React.FC<SiteLayoutProps> = ({
className={clsx({
"xlog-user": true,
"xlog-user-login": isConnected,
"xlog-user-site-owner": isOwner?.data,
"xlog-user-site-owner": userRole?.data === "owner",
"xlog-user-site-operator": userRole?.data === "operator",
"xlog-user-site-follower": subscription?.data,
"xlog-user-post-liker": isLike.data?.count,
"xlog-user-post-minter": isMint?.data?.count,

18
src/hooks/useIsOwner.ts → src/hooks/useUserRole.ts
View File

@ -3,7 +3,7 @@ import { useAccountSites } from "~/queries/site"
import { useGetSite, useIsOperators } from "~/queries/site"
import { useAccountState } from "@crossbell/connect-kit"
export function useIsOwner(subdomain?: string) {
export function useUserRole(subdomain?: string) {
const site = useGetSite(subdomain)
const userSite = useAccountSites()
@ -14,6 +14,15 @@ export function useIsOwner(subdomain?: string) {
operator: address,
})
let role = null
if (subdomain && address) {
if (userSite.data?.find((site) => site.username === subdomain)) {
role = "owner"
} else if (isOperator.data) {
role = "operator"
}
}
return {
isSuccess:
subdomain &&
@ -21,11 +30,6 @@ export function useIsOwner(subdomain?: string) {
site.isSuccess &&
userSite.isSuccess &&
isOperator.isSuccess,
data: !!(
subdomain &&
address &&
(userSite.data?.find((site) => site.username === subdomain) ||
isOperator.data)
),
data: role,
}
}

10
src/pages/dashboard/[subdomain]/settings/domains.tsx
View File

@ -12,6 +12,7 @@ import { useAccountState, useUpgradeAccountModal } from "@crossbell/connect-kit"
import { UniLink } from "~/components/ui/UniLink"
import { getSiteLink } from "~/lib/helpers"
import type { ReactElement } from "react"
import { useUserRole } from "~/hooks/useUserRole"
export default function SettingsDomainsPage() {
const router = useRouter()
@ -19,6 +20,7 @@ export default function SettingsDomainsPage() {
const updateSite = useUpdateSite()
const site = useGetSite(subdomain)
const userRole = useUserRole(subdomain)
const isEmailAccount = useAccountState(
(s) => s.computed.account?.type === "email",
@ -84,7 +86,7 @@ export default function SettingsDomainsPage() {
addon={`.${OUR_DOMAIN}`}
className="w-28"
{...form.register("subdomain")}
disabled={isEmailAccount}
disabled={isEmailAccount || userRole?.data === "operator"}
/>
{isEmailAccount && (
<div className="text-sm text-orange-400 mt-1">
@ -109,6 +111,12 @@ export default function SettingsDomainsPage() {
.
</div>
)}
{userRole.data === "operator" && (
<div className="text-sm text-orange-400 mt-1">
Operators cannot change subdomain/handle. Please contact the site
owner.
</div>
)}
</div>
<div className="mt-5">
<Input

28
src/pages/dashboard/[subdomain]/settings/operator.tsx
View File

@ -17,6 +17,7 @@ import { useAccountState, useUpgradeAccountModal } from "@crossbell/connect-kit"
import { UniLink } from "~/components/ui/UniLink"
import { getSiteLink } from "~/lib/helpers"
import type { ReactElement } from "react"
import { useUserRole } from "~/hooks/useUserRole"
type RemoveItem = (operator: string) => void
@ -67,6 +68,7 @@ export default function SettingsOperatorPage() {
(s) => s.computed.account?.type === "email",
)
const upgradeAccountModal = useUpgradeAccountModal()
const userRole = useUserRole(subdomain)
const [items, setItems] = useState<string[]>([])
@ -165,7 +167,7 @@ export default function SettingsOperatorPage() {
<p className="text-zinc-800 text-sm font-bold">⚠️ Warning:</p>
<p>
<span className="text-zinc-800">
{isEmailAccount ? (
{isEmailAccount && (
<span>
Email users cannot set operators.{" "}
<UniLink
@ -187,7 +189,14 @@ export default function SettingsOperatorPage() {
</span>
.
</span>
) : (
)}
{userRole.data === "operator" && (
<span>
Operators cannot set other operators. Please contact the site
owner.
</span>
)}
{!isEmailAccount && userRole.data !== "operator" && (
<span>
Operators have permissions to enter your dashboard, change your
settings(excluding xLog subdomain) and post contents on your
@ -197,7 +206,13 @@ export default function SettingsOperatorPage() {
</span>
</p>
</div>
<div className={isEmailAccount ? `grayscale cursor-not-allowed` : ""}>
<div
className={
isEmailAccount || userRole.data === "operator"
? `grayscale cursor-not-allowed`
: ""
}
>
<div className="bg-zinc-50 rounded-lg overflow-hidden">
{items.length === 0 && (
<div className="text-center text-zinc-500 p-5">
@ -211,7 +226,7 @@ export default function SettingsOperatorPage() {
item={item}
removeItem={removeItem}
isLoading={removeOperator.isLoading}
disabled={isEmailAccount}
disabled={isEmailAccount || userRole.data === "operator"}
/>
)
})}
@ -222,7 +237,10 @@ export default function SettingsOperatorPage() {
`}</style>
</div>
<div className="border-t pt-5 mt-10 space-x-3 flex items-center">
<Button onClick={newEmptyItem} isDisabled={isEmailAccount}>
<Button
onClick={newEmptyItem}
isDisabled={isEmailAccount || userRole.data === "operator"}
>
Add
</Button>
</div>