arunmmanoharan

import type { FetcherWithComponents } from "@remix-run/react";
import { useFetcher } from "@remix-run/react";
import { useEffect, useState } from "react";
import type { AppData } from "@remix-run/react/dist/data";
import type { SerializeFrom } from "@remix-run/server-runtime";

/**
 * A higher-order function that creates a new FetcherWithComponentsReset instance, which extends the FetcherWithComponents interface.
 * The new instance includes an additional method `reset` that can be used to reset the state of the fetcher.
 *

nazariyv

Two pointers: one input, opposite ends

```python3
def fn(arr):
    left = ans = 0
    right = len(arr) - 1

    while left < right:
        # do some logic here with left and right
        if CONDITION:

JLarky

import React from 'react';

function useCallbackOnce(callback: () => void) {
  const once = React.useRef(false);
  return React.useCallback(() => {
    if (!once.current) {
      once.current = true;
      callback();
    }
  }, [callback]);

koba04

https://webkit.org/blog/10218/full-third-party-cookie-blocking-and-more/

1. Does Safari block 3rd party cookies with SameSite=None?

I've created to test it, but I'm confused by the result. https://animated-caribou.glitch.me/

The result

• Chrome: only display the cookie value with SameSite=None in iframe.

securibee

cat urls.html | grep -Eo "(http|https)://[a-zA-Z0-9./?=_-]*" | sort -u

grep -E : is the same as egrep
grep -o : only outputs what has been grepped
(http|https) : is an either / or
a-z : is all lower case
A-Z : is all uper case
. : is dot
/ : is the slash
? : is ?

etagwerker

#!/usr/bin/env python3
import sys
import os


def curl_to_ab(curl_cmd: list, num: int=200, cur: int=4) -> str:
    """
    Translate a cURL command created by Chrome's developer tools into a
    command for ``ab``, the ApacheBench HTTP benchmarking tool.

vktr

function (user, context, callback) {
  user.app_metadata = user.app_metadata || {};

  if ('stripe_customer_id' in user.app_metadata) {
    context.idToken['https://example.com/stripe_customer_id'] = user.app_metadata.stripe_customer_id;
    return callback(null, user, context);
  }

  var stripe = require('stripe')('sk_....');
  var customer = {

xialvjun

// https://github.com/lodash/lodash/issues/1696
import {clone, setWith, curry} from 'lodash/fp';

// export const setIn = curry((path, value, obj) =>
//   setWith(clone, path, value, clone(obj)),
// );
export const setIn = curry((obj, path, value) =>
  setWith(clone, path, value, clone(obj)),
);

acdlite

Demo: Coordinating async React with non-React views

tl;dr I built a demo illustrating what it might look like to add async rendering to Facebook's commenting interface, while ensuring it appears on the screen simultaneous to the server-rendered story.

A key benefit of async rendering is that large updates don't block the main thread; instead, the work is spread out and performed during idle periods using cooperative scheduling.

But once you make something async, you introduce the possibility that things may appear on the screen at separate times. Especially when you're dealing with multiple UI frameworks, as is often the case at Facebook.

How do we solve this with React?

ChrisPenner

const all = (...preds) => (obj) => preds.map(f => f(obj)).reduce((a, b) => a && b, true)
const any = (...preds) => (obj) => preds.map(f => f(obj)).reduce((a, b) => a || b, false)
const oneOf = (...preds) => (obj) => preds.map(f => f(obj)).reduce((a, b) => a ? !b : b, false)
const has = (prop) => (obj) => obj[prop] !== undefined
const not = (pred) => (obj) => !pred(obj)
const equals = (prop, val) => (obj) => obj[prop] === val
const implies = (f, g) => (obj) => !f(obj) || g(obj);

const validate = all(implies(has('selectedIndex'), equals('isOpen', true)))