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

Jump to bottom

chore: Support a TRPC client in App Router Server Components #34

Merged
merged 2 commits into from
Oct 26, 2023
Merged

chore: Support a TRPC client in App Router Server Components #34

merged 2 commits into from
Oct 26, 2023

Conversation

hbjORbj
Copy link

@hbjORbj hbjORbj commented Oct 10, 2023 •
edited
Loading

What does this PR do?

  • As mentioned in this comment from a maintainer of trpc package, Next 13 is currently not compatible with trpc.
  • This PR is an attempt to introduce a workaround to make it compatible with Next 13 via methods mentioned in article 1 and article 2.

Requirement/Documentation

Type of change

  • Bug fix (non-breaking change which fixes an issue)
  • Chore (refactoring code, technical debt, workflow improvements)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to not work as expected)
  • This change requires a documentation update

@github-actions
Copy link

github-actions bot commented Oct 10, 2023 •
edited
Loading

Thank you for following the naming conventions! 🙏 Feel free to join our discord and post your PR link to collect XP and win prizes!

grzpab
grzpab reviewed Oct 10, 2023
View reviewed changes
apps/web/next.config.js Outdated Show resolved Hide resolved
packages/lib/server/i18n.ts Outdated Show resolved Hide resolved
DmytroHryshyn
DmytroHryshyn reviewed Oct 10, 2023
View reviewed changes
apps/web/utils/trpc-provider.tsx Outdated

return (
<trpc.Provider client={trpcClient} queryClient={queryClient}>
<QueryClientProvider client={queryClient}>{children}</QueryClientProvider>
Copy link

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think we need to add HydrationClient here so we can pass trpcState from server to it

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

addressed

@hbjORbj hbjORbj changed the title Draft: Make tRPC client compatible with next.js 13 Make tRPC client compatible with next.js 13 Oct 10, 2023
@DmytroHryshyn DmytroHryshyn force-pushed the intuita/newLayout branch 3 times, most recently from 6b37c70 to f3b1f5a Compare October 18, 2023 09:55
@grzpab grzpab force-pushed the intuita/newLayout branch 2 times, most recently from bf84df9 to b4dcd9d Compare October 19, 2023 08:41
@grzpab grzpab force-pushed the intuita/newLayout branch 3 times, most recently from 1965df3 to 3d05a13 Compare October 25, 2023 07:52
@hbjORbj hbjORbj force-pushed the trpc-migrate branch 3 times, most recently from a74e8c1 to fb1ca6e Compare October 25, 2023 17:07
@DmytroHryshyn DmytroHryshyn changed the base branch from intuita/newLayout to intuita/app-router-migration October 26, 2023 10:14
@hbjORbj
wip
654c98c 
wip

wip

clean up

WIP

wip

address

finalise

clean up

fix type

remove

clean up TrpcProvider

wip
@hbjORbj
finalise
3af3297
@hbjORbj hbjORbj changed the title Make tRPC client compatible with next.js 13 chore: Support a TRPC client in App Router Server Components Oct 26, 2023
@hbjORbj hbjORbj merged commit 4c6e4ac into intuita/app-router-migration Oct 26, 2023
2 of 4 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@grzpab grzpab grzpab left review comments

@DmytroHryshyn DmytroHryshyn DmytroHryshyn approved these changes

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
3 participants
@hbjORbj @grzpab @DmytroHryshyn