cje
cje
Explore posts from servers
TTCTheo's Typesafe Cult
Created by cje on 4/3/2024 in #questions
profiling react component body
No description
6 replies
TTCTheo's Typesafe Cult
Created by cje on 4/2/2024 in #questions
Regression testing React.memo
hi all, i have an expensive component that's memoized, and this depends on a godawful chain of useCallbacks etc. is there any way to write a (unit, browser, whatever) regression test that ensures the memoization is still working after changes are made? the general vibe online seems to be that this is a bad idea, but preventing regressions here is super important.
2 replies
TTCTheo's Typesafe Cult
Created by cje on 9/24/2023 in #questions
ISR an RSC
is it possible to ISR an entire page.ts RSC in the app dir? i'm making some DB requests with drizzle inline and then rendering some html based on that. so far it seems like the only way to ISR this is to move the DB requests to a route.ts and use fetch with the right settings. Am I right about this or is there an easier way?
4 replies
TTCTheo's Typesafe Cult
Created by cje on 8/24/2023 in #questions
lint rule to ban anonymous functions inside HOCs
In our codebase at work we have a lot of components that are wrapped by HoCs. Basically fine, just one huge problem: some of the react-hooks lint rules aren't checked for when you do this, see: https://github.com/facebook/react/issues/20499 Does anyone know if it's possible to set up a lint rule that catches this? ie:
// this should make the linter complain
export const SomeComponent = observer(() => {
return <div />
});
// this should make the linter complain
export const SomeComponent = observer(() => {
return <div />
});
// this is ok
export const SomeComponent = Observer(function SomeOtherComponent() {
return <div />
});
// this is ok
export const SomeComponent = Observer(function SomeOtherComponent() {
return <div />
});
2 replies
TTCTheo's Typesafe Cult
Created by cje on 4/22/2023 in #questions
best way to benchmark cold starts
i'm going to upgrade some apps to the json protocol and would like some stats on the impact it made. what's the best way to get useful stats on this without too much work?
5 replies
TTCTheo's Typesafe Cult
Created by cje on 4/8/2023 in #questions
how do you get the query string in next app dir api routes?
like on GET example.com/api/foo?bar=%22baz%22 i want to get { bar: "baz" }
7 replies
TTCTheo's Typesafe Cult
Created by cje on 2/20/2023 in #questions
NextAuth + GitHub Provider refresh
is anyone using NextAuth with the GitHub provider in a real app? From what I understand, sessions don't get renewed properly after a few hours unless you make some changes, see: - https://next-auth.js.org/providers/github - https://docs.github.com/en/apps/creating-github-apps/authenticating-with-a-github-app/refreshing-user-to-server-access-tokens#response Is the only required change to add the refresh_token_expires_in to the Account model, or does it require anything else?
4 replies
TTCTheo's Typesafe Cult
Created by cje on 12/26/2022 in #questions
why is there a diff in last line of package.json?
7 replies
TTCTheo's Typesafe Cult
Created by cje on 11/27/2022 in #questions
vscode extension for showing context
11 replies
TTCTheo's Typesafe Cult
Created by cje on 11/4/2022 in #questions
lazy load react context
Is it possible to "lazy load" react context? ie make a network request the first time the context is required (by a useContext, not by the provider), and then keep the context for the duration of the session?
7 replies
TTCTheo's Typesafe Cult
Created by cje on 11/2/2022 in #questions
gitlab - don't target master if target branch is deleted
In our current GitLab setup, we require each merge request to target a weekly business testing branch. However when these branches get deleted, any merge request that hasn't been merged yet will automatically change its target to master. This seems like the worst possible outcome as master is prod and we absolutely don't want to merge into prod without doing business testing first. Does anyone know if there is a way to change this behaviour in gitlab settings? I had a look around but couldn't find anything.
2 replies
TTCTheo's Typesafe Cult
Created by cje on 10/29/2022 in #questions
beginner golang resources
Any recommendations for how to get started with golang? I’m not too worried about syntax, more package management, how to set up a good dev environment, etc
11 replies
TTCTheo's Typesafe Cult
Created by cje on 10/21/2022 in #questions
JS library for visualizing & interacting with graph db
Does anyone know if there is a good npm package or some other good off the shelf solution for visualizing and interacting with relations in a graph database? For example with a role based access system, figuring out through which edges someone has access to a role, and changing this. We're using Memgraph, which uses the same Cypher query language as Neo4j.
1 replies
TTCTheo's Typesafe Cult
Created by cje on 10/19/2022 in #questions
How to do this React Query thing without useEffect
Hi, here's some working code that I would love to remove the useEffect from. However if I just give the input text to the query directly, search results disappear when the user changes the search text because it creates a new query. Any ideas on an elegant way to solve this?
const [inputVal, setInputVal] = useState("");
const [text, setText] = useState("");

const {
data,
refetch,
// etc
} = useGetPostsPaginated({ text }); // this is a tRPC query

useEffect(() => {
if (text.length > 0) {
refetch();
}
}, [text, refetch]);

function handleSearch(e: React.FormEvent) {
e.preventDefault();
setText(inputVal);
}

return (
<>
<form onSubmit={handleSearch}>
<input value={inputVal} onChange={e => stInputVal(e.target.value)} />
<button>Submit</button>
</form>
{data && <pre>{JSON.stringify(data, null, 2)}</pre>}
</>
)
const [inputVal, setInputVal] = useState("");
const [text, setText] = useState("");

const {
data,
refetch,
// etc
} = useGetPostsPaginated({ text }); // this is a tRPC query

useEffect(() => {
if (text.length > 0) {
refetch();
}
}, [text, refetch]);

function handleSearch(e: React.FormEvent) {
e.preventDefault();
setText(inputVal);
}

return (
<>
<form onSubmit={handleSearch}>
<input value={inputVal} onChange={e => stInputVal(e.target.value)} />
<button>Submit</button>
</form>
{data && <pre>{JSON.stringify(data, null, 2)}</pre>}
</>
)
7 replies
TTCTheo's Typesafe Cult
Created by cje on 10/6/2022 in #questions
Next.js dynamic route param typesafety
Is there a better solution than this? Feels annoying to do this for every dynamic route.
// [userId].tsx

const UserPage: NextPage = () => {
const { query } = useRouter();

const userId =
(Array.isArray(query.userId) ? query.userId[0] : query.userId) || "";

return <div>{userId}</div>;
};
// [userId].tsx

const UserPage: NextPage = () => {
const { query } = useRouter();

const userId =
(Array.isArray(query.userId) ? query.userId[0] : query.userId) || "";

return <div>{userId}</div>;
};
5 replies