raynirola

export function IsolateCSS(props: { children: React.ReactNode }) {
	const onceRef = useRef(false);
	const [shadowRoot, setShadowRoot] = useState<ShadowRoot>();
	const ref = useCallback((ref: HTMLDivElement | null) => {
		if (ref && onceRef.current === false) {
			onceRef.current = true;
			setShadowRoot(ref.attachShadow({ mode: 'open' }));
		}
	}, []);

raynirola

type Params<T = Record<string, string>> = T

type SearchParams<T = Record<string, string | string[] | undefined>> = T

interface PageProps<P, S> {
  params: Params<P>
  searchParams: SearchParams<S>
}

interface LayoutProps<P> {

raynirola

import { ZodError, ZodTypeAny, z } from 'zod'
import type { NextApiHandler, NextApiRequest, NextApiResponse } from 'next'

interface WithZodArgs<T> {
  schema: T
  method?: NextApiRequest['method']
}

interface ZodRequest<T> extends NextApiRequest {
  body: T

raynirola

How to protect yourself as a website provider?

Until Instagram resolves this issue (if ever), you can quite easily trick the Instagram and Facebook app to believe the tracking code is already installed. Just add the following to your HTML code:

<span id="iab-pcm-sdk"></span>
<span id="iab-autofill-sdk"></span>

Additionally, to prevent Instagram from tracking the user’s text selections on your website:

raynirola

import sendgrid from '@sendgrid/mail';

sendgrid.setApiKey(process.env.SENDGRID_API_KEY);

export default async (req, res) => {
  try {
    await sendgrid.send({
      to: '[email protected]',
      from: '[email protected]',
      subject: 'Serverless Functions',

raynirola

import { PrismaClient } from '@prisma/client'

const globalWithPrisma = global as typeof globalThis & { prisma: PrismaClient }

let prisma: PrismaClient

if (process.env.NODE_ENV === 'production') {
  prisma = new PrismaClient()
} else {
  if (!globalWithPrisma.prisma) globalWithPrisma.prisma = new PrismaClient()

raynirola

import type { LinkProps } from 'next/link'
import type { PropsWithChildren, HTMLProps } from 'react'

import Link from 'next/link'
import { forwardRef } from 'react'

type HeadlessLinkProps = PropsWithChildren<LinkProps & HTMLProps<HTMLAnchorElement>>

const HeadlessLink = forwardRef<HTMLAnchorElement, HeadlessLinkProps>((props, ref) => {
  const { href, children, ...rest } = props

raynirola

const rtf = new Intl.RelativeTimeFormat ("en", {
  localeMatcher: "best fit",
  numeric: "always",
  style: "long",
});

function getDifferenceInDays(fromDate, toDate) {
  const diff = Math.floor( (fromDate - toDate) / (1000 * 60 * 60 * 24));
  return rtf.format (diff, "day");
}