Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[2.x] Declare global types for React PageProps #405

Merged
merged 5 commits into from
Sep 11, 2024
Merged

[2.x] Declare global types for React PageProps #405

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
8ff63cf
declare types for page props
matsantosz Sep 5, 2024
8d5d3e0
Also for JSX
matsantosz Sep 5, 2024
6975024
missing import
matsantosz Sep 6, 2024
ce40e42
fix TS2310
matsantosz Sep 6, 2024
6855f57
include "skipLibCheck"
matsantosz Sep 6, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 4 additions & 3 deletions stubs/inertia-react-ts/resources/js/Layouts/AuthenticatedLayout.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,11 @@ import ApplicationLogo from '@/Components/ApplicationLogo';
import Dropdown from '@/Components/Dropdown';
import NavLink from '@/Components/NavLink';
import ResponsiveNavLink from '@/Components/ResponsiveNavLink';
import { Link } from '@inertiajs/react';
import { User } from '@/types';
import { Link, usePage } from '@inertiajs/react';

export default function Authenticated({ header, children }: PropsWithChildren<{ header?: ReactNode }>) {
const user = usePage().props.auth.user;

export default function Authenticated({ user, header, children }: PropsWithChildren<{ user: User, header?: ReactNode }>) {
const [showingNavigationDropdown, setShowingNavigationDropdown] = useState(false);

return (
Expand Down
4 changes: 1 addition & 3 deletions stubs/inertia-react-ts/resources/js/Pages/Dashboard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,11 +1,9 @@
import AuthenticatedLayout from '@/Layouts/AuthenticatedLayout';
import { Head } from '@inertiajs/react';
import { PageProps } from '@/types';

export default function Dashboard({ auth }: PageProps) {
export default function Dashboard() {
return (
<AuthenticatedLayout
user={auth.user}
header={<h2 className="font-semibold text-xl text-gray-800 dark:text-gray-200 leading-tight">Dashboard</h2>}
>
<Head title="Dashboard" />
Expand Down
3 changes: 1 addition & 2 deletions stubs/inertia-react-ts/resources/js/Pages/Profile/Edit.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,10 +5,9 @@ import UpdateProfileInformationForm from './Partials/UpdateProfileInformationFor
import { Head } from '@inertiajs/react';
import { PageProps } from '@/types';

export default function Edit({ auth, mustVerifyEmail, status }: PageProps<{ mustVerifyEmail: boolean, status?: string }>) {
export default function Edit({ mustVerifyEmail, status }: PageProps<{ mustVerifyEmail: boolean, status?: string }>) {
return (
<AuthenticatedLayout
user={auth.user}
header={<h2 className="font-semibold text-xl text-gray-800 dark:text-gray-200 leading-tight">Profile</h2>}
>
<Head title="Profile" />
Expand Down
3 changes: 1 addition & 2 deletions stubs/inertia-react-ts/resources/js/Pages/Profile/Partials/UpdateProfileInformationForm.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,10 +5,9 @@ import TextInput from '@/Components/TextInput';
import { Link, useForm, usePage } from '@inertiajs/react';
import { Transition } from '@headlessui/react';
import { FormEventHandler } from 'react';
import { PageProps } from '@/types';

export default function UpdateProfileInformation({ mustVerifyEmail, status, className = '' }: { mustVerifyEmail: boolean, status?: string, className?: string }) {
const user = usePage<PageProps>().props.auth.user;
const user = usePage().props.auth.user;

const { data, setData, patch, errors, processing, recentlySuccessful } = useForm({
name: user.name,
Expand Down
2 changes: 0 additions & 2 deletions stubs/inertia-react-ts/resources/js/ssr.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,9 +16,7 @@ createServer((page) =>
setup: ({ App, props }) => {
global.route<RouteName> = (name, params, absolute) =>
route(name, params as any, absolute, {
// @ts-expect-error
...page.props.ziggy,
// @ts-expect-error
location: new URL(page.props.ziggy.location),
});

Expand Down
6 changes: 6 additions & 0 deletions stubs/inertia-react-ts/resources/js/types/global.d.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,7 @@
import { PageProps as InertiaPageProps } from '@inertiajs/core';
import { AxiosInstance } from 'axios';
import { route as ziggyRoute } from 'ziggy-js';
import { PageProps as AppPageProps } from './';

declare global {
interface Window {
Expand All @@ -8,3 +10,7 @@ declare global {

var route: typeof ziggyRoute;
}

declare module '@inertiajs/core' {
interface PageProps extends InertiaPageProps, AppPageProps {}
}
1 change: 1 addition & 0 deletions stubs/inertia-react-ts/tsconfig.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@
"target": "ESNext",
"esModuleInterop": true,
"forceConsistentCasingInFileNames": true,
"skipLibCheck": true,
"noEmit": true,
"paths": {
"@/*": ["./resources/js/*"],
Expand Down
6 changes: 4 additions & 2 deletions stubs/inertia-react/resources/js/Layouts/AuthenticatedLayout.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,11 @@ import ApplicationLogo from '@/Components/ApplicationLogo';
import Dropdown from '@/Components/Dropdown';
import NavLink from '@/Components/NavLink';
import ResponsiveNavLink from '@/Components/ResponsiveNavLink';
import { Link } from '@inertiajs/react';
import { Link, usePage } from '@inertiajs/react';

export default function Authenticated({ header, children }) {
const user = usePage().props.auth.user;

export default function Authenticated({ user, header, children }) {
const [showingNavigationDropdown, setShowingNavigationDropdown] = useState(false);

return (
Expand Down
3 changes: 1 addition & 2 deletions stubs/inertia-react/resources/js/Pages/Dashboard.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,10 +1,9 @@
import AuthenticatedLayout from '@/Layouts/AuthenticatedLayout';
import { Head } from '@inertiajs/react';

export default function Dashboard({ auth }) {
export default function Dashboard() {
return (
<AuthenticatedLayout
user={auth.user}
header={<h2 className="font-semibold text-xl text-gray-800 dark:text-gray-200 leading-tight">Dashboard</h2>}
>
<Head title="Dashboard" />
Expand Down
3 changes: 1 addition & 2 deletions stubs/inertia-react/resources/js/Pages/Profile/Edit.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,9 @@ import UpdatePasswordForm from './Partials/UpdatePasswordForm';
import UpdateProfileInformationForm from './Partials/UpdateProfileInformationForm';
import { Head } from '@inertiajs/react';

export default function Edit({ auth, mustVerifyEmail, status }) {
export default function Edit({ mustVerifyEmail, status }) {
return (
<AuthenticatedLayout
user={auth.user}
header={<h2 className="font-semibold text-xl text-gray-800 dark:text-gray-200 leading-tight">Profile</h2>}
>
<Head title="Profile" />
Expand Down