update cf on insights

This commit is contained in:
2025-12-18 00:20:02 -03:00
parent 3857620f89
commit 8081e838a3
10 changed files with 51 additions and 45 deletions

View File

@@ -4,10 +4,6 @@ export function meta({}: Route.MetaArgs) {
return [{ title: 'Visão geral' }] return [{ title: 'Visão geral' }]
} }
export function loader({ context }: Route.LoaderArgs) {
return { message: context.cloudflare.env.VALUE_FROM_CLOUDFLARE }
}
export default function Route({}: Route.ComponentProps) { export default function Route({}: Route.ComponentProps) {
return <></> return <></>
} }

View File

@@ -5,6 +5,8 @@ import { MeiliSearchFilterBuilder } from 'meilisearch-helper'
import { Suspense, useState } from 'react' import { Suspense, useState } from 'react'
import { Await, Outlet, useSearchParams } from 'react-router' import { Await, Outlet, useSearchParams } from 'react-router'
import { cloudflareContext } from '@repo/auth/context'
import { DataTable, DataTableViewOptions } from '@repo/ui/components/data-table' import { DataTable, DataTableViewOptions } from '@repo/ui/components/data-table'
import { FacetedFilter } from '@repo/ui/components/faceted-filter' import { FacetedFilter } from '@repo/ui/components/faceted-filter'
import { RangeCalendarFilter } from '@repo/ui/components/range-calendar-filter' import { RangeCalendarFilter } from '@repo/ui/components/range-calendar-filter'
@@ -22,6 +24,7 @@ export function meta({}: Route.MetaArgs) {
} }
export async function loader({ context, request }: Route.LoaderArgs) { export async function loader({ context, request }: Route.LoaderArgs) {
const cloudflare = context.get(cloudflareContext)
const { searchParams } = new URL(request.url) const { searchParams } = new URL(request.url)
const query = searchParams.get('q') || '' const query = searchParams.get('q') || ''
const from = searchParams.get('from') const from = searchParams.get('from')
@@ -49,7 +52,7 @@ export async function loader({ context, request }: Route.LoaderArgs) {
query, query,
page, page,
hitsPerPage, hitsPerPage,
env: context.cloudflare.env env: cloudflare.env
}) })
return { return {
@@ -76,7 +79,7 @@ export default function Route({ loaderData: { data } }: Route.ComponentProps) {
</div> </div>
<Await resolve={data}> <Await resolve={data}>
{({ hits, page, hitsPerPage, totalHits }) => ( {({ hits, page = 1, hitsPerPage, totalHits }) => (
<DataTable <DataTable
sort={[{ id: 'created_at', desc: true }]} sort={[{ id: 'created_at', desc: true }]}
columnPinning={{ left: ['select'], right: ['action'] }} columnPinning={{ left: ['select'], right: ['action'] }}

View File

@@ -3,6 +3,7 @@ import type { Route } from './+types/route'
import { Suspense } from 'react' import { Suspense } from 'react'
import { Await, useSearchParams } from 'react-router' import { Await, useSearchParams } from 'react-router'
import { cloudflareContext } from '@repo/auth/context'
import { DataTable } from '@repo/ui/components/data-table' import { DataTable } from '@repo/ui/components/data-table'
import { SearchForm } from '@repo/ui/components/search-form' import { SearchForm } from '@repo/ui/components/search-form'
import { Skeleton } from '@repo/ui/components/skeleton' import { Skeleton } from '@repo/ui/components/skeleton'
@@ -16,6 +17,7 @@ export function meta({}: Route.MetaArgs) {
} }
export async function loader({ context, request }: Route.LoaderArgs) { export async function loader({ context, request }: Route.LoaderArgs) {
const cloudflare = context.get(cloudflareContext)
const { searchParams } = new URL(request.url) const { searchParams } = new URL(request.url)
const query = searchParams.get('q') || '' const query = searchParams.get('q') || ''
const page = Number(searchParams.get('p')) + 1 const page = Number(searchParams.get('p')) + 1
@@ -28,7 +30,7 @@ export async function loader({ context, request }: Route.LoaderArgs) {
query, query,
page, page,
hitsPerPage, hitsPerPage,
env: context.cloudflare.env env: cloudflare.env
}) })
return { data: orgs } return { data: orgs }

View File

@@ -1,9 +1,12 @@
import type { Route } from './+types/route' import type { Route } from './+types/route'
import { createSearch } from '@repo/util/meili'
import { data } from 'react-router' import { data } from 'react-router'
import { cloudflareContext } from '@repo/auth/context'
import { createSearch } from '@repo/util/meili'
export async function loader({ context, request }: Route.LoaderArgs) { export async function loader({ context, request }: Route.LoaderArgs) {
const cloudflare = context.get(cloudflareContext)
const { searchParams } = new URL(request.url) const { searchParams } = new URL(request.url)
const query = searchParams.get('q') || '' const query = searchParams.get('q') || ''
const page = Number(searchParams.get('p')) + 1 const page = Number(searchParams.get('p')) + 1
@@ -16,7 +19,7 @@ export async function loader({ context, request }: Route.LoaderArgs) {
query, query,
page, page,
hitsPerPage, hitsPerPage,
env: context.cloudflare.env env: cloudflare.env
}) })
return data(r) return data(r)

View File

@@ -3,6 +3,7 @@ import type { Route } from './+types/route'
import { Suspense } from 'react' import { Suspense } from 'react'
import { Await } from 'react-router' import { Await } from 'react-router'
import { cloudflareContext } from '@repo/auth/context'
import { DataTable } from '@repo/ui/components/data-table' import { DataTable } from '@repo/ui/components/data-table'
import { Skeleton } from '@repo/ui/components/skeleton' import { Skeleton } from '@repo/ui/components/skeleton'
import { createSearch } from '@repo/util/meili' import { createSearch } from '@repo/util/meili'
@@ -14,6 +15,7 @@ export function meta({}: Route.MetaArgs) {
} }
export async function loader({ context, request }: Route.LoaderArgs) { export async function loader({ context, request }: Route.LoaderArgs) {
const cloudflare = context.get(cloudflareContext)
const { searchParams } = new URL(request.url) const { searchParams } = new URL(request.url)
const page = Number(searchParams.get('p')) + 1 const page = Number(searchParams.get('p')) + 1
const sort = searchParams.get('sort') || 'create_date:desc' const sort = searchParams.get('sort') || 'create_date:desc'
@@ -25,7 +27,7 @@ export async function loader({ context, request }: Route.LoaderArgs) {
sort: [sort], sort: [sort],
page, page,
hitsPerPage, hitsPerPage,
env: context.cloudflare.env env: cloudflare.env
}) })
} }
} }
@@ -38,7 +40,7 @@ export default function Route({ loaderData: { data } }: Route.ComponentProps) {
</div> </div>
<Await resolve={data}> <Await resolve={data}>
{({ hits, page, hitsPerPage, totalHits }) => { {({ hits, page = 1, hitsPerPage, totalHits }) => {
return ( return (
<DataTable <DataTable
sort={[{ id: 'created_at', desc: true }]} sort={[{ id: 'created_at', desc: true }]}

View File

@@ -4,6 +4,7 @@ import { Suspense } from 'react'
import { Await, useSearchParams } from 'react-router' import { Await, useSearchParams } from 'react-router'
import { MeiliSearchFilterBuilder } from 'meilisearch-helper' import { MeiliSearchFilterBuilder } from 'meilisearch-helper'
import { cloudflareContext } from '@repo/auth/context'
import { DataTable } from '@repo/ui/components/data-table' import { DataTable } from '@repo/ui/components/data-table'
import { SearchForm } from '@repo/ui/components/search-form' import { SearchForm } from '@repo/ui/components/search-form'
import { Skeleton } from '@repo/ui/components/skeleton' import { Skeleton } from '@repo/ui/components/skeleton'
@@ -17,6 +18,7 @@ export function meta({}: Route.MetaArgs) {
} }
export async function loader({ context, request }: Route.LoaderArgs) { export async function loader({ context, request }: Route.LoaderArgs) {
const cloudflare = context.get(cloudflareContext)
const { searchParams } = new URL(request.url) const { searchParams } = new URL(request.url)
const query = searchParams.get('q') || '' const query = searchParams.get('q') || ''
const sort = searchParams.get('sort') || 'createDate:desc' const sort = searchParams.get('sort') || 'createDate:desc'
@@ -32,13 +34,13 @@ export async function loader({ context, request }: Route.LoaderArgs) {
query, query,
page, page,
hitsPerPage, hitsPerPage,
env: context.cloudflare.env env: cloudflare.env
}) })
return { data: users } return { data: users }
} }
export default function Route({ loaderData: { data } }) { export default function Route({ loaderData: { data } }: Route.ComponentProps) {
const [searchParams, setSearchParams] = useSearchParams() const [searchParams, setSearchParams] = useSearchParams()
return ( return (
@@ -48,7 +50,7 @@ export default function Route({ loaderData: { data } }) {
</div> </div>
<Await resolve={data}> <Await resolve={data}>
{({ hits, page, hitsPerPage, totalHits }) => { {({ hits, page = 1, hitsPerPage, totalHits }) => {
return ( return (
<DataTable <DataTable
sort={[{ id: 'created_at', desc: true }]} sort={[{ id: 'created_at', desc: true }]}

View File

@@ -3,30 +3,29 @@ import type { Route } from './+types/route'
import { redirect } from 'react-router' import { redirect } from 'react-router'
import { createAuth, type User } from '@repo/auth/auth' import { createAuth, type User } from '@repo/auth/auth'
import { requestIdContext } from '@repo/auth/context' import { requestIdContext, cloudflareContext } from '@repo/auth/context'
import { createSessionStorage } from '@repo/auth/session' import { createSessionStorage } from '@repo/auth/session'
export async function loader({ request, context }: Route.ActionArgs) { export async function loader({ request, context }: Route.LoaderArgs) {
const url = new URL(request.url) const url = new URL(request.url)
const sessionStorage = createSessionStorage(context.cloudflare.env) const cloudflare = context.get(cloudflareContext)
const sessionStorage = createSessionStorage(cloudflare.env)
const session = await sessionStorage.getSession(request.headers.get('cookie')) const session = await sessionStorage.getSession(request.headers.get('cookie'))
const requestId = context.get(requestIdContext) const requestId = context.get(requestIdContext)
const user = session.get('user') as User | null const user = session.get('user')
const returnTo = ( const returnTo = (session.get('returnTo') as string | undefined) ?? '/'
session.has('returnTo') ? session.get('returnTo') : '/'
) as string
if (user) { if (user) {
return redirect(returnTo) return redirect(returnTo)
} }
try { try {
const authenticator = createAuth( const authenticator = createAuth(cloudflare.env, `${url.origin}/login`)
context.cloudflare.env, const authenticatedUser = (await authenticator.authenticate(
`${url?.origin}/login` 'oidc',
) request
const user = await authenticator.authenticate('oidc', request) )) as User
session.set('user', user) session.set('user', authenticatedUser)
console.log(`[${requestId}] Redirecting the user to ${returnTo}`) console.log(`[${requestId}] Redirecting the user to ${returnTo}`)

View File

@@ -5,12 +5,14 @@ import type { OAuth2Strategy } from 'remix-auth-oauth2'
import { createAuth, type User } from '@repo/auth/auth' import { createAuth, type User } from '@repo/auth/auth'
import { createSessionStorage } from '@repo/auth/session' import { createSessionStorage } from '@repo/auth/session'
import { cloudflareContext } from '@repo/auth/context'
export async function loader({ request, context }: Route.LoaderArgs) { export async function loader({ request, context }: Route.LoaderArgs) {
const authenticator = createAuth(context.cloudflare.env) const cloudflare = context.get(cloudflareContext)
const sessionStorage = createSessionStorage(context.cloudflare.env) const authenticator = createAuth(cloudflare.env)
const sessionStorage = createSessionStorage(cloudflare.env)
const session = await sessionStorage.getSession(request.headers.get('cookie')) const session = await sessionStorage.getSession(request.headers.get('cookie'))
const user = session.get('user') as User const user = session.get('user')
const strategy = authenticator.get<OAuth2Strategy<User>>('oidc') const strategy = authenticator.get<OAuth2Strategy<User>>('oidc')
if (user?.accessToken && strategy) { if (user?.accessToken && strategy) {

View File

@@ -1,7 +1,7 @@
import type { Route } from './+types/route' import type { Route } from './+types/route'
import type { User } from '@repo/auth/auth' import type { User } from '@repo/auth/auth'
import { userContext } from '@repo/auth/context' import { userContext, cloudflareContext } from '@repo/auth/context'
import { authMiddleware } from '@repo/auth/middleware/auth' import { authMiddleware } from '@repo/auth/middleware/auth'
export const middleware: Route.MiddlewareFunction[] = [authMiddleware] export const middleware: Route.MiddlewareFunction[] = [authMiddleware]
@@ -13,8 +13,9 @@ async function proxy({
context context
}: Route.ActionArgs): Promise<Response> { }: Route.ActionArgs): Promise<Response> {
const pathname = new URL(request.url).pathname.replace(/^\/~\/api\//, '') const pathname = new URL(request.url).pathname.replace(/^\/~\/api\//, '')
const user = context.get(userContext) as User const cloudflare = context.get(cloudflareContext)
const url = new URL(pathname, context.cloudflare.env.API_URL) const user = context.get(userContext)!
const url = new URL(pathname, cloudflare.env.API_URL)
const headers = new Headers(request.headers) const headers = new Headers(request.headers)
headers.set('Authorization', `Bearer ${user.accessToken}`) headers.set('Authorization', `Bearer ${user.accessToken}`)

View File

@@ -1,12 +1,9 @@
import { createRequestHandler, RouterContextProvider } from 'react-router' import { createRequestHandler, RouterContextProvider } from 'react-router'
import { cloudflareContext } from '@repo/auth/context'
declare module 'react-router' { declare module '@repo/auth/context' {
export interface AppLoadContext { interface CloudflareEnv extends Env {}
cloudflare: { interface CloudflareCtx extends ExecutionContext {}
env: Env
ctx: ExecutionContext
}
}
} }
const requestHandler = createRequestHandler( const requestHandler = createRequestHandler(
@@ -16,11 +13,10 @@ const requestHandler = createRequestHandler(
export default { export default {
async fetch(request, env, ctx) { async fetch(request, env, ctx) {
const context = new RouterContextProvider() const context = new RouterContextProvider(
new Map([[cloudflareContext, { env, ctx }]])
return requestHandler(
request,
Object.assign(context, { cloudflare: { env, ctx } })
) )
return requestHandler(request, context)
} }
} satisfies ExportedHandler<Env> } satisfies ExportedHandler<Env>