Mik3y-F Posts - Answer Overflow

Mik3y-F

Explore posts from servers

•Created by Mik3y-F on 5/7/2024 in #questions

Missing FormData value when using Server actions

https://paste.ofcode.org/x5JEX8LRy5F6gLxqvNCBqp -> Form Component https://paste.ofcode.org/3bRDCsJTcq9En6Ltf5EXg2j -> Country Combobox I am currently facing an issue where an input value ie. the country ID is not being sent as part of the FormData object to my server action anyone able to advise on what may be wrong My current hunch is that it might have to do with the Country Combobox I just can't say what exactly

2 replies

TTCTheo's Typesafe Cult

•Created by Mik3y-F on 5/3/2023 in #questions

How do I make Jotai work with trpc on the t3 stack?

I am having trouble finding ways to work with Jotai and trpc on nextjs.

4 replies

TTCTheo's Typesafe Cult

•Created by Mik3y-F on 4/28/2023 in #questions

I'm having trouble using the shadcn-ui Sheet component

I keep gettting the error below Error: DialogTrigger must be used within Dialog anybody know what I might be getting wrong

4 replies

TTCTheo's Typesafe Cult

•Created by Mik3y-F on 4/7/2023 in #questions

How do I solve for a persisting session on Next-auth when User is deleted from DB.

I am currently finding that My user auth sessions are persisted even when I have cleared my db. What is the cleanest way around this. If possible kindly share a solution when using the jwt strategy as well

17 replies

TTCTheo's Typesafe Cult

•Created by Mik3y-F on 3/20/2023 in #questions

Data visualisation library

What's the best data visualisation library within the react ecosystem at the moment?

2 replies

TTCTheo's Typesafe Cult

•Created by Mik3y-F on 2/17/2023 in #questions

React Carousel Library

Anybody able to recommend a good carousel react library. I'm having a difficult time finding a decent one

2 replies

TTCTheo's Typesafe Cult

•Created by Mik3y-F on 11/6/2022 in #questions

Per-Page Layouts in T3

Hey guys I was attempting to implement per page layouts on the t3 starter template as shown here: https://nextjs.org/docs/basic-features/layouts#with-typescript I kept running into Typescript issues. Any way I could go about this in a way I could make Typescript happy? There is a squiggly line on MyApp and the getLayout function argument in the return. Feel free to suggest a better approach for this.

// pages/_app.tsx
import type { AppProps } from "next/app";
import { type AppType } from "next/app";
import { type Session } from "next-auth";
import { SessionProvider } from "next-auth/react";

import { trpc } from "../utils/trpc";

import "../styles/globals.css";
import type { NextPage } from "next";
import type { ReactElement, ReactNode } from "react";


export type NextPageWithLayout<P = {}, IP = P> = NextPage<P, IP> & {
  getLayout?: (page: ReactElement) => ReactNode;
};

type AppPropsWithLayout = AppProps & {
  Component: NextPageWithLayout;
};

const MyApp: AppType<{ session: Session | null }> = ({
  Component,
  pageProps: { session, ...pageProps },
}: AppPropsWithLayout) => {
  const getLayout = Component.getLayout || ((page: NextPage) => page);

  return getLayout(
    <SessionProvider session={session}>
      <Component {...pageProps} />
    </SessionProvider>
  );
};

export default trpc.withTRPC(MyApp);

// pages/_app.tsx
import type { AppProps } from "next/app";
import { type AppType } from "next/app";
import { type Session } from "next-auth";
import { SessionProvider } from "next-auth/react";

import { trpc } from "../utils/trpc";

import "../styles/globals.css";
import type { NextPage } from "next";
import type { ReactElement, ReactNode } from "react";


export type NextPageWithLayout<P = {}, IP = P> = NextPage<P, IP> & {
  getLayout?: (page: ReactElement) => ReactNode;
};

type AppPropsWithLayout = AppProps & {
  Component: NextPageWithLayout;
};

const MyApp: AppType<{ session: Session | null }> = ({
  Component,
  pageProps: { session, ...pageProps },
}: AppPropsWithLayout) => {
  const getLayout = Component.getLayout || ((page: NextPage) => page);

  return getLayout(
    <SessionProvider session={session}>
      <Component {...pageProps} />
    </SessionProvider>
  );
};

export default trpc.withTRPC(MyApp);

// pages/index.tsx
import type { ReactElement } from "react";
import Layout from "../components/Layout/Layout";
import type { NextPageWithLayout } from "./_app";

const Home: NextPageWithLayout = () => {
  return (
    <>
      <div>Hello</div>
    </>
  );
};

Home.getLayout = function getLayout(page: ReactElement) {
  return <Layout>{page}</Layout>;
};

export default Home;

// pages/index.tsx
import type { ReactElement } from "react";
import Layout from "../components/Layout/Layout";
import type { NextPageWithLayout } from "./_app";

const Home: NextPageWithLayout = () => {
  return (
    <>
      <div>Hello</div>
    </>
  );
};

Home.getLayout = function getLayout(page: ReactElement) {
  return <Layout>{page}</Layout>;
};

export default Home;

19 replies

Gaming

Programming