Skip to content

Commit

Permalink
fix type issues in fullstack
Browse files Browse the repository at this point in the history
  • Loading branch information
natew committed Jul 24, 2024
1 parent 21daaf7 commit febc6ef
Show file tree
Hide file tree
Showing 8 changed files with 39 additions and 216 deletions.
116 changes: 6 additions & 110 deletions examples/fullstack/app/(site)/index.tsx
Original file line number Diff line number Diff line change
@@ -1,127 +1,23 @@
import { getCompilationExamples } from '@tamagui/mdx'
import { YStack } from 'tamagui'
import { H1 } from 'tamagui'
import { useLoader } from 'vxs'
import { HeadInfo } from '~/components/HeadInfo'
import { HomeAnimations } from '~/features/site/home/HomeAnimations'
import { HomeCommunity } from '~/features/site/home/HomeCommunity'
import { HomeExampleProps } from '~/features/site/home/HomeExampleProps'
import { HomeExamples } from '~/features/site/home/HomeExamples'
import { HomeFeaturesGrid } from '~/features/site/home/HomeFeaturesGrid'
import { HomeGlow } from '~/features/site/home/HomeGlow'
import { Hero } from '~/features/site/home/HomeHero'
import { HomeHeroBelow } from '~/features/site/home/HomeHeroBelow'
import { HomePerformance } from '~/features/site/home/HomePerformance'
import { HomeResponsive } from '~/features/site/home/HomeResponsive'
import { HomeThemes } from '~/features/site/home/HomeThemes'
import { HomeTypography } from '~/features/site/home/HomeTypography'
import { HomeSection, SectionTinted, TintSection } from '~/features/site/home/TintSection'
import { ThemeNameEffect } from '~/features/site/theme/ThemeNameEffect'

export async function loader() {
return getCompilationExamples()
return {
hello: 'world',
}
}

export default function TamaguiHomePage() {
const { compilationExamples, animationCode } = useLoader(loader)

if (!compilationExamples) {
return null
}
const { hello } = useLoader(loader)

return (
<>
<HeadInfo
title="Tamagui"
description="React style library and UI kit that unifies React Native and React web"
/>
<ThemeNameEffect colorKey="$color2" />
<HomeGlow />
<YStack
fullscreen
className="grain"
o={0.2}
style={{
maskImage: `linear-gradient(transparent, rgba(0, 0, 0, 1) 100px)`,
}}
/>
<TintSection index={0} p={0}>
<Hero />
</TintSection>
<HomeHeroBelow />
<TintSection index={2} contain="paint layout" zi={1000}>
<YStack
pe="none"
zi={0}
fullscreen
className="bg-dot-grid"
style={{
maskImage: `linear-gradient(transparent, #000, transparent)`,
}}
/>
<HomeExamples examples={compilationExamples} />
</TintSection>
<TintSection my={-50} index={3} contain="paint layout" pos="relative" zi={100}>
<YStack
pe="none"
zi={0}
fullscreen
className="bg-dot-grid"
style={{
maskImage: `linear-gradient(transparent, #000, transparent)`,
}}
/>
<HomeThemes />
</TintSection>
<TintSection index={4} mb={-120} zIndex={10000}>
<HomeResponsive />
</TintSection>
<TintSection index={5} p={0} zIndex={0}>
<SectionTinted gradient bubble>
<HomePerformance />
</SectionTinted>
</TintSection>
<TintSection index={6} zi={100}>
<YStack
fullscreen
className="bg-grid"
style={{
maskImage: `linear-gradient(transparent, #000, transparent)`,
}}
/>
<HomeAnimations animationCode={animationCode} />
</TintSection>
<TintSection index={7} zi={1}>
<HomeFeaturesGrid />
<YStack
pe="none"
zi={2}
fullscreen
className="bg-dot-grid"
style={{
maskImage: `linear-gradient(transparent, #000, transparent)`,
}}
/>
</TintSection>
<TintSection index={8} my="$-4" p={0} zIndex={100}>
<SectionTinted zi={1000} bubble gradient>
<HomeTypography />
</SectionTinted>
</TintSection>
<HomeSection zi={10}>
<YStack
pe="none"
zi={0}
fullscreen
className="bg-dot-grid"
style={{
maskImage: `linear-gradient(transparent, #000, transparent)`,
}}
/>
<HomeExampleProps />
</HomeSection>
<HomeSection zi={0}>
<HomeCommunity />
</HomeSection>
<H1>Hello {hello}</H1>
</>
)
}
53 changes: 7 additions & 46 deletions examples/fullstack/app/(site)/login.tsx
Original file line number Diff line number Diff line change
@@ -1,13 +1,10 @@
import type { Provider } from '@supabase/supabase-js'
import { LogoIcon } from '@tamagui/logo'
import type { FormEvent } from 'react'
import { useEffect, useRef, useState } from 'react'
import { useState } from 'react'
import { Button, Input, Paragraph, Separator, Spinner, XStack, YStack } from 'tamagui'
import { HeadInfo } from '~/components/HeadInfo'
import { Notice } from '~/components/Notice'
import { useSupabase } from '~/features/auth/useSupabaseClient'
import { GithubIcon } from '~/features/icons/GithubIcon'
import { useForwardToDashboard } from '~/features/user/useForwardToDashboard'
import { useSupabase } from '~/features/supabase/useSupabaseClient'
import { useUser } from '~/features/user/useUser'

