mirror of
https://github.com/stack-auth/stack.git
synced 2026-06-13 21:01:21 +08:00
<!--
Fixes generation script, adds new oauth docs pages, fixes bottom
navigation, adds mobile support, sidebar changes.
-->
<!-- ELLIPSIS_HIDDEN -->
----
> [!IMPORTANT]
> This PR adds OAuth provider documentation, enhances mobile navigation,
and updates Python-specific documentation for Stack Auth.
>
> - **OAuth Providers**:
> - Adds documentation for GitHub, Google, Facebook, Microsoft, Spotify,
Discord, GitLab, Apple, Bitbucket, LinkedIn, and X (Twitter) in
`docs/templates/concepts/auth-providers/`.
> - Updates `docs/docs-platform.yml` to include new OAuth provider
pages.
> - **Mobile Support**:
> - Enhances bottom navigation for mobile devices in
`docs/src/app/(home)/layout.tsx` and `docs/src/app/api/layout.tsx`.
> - Introduces `AIChatDrawer` and `AuthPanel` components for
mobile-friendly interactions.
> - **Documentation Enhancements**:
> - Adds Python-specific documentation for user authentication and team
management in `docs/templates-python/concepts/`.
> - Updates `docs/templates-python/meta.json` to include new Python
documentation pages.
> - Refines search functionality and UI components for better user
experience.
>
> <sup>This description was created by </sup>[<img alt="Ellipsis"
src="https://img.shields.io/badge/Ellipsis-blue?color=175173">](https://www.ellipsis.dev?ref=stack-auth%2Fstack-auth&utm_source=github&utm_medium=referral)<sup>
for bf759151d8. You can
[customize](https://app.ellipsis.dev/stack-auth/settings/summaries) this
summary. It will automatically update as commits are pushed.</sup>
<!-- ELLIPSIS_HIDDEN -->
---------
Co-authored-by: Konsti Wohlwend <n2d4xc@gmail.com>
91 lines
2.9 KiB
TypeScript
91 lines
2.9 KiB
TypeScript
'use client';
|
|
|
|
import { createContext, ReactNode, useContext, useState } from 'react';
|
|
import { useSidebar } from '../layouts/sidebar-context';
|
|
|
|
// Stack Auth required headers
|
|
const STACK_AUTH_HEADERS = {
|
|
'Content-Type': 'application/json',
|
|
'X-Stack-Access-Type': '', // client or server
|
|
'X-Stack-Project-Id': '', // project UUID
|
|
'X-Stack-Publishable-Client-Key': '', // pck_...
|
|
'X-Stack-Secret-Server-Key': '', // ssk_...
|
|
'X-Stack-Access-Token': '', // user's access token
|
|
};
|
|
|
|
// Type for API error objects
|
|
type APIError = {
|
|
message?: string,
|
|
error?: string,
|
|
details?: string,
|
|
code?: string | number,
|
|
[key: string]: unknown,
|
|
}
|
|
|
|
// Context for sharing headers across all API components on the page
|
|
type APIPageContextType = {
|
|
sharedHeaders: Record<string, string>,
|
|
updateSharedHeaders: (headers: Record<string, string>) => void,
|
|
reportError: (status: number, error: APIError) => void,
|
|
lastError: { status: number, error: APIError } | null,
|
|
highlightMissingHeaders: boolean,
|
|
}
|
|
|
|
const APIPageContext = createContext<APIPageContextType | null>(null);
|
|
|
|
// Hook to access API page context - returns null when not used within APIPageWrapper
|
|
export function useAPIPageContext() {
|
|
const context = useContext(APIPageContext);
|
|
// Return null instead of throwing error when context is not available
|
|
// This makes it safe to use in components that might be rendered outside of APIPageContextProvider
|
|
return context;
|
|
}
|
|
|
|
type APIPageWrapperProps = {
|
|
children: ReactNode,
|
|
}
|
|
|
|
export function APIPageWrapper({ children }: APIPageWrapperProps) {
|
|
const sidebarContext = useSidebar();
|
|
const [sharedHeaders, setSharedHeaders] = useState<Record<string, string>>(STACK_AUTH_HEADERS);
|
|
const [lastError, setLastError] = useState<{ status: number, error: APIError } | null>(null);
|
|
const [highlightMissingHeaders, setHighlightMissingHeaders] = useState(false);
|
|
|
|
// Use default functions if sidebar context is not available
|
|
const { isAuthOpen, toggleAuth } = sidebarContext || {
|
|
isAuthOpen: false,
|
|
toggleAuth: () => {}
|
|
};
|
|
|
|
const updateSharedHeaders = (headers: Record<string, string>) => {
|
|
setSharedHeaders(headers);
|
|
// Clear error highlighting when headers are updated
|
|
if (highlightMissingHeaders) {
|
|
setHighlightMissingHeaders(false);
|
|
}
|
|
};
|
|
|
|
const reportError = (status: number, error: APIError) => {
|
|
setLastError({ status, error });
|
|
|
|
// Auto-open panel and highlight missing headers on 400/401/403 errors
|
|
if ([400, 401, 403].includes(status)) {
|
|
if (!isAuthOpen) {
|
|
toggleAuth();
|
|
}
|
|
setHighlightMissingHeaders(true);
|
|
|
|
// Auto-hide highlighting after 10 seconds
|
|
setTimeout(() => {
|
|
setHighlightMissingHeaders(false);
|
|
}, 10000);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<APIPageContext.Provider value={{ sharedHeaders, updateSharedHeaders, reportError, lastError, highlightMissingHeaders }}>
|
|
{children}
|
|
</APIPageContext.Provider>
|
|
);
|
|
}
|