removed doc code focus

This commit is contained in:
Zai Shi 2024-06-19 11:49:50 +02:00
parent e5b41efbcf
commit 53c5a87888
2 changed files with 15 additions and 15 deletions

View File

@ -33,7 +33,7 @@ You can list all the teams a user belongs to by using the `listTeams` method or
<Tabs>
<Tab title="Client Component">
```tsx focus={5-10} title="List teams of a user on the client"
```tsx title="List teams of a user on the client"
"use client";
import { useUser } from "@stackframe/stack";
@ -49,7 +49,7 @@ You can list all the teams a user belongs to by using the `listTeams` method or
</Tab>
<Tab title="Server Component">
```tsx focus={4-9} title="List teams of a user on the server"
```tsx title="List teams of a user on the server"
import { stackServerApp } from "@/stack";
export default async function DisplayUserTeams() {
@ -71,7 +71,7 @@ To obtain details of a specific team that a user belongs to, use the `getTeam` m
<Tabs>
<Tab title="Client Component">
```tsx focus={5-10} title="Get a specific team of a user on the client"
```tsx title="Get a specific team of a user on the client"
"use client";
import { useUser } from "@stackframe/stack";
@ -87,7 +87,7 @@ To obtain details of a specific team that a user belongs to, use the `getTeam` m
</Tab>
<Tab title="Server Component">
```tsx focus={4-9} title="Get a specific team of a user on the server"
```tsx title="Get a specific team of a user on the server"
import { stackServerApp } from "@/stack";
export default async function DisplayUserTeam(props: { teamId: string }) {
@ -158,7 +158,7 @@ You can check if a user has a specific permission by using the `getPermission` m
<Tabs>
<Tab title="Client Component">
```tsx focus={5-11} title="Check user permission on the client"
```tsx title="Check user permission on the client"
"use client";
import { useUser } from "@stackframe/stack";
@ -175,7 +175,7 @@ You can check if a user has a specific permission by using the `getPermission` m
</Tab>
<Tab title="Server Component">
```tsx focus={4-10} title="Check user permission on the server"
```tsx title="Check user permission on the server"
import { stackServerApp } from "@/stack";
export default async function CheckUserPermission() {
@ -198,7 +198,7 @@ To get all permissions a user has, use the `listPermissions` method or `usePermi
<Tabs>
<Tab title="Client Component" default>
```tsx focus={5-10} title="List user permissions on the client"
```tsx title="List user permissions on the client"
"use client";
import { useUser } from "@stackframe/stack";
@ -214,7 +214,7 @@ To get all permissions a user has, use the `listPermissions` method or `usePermi
</Tab>
<Tab title="Server Component">
```tsx focus={4-9} title="List user permissions on the server"
```tsx title="List user permissions on the server"
import { stackServerApp } from "@/stack";
export default async function DisplayUserPermissions() {

View File

@ -8,7 +8,7 @@ In [the last guide](./setup.mdx), we created `StackServerApp` and `StackProvider
We can use the `useStackApp()` hook to get a `StackClientApp` object. With it, we can retrieve the current user in Client Components:
```tsx focus={5-7} title="Client user profile"
```tsx title="Client user profile"
"use client";
import { useStackApp } from "@stackframe/stack";
@ -25,7 +25,7 @@ Because it's so common, `useUser()` is also exposed as a standalone hook. This m
On Server Components, you don't need `useStackApp()`. Instead, you can just import the `StackServerApp` that you created in the previous chapter:
```tsx focus={4-5} title="Server user profile"
```tsx title="Server user profile"
import { stackServerApp } from "@/stack";
export default async function MyComponent() {
@ -45,7 +45,7 @@ Call `useUser` (or `getUser`) with the `{ or: 'redirect' }` option to protect th
<Tabs>
<Tab title="Client Component">
```tsx focus={5-6} title="Client-side protection"
```tsx title="Client-side protection"
"use client";
import { useUser } from "@stackframe/stack";
@ -57,7 +57,7 @@ Call `useUser` (or `getUser`) with the `{ or: 'redirect' }` option to protect th
</Tab>
<Tab title="Server Component">
```tsx focus={4-5} title="Server-side protection"
```tsx title="Server-side protection"
import { stackServerApp } from "@/stack";
export default async function Protected() {
@ -76,7 +76,7 @@ You can sign out the user by redirecting them to `/handler/signout` or simply by
<Tabs>
<Tab title="user.signOut()">
```tsx focus={5-6} title="Sign-out button"
```tsx title="Sign-out button"
"use client";
import { useUser } from "@stackframe/stack";
@ -88,7 +88,7 @@ You can sign out the user by redirecting them to `/handler/signout` or simply by
</Tab>
<Tab title="Redirect">
```tsx focus={4-4} title="Sign-out link"
```tsx title="Sign-out link"
import { stackServerApp } from "@/stack";
export default async function SignOutLink() {
@ -176,7 +176,7 @@ To see more examples of how to use the `User` object, check out the [User API do
You can update the user's information by calling `user.update()` with the new data. The user data from the `userUser()` hook is automatically will also be updated automatically. Here is an example:
```tsx title="Update user display name" focus={6-8}
```tsx title="Update user display name"
'user client';
import { useUser } from "@stackframe/stack";