AndrewIngram

Warning, this is a bad idea. It'll eventually break and use undocumented framework internals

Using headers() and cache() in Next 13.1 API routes

Note: API routes are still only supported in the pages folder, not app.

I was playing around with using API routes with the experimental app dir stuff in Next 13, and I was frustrated at having to use completely different code paths for accessing the request headers and cookies compared to in server components. So I hacked together a workaround which you definitely shouldn't use.

Usage requires two steps, one is easy, the other is invasive:

AndrewIngram

"""
This snippet will return all the letting agents, bucketed into discrete bands based on distance from
an origin point (for example, the user's current location), then sorted alphabetically within each
band. The goal being to prioritise agents in close proximity, but not excessively so -- all agents
within the same band should be given equal distance-related priority.

If there's a search term, we then boost the distance score based on the name's similiarity to the
search query.
"""
qs = LettingAgentLocation.objects.select_related("agent").filter(postcode__isnull=False)

AndrewIngram

import { mergeWith } from "lodash";

export function nullPrototypeFix(object: Object): Object {
  return mergeWith({}, object, (a: any, b: any) => {
    if (b === null || typeof b === "undefined") {
      return b;
    } else if (typeof b.toJSON == "function") {
      return b.toJSON();
    }
  });

AndrewIngram

function getIsLiked(viewerId, entityId) {
  // hit a database or something
}

function toggleLikeStatus(viewerId, entityId) {
  // hit a database or something
  return !currentStatus;
}

AndrewIngram

def my_fun(user_or_id: UserOrId):
   user = get_user(user_or_id)
   
   # Do something with user
  
   
# These both do the same thing (but the first avoids the extra db hit)
my_fun(user)
my_fun(user.id)

AndrewIngram

import { json } from "next-runtime";

import jwt from "jsonwebtoken";

const SESSION_KEY = "some-secret";

export function readSession(cookies) {
  const sessionCookie = cookies.get("session");
  let data = {};

AndrewIngram

/*
 * Given an input and a mask, will return just part we care about
 * 
 * e.g.
 * input: 0b11101111
 * mask: 0b00110000
 * returns: 0b10
 */
function maskedValue(input: number, mask: number): number {
  return (input & mask) >> Math.log2(mask & -mask);

AndrewIngram

import { v5 as uuidv5, NIL } from 'uuid';

function stableUuid(namespace, name) {
    return uuidv5(name, uuidv5(namespace, NIL))
}

// > stableUuid('Some namespace', 'some name')
// '019761ac-2321-5ae0-9086-70c9557bcc58'
// > stableUuid('Some namespace', 'some name')
// '019761ac-2321-5ae0-9086-70c9557bcc58'

AndrewIngram

import formidable from "formidable";

export default function formData(request) {
  const form = formidable({ multiples: true });

  return new Promise((resolve, reject) => {
    form.parse(request, (err, fields, files) => {
      if (err) {
        reject(err);
        return;

AndrewIngram

.container {
  background-color: hsl(346deg, 83%, 51%);
  background-image: linear-gradient(
      45deg,
      hsla(240deg, 100%, 20%, 1) 0%,
      hsla(240deg, 100%, 20%, 0) 50%
    ),
    linear-gradient(
      45deg,
      hsla(55deg, 100%, 50%, 0) 50%,