Skip to content

Commit 890bbd9

Browse files
committed
chore: minor tweaks
1 parent e4b3a2a commit 890bbd9

File tree

1 file changed

+10
-10
lines changed

1 file changed

+10
-10
lines changed

src/content/docs/developer-tools/sdks/frontend/react-sdk.mdx

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@ Kinde uses a React Context Provider to maintain its internal state in your appli
6363
Import the Kinde Provider component and wrap your application in it.
6464

6565
```jsx
66-
import { KindeProvider } from "@kinde-oss/kinde-auth-react";
66+
import { KindeProvider } from '@kinde-oss/kinde-auth-react';
6767
const App = () => (
6868
<KindeProvider
6969
clientId="<your_kinde_client_id>
@@ -176,7 +176,7 @@ Register your first user by signing up yourself. You’ll see your newly registe
176176
You can get an authorized user’s profile from any component using the Kinde React hook.
177177

178178
```jsx
179-
import { useKindeAuth } from "@kinde-oss/kinde-auth-react";
179+
import { useKindeAuth } from '@kinde-oss/kinde-auth-react';
180180
const SayHello = () => {
181181
const { user } = useKindeAuth();
182182
return <p>Hi {user.first_name}!</p>;
@@ -186,7 +186,7 @@ const SayHello = () => {
186186
To be on the safe side we have also provided `isAuthenticated` and `isLoading` state to prevent rendering errors.
187187

188188
```jsx
189-
import { useKindeAuth } from "@kinde-oss/kinde-auth-react";
189+
import { useKindeAuth } from '@kinde-oss/kinde-auth-react';
190190

191191
const UserProfile = () => {
192192
const { user, isAuthenticated, isLoading } = useKindeAuth();
@@ -353,7 +353,7 @@ declare module "@kinde-oss/kinde-auth-react/utils" {
353353

354354
**Note:** Make sure your `tsconfig.json` includes the type declaration file, or place it in a directory that TypeScript automatically includes (like `src/types/` or the root of your project).
355355

356-
#### Using the `<ProtectedRoute>` component
356+
### Using the `<ProtectedRoute>` component
357357

358358
**Note:** The `<ProtectedRoute>` component requires the `react-router-dom` package to be installed.*
359359

@@ -373,7 +373,7 @@ import { ProtectedRoute } from '@kinde-oss/kinde-auth-react/react-router';
373373
- `fallbackPath` (required): Path to redirect to if user doesn't have access
374374
- `children` (required): React components to render if user has access
375375

376-
### Basic examples
376+
#### Basic examples
377377

378378
```jsx
379379
// Protect with single role
@@ -397,7 +397,7 @@ import { ProtectedRoute } from '@kinde-oss/kinde-auth-react/react-router';
397397
</ProtectedRoute>
398398
```
399399

400-
### Complex access control
400+
#### Complex access control
401401

402402
```jsx
403403
// Multiple criteria - user must have ALL specified requirements
@@ -426,11 +426,11 @@ import { ProtectedRoute } from '@kinde-oss/kinde-auth-react/react-router';
426426
</ProtectedRoute>
427427
```
428428

429-
### Integration with React Router
429+
#### Integration with React Router
430430

431431
```jsx
432432
import { Routes, Route } from 'react-router-dom';
433-
import { ProtectedRoute } from "@kinde-oss/kinde-auth-react/react-router";
433+
import { ProtectedRoute } from '@kinde-oss/kinde-auth-react/react-router';
434434

435435
function App() {
436436
return (
@@ -460,11 +460,11 @@ function App() {
460460
}
461461
```
462462

463-
### Complete example with multiple protected routes
463+
#### Complete example with multiple protected routes
464464

465465
```jsx
466466
import { Routes, Route } from 'react-router-dom';
467-
import { ProtectedRoute } from '@kinde-oss/kinde-auth-react';
467+
import { ProtectedRoute } from '@kinde-oss/kinde-auth-react/react-router';
468468

469469
function App() {
470470
return (

0 commit comments

Comments
 (0)