const isProd = process.env.NODE_ENV === 'production'
Expand All @@ -34,14 +31,6 @@ function SignIn() {
})
const { data } = useUser()
const user = data?.user
const emailRef = useRef(null)

useEffect(() => {
// @ts-ignore
emailRef.current?.focus()
}, [])

useForwardToDashboard()

if (!supabase) {
return (
Expand Down Expand Up @@ -111,9 +100,9 @@ function SignIn() {
</YStack>

{Boolean(message.content) && (
<Notice>
<>
<Paragraph>{message.content}</Paragraph>
</Notice>
</>
)}

<Button
Expand All @@ -122,14 +111,13 @@ function SignIn() {
disabled={loading}
onClick={() => handleOAuthSignIn('github')}
size="$4"
icon={GithubIcon}
>
Continue with GitHub
</Button>

<Paragraph ta="center" color="$color8">
Note: If part of a sponsoring organization, you'll need to grant access to
your org when logging in to access sponsor benefits.
Note: If part of a sponsoring organization, you'll need to grant access to your org when
logging in to access sponsor benefits.
</Paragraph>

{!emailAuthDisabledFlag && (
Expand All @@ -151,7 +139,6 @@ function SignIn() {
onSubmitEditing={handleSignin}
value={email}
onChange={(e) => setEmail(e.nativeEvent.text)}
ref={emailRef}
disabled={emailAuthDisabledFlag}
/>
<Button
Expand Down Expand Up @@ -192,9 +179,7 @@ function SignIn() {
// @ts-ignore
type="submit"
loading={loading}
disabled={
!password.length || !email.length || emailAuthDisabledFlag
}
disabled={!password.length || !email.length || emailAuthDisabledFlag}
>
Sign in
</Button>
Expand Down Expand Up @@ -222,30 +207,6 @@ function SignIn() {
</YStack>
</>
)}
{/* <YStack space="$2" >
<Paragraph
tag="button"
ta="center"
size="$2"
cursor="pointer"
className="text-zinc-200 text-accent-9 hover:underline cursor-pointer"
onPress={() => {
if (showPasswordInput) setPassword('')
setShowPasswordInput(!showPasswordInput)
setMessage({})
}}
>
Or sign in with {showPasswordInput ? 'magic link' : 'password'}
</Paragraph>
<Paragraph theme="alt2" ta="center" size="$2">
Don't have an account?
{` `}
<Link href="/signup" style={{ fontWeight: '800' }}>
Sign up.
</Link>
</Paragraph>
</YStack> */}
</YStack>
</YStack>
)
Expand Down
3 changes: 2 additions & 1 deletion examples/fullstack/app/_layout.tsx
Original file line number Diff line number Diff line change
@@ -1,11 +1,12 @@
import '~/app.css'
import '~/tamagui.css'

import { ToastProvider } from '@tamagui/toast'
import { isWeb, setupPopper, TamaguiProvider } from 'tamagui'
import { PageLoadProgressBar, ScrollRestoration, Slot, Stack } from 'vxs'
import { HeadInfo } from '~/components/HeadInfo'
import tamaConf from '~/config/tamagui.config'
import { UserThemeProvider, useUserTheme } from '~/features/site/theme/useUserTheme'
import { UserThemeProvider, useUserTheme } from '~/features/theme/useUserTheme'

setupPopper({
// prevents a reflow on mount
Expand Down
2 changes: 1 addition & 1 deletion examples/fullstack/features/api/redirect.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { getURL } from '~/helpers/getURL'
import { getURL } from '~/features/core/getURL'

export const redirect = (path: string, status?: number) => {
return Response.redirect(path[0] === '/' ? `${getURL()}${path}` : path, status)
Expand Down
6 changes: 6 additions & 0 deletions examples/fullstack/features/core/getURL.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
const url = `${process.env.URL || process.env.VITE_PUBLIC_URL || 'http://127.0.0.1:8081'}`
const urlWithProtocol = url.startsWith('http') ? url : `https://${url}`

export const getURL = () => {
return urlWithProtocol
}
2 changes: 1 addition & 1 deletion examples/fullstack/features/email/send.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import * as postmark from 'postmark'

const serverToken = process.env.POSTMARK_SERVER_TOKEN
const serverToken = process.env.POSTMARK_SERVER_TOKEN || ''

const client = new postmark.ServerClient(serverToken)

Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -34,7 +34,7 @@
"test": "yarn turbo:run --concurrency=1 test",
"watch:build": "SKIP_TYPES_INITIAL=1 ultra -r --no-pretty --concurrency 400 watch",
"watch:js": "SKIP_TYPES=1 yarn watch:build",
"watch:ts": "tsc -w -b --preserveWatchOutput",
"watch:ts": "tsc -b -w --preserveWatchOutput",
"watch": "npm-run-all --parallel watch:ts watch:build",
"vxs": "yarn workspace example-vxs"
},
Expand Down
71 changes: 15 additions & 56 deletions tsconfig.json
Original file line number Diff line number Diff line change
@@ -1,61 +1,20 @@
{
"files": [],
"compilerOptions": {
"baseUrl": ".",
"rootDir": ".",
"paths": {
"vxrn": [
"packages/vxrn"
],
"@vxrn/*": [
"packages/*"
]
},
"importHelpers": true,
"allowJs": false,
"resolveJsonModule": true,
"allowSyntheticDefaultImports": true,
"forceConsistentCasingInFileNames": true,
"declaration": true,
"downlevelIteration": true,
"strict": true,
"esModuleInterop": true,
"inlineSourceMap": true,
"preserveSymlinks": true,
"jsx": "react-jsx",
"module": "Preserve",
"moduleResolution": "Bundler",
"noEmit": false,
"noEmitOnError": false,
"noImplicitAny": false,
"noImplicitReturns": false,
"noUnusedLocals": false,
"noUnusedParameters": false,
"preserveConstEnums": true,
"removeComments": false,
"typeRoots": ["node_modules/@types"],
"skipDefaultLibCheck": true,
"skipLibCheck": true,
"sourceMap": false,
"strictNullChecks": true,
"target": "es2020",
"types": [
"vite/client",
"node",
"react"
],
"lib": [
"dom",
"esnext"
]
"noEmit": true
},
"include": [
"packages/**/*"
],
"exclude": [
"**/test",
"**/dist",
"**/types",
"**/__tests__"
],
"typeAcquisition": {
"enable": true
}
"references": [
{
"path": "examples/fullstack"
},
{
"path": "examples/vxs"
},
{
"path": "examples/bare"
}
]
}

0 comments on commit febc6ef

Please sign in to comment.