andrelandgraf

import { useMatches } from 'remix';

// this base hook is used in other hooks to quickly search for specific data across all loaderData using useMatches
// see in action: https://codesandbox.io/s/usematches-loader-data-2h798?file=/app/db.server.ts
export default function useLoaderStore<T>(key: string): T | undefined {
  const matchingRoutes = useMatches();
  const route = matchingRoutes.find((route) => route.data && route.data[key]);
  if (!route || !route.data || route.data[key] === undefined) {
    return undefined;
  }

avdi

Just Fucking Use CircleCI.

stevepolitodesign

import { Controller } from "@hotwired/stimulus"

// Connects to data-controller="form"
export default class extends Controller {
  static targets = [ "error" ]
  static values = { target: String,  action: String }

  connect() {
    this.target = this.hasTargetValue && document.querySelector(this.targetValue);

degitgitagitya

# KEYCLOAK BASE URL
KEYCLOAK_BASE_URL=

# KEYCLOAK CLIENT SECRET
KEYCLOAK_CLIENT_SECRET=

# KEYCLOAK CLIENT ID
KEYCLOAK_CLIENT_ID=

# BASE URL FOR NEXT AUTH

dhh

/*
  ERB template chunk from The Feed's display of emails:

  <section class="postings postings--feed-style" id="postings"
      data-controller="pagination" data-pagination-root-margin-value="40px">
    <%= render partial: "postings/snippet", collection: @page.records, as: :posting, cached: true %>

    <%= link_to(spinner_tag, url_for(page: @page.next_param),
          class: "pagination-link", data: { pagination_target: "nextPageLink", preload: @page.first? }) unless @page.last? %>
  </section>

ryanflorence

/**
 * The Anatomy of a Remix Route
 */
import { parseFormBody, json, redirect } from "@remix-run/data";
import {
  Form,
  useRouteData,
  usePendingFormSubmit,
  preload,
} from "@remix-run/react";

jfcherng

This gist will no longer be updated as the changelog will be on the official website.

• Sublime Text/Merge Official Discord chat server: https://discord.gg/D43Pecu
• Sublime Text/Merge 中文 Telegram 交流群組： https://t.me/sublime_tw

Converted via https://domchristie.github.io/turndown

About Sublime Text 4

lazaronixon

import { Controller } from "stimulus"
import { DirectUpload } from "@rails/activestorage"
import Dropzone from "dropzone"
import { getMetaValue, findElement, removeElement, insertAfter } from "helpers"

Dropzone.autoDiscover = false

export default class extends Controller {
  static targets = [ "input" ]

ryanflorence

// Adds a lovely fade in of the modal
// and a gentle slide-down of the modal content
class Demo extends React.Component {
  state = { showDialog: false };
  render() {
    return (
      <div>
        <button onClick={() => this.setState({ showDialog: true })}>
          Show Dialog
        </button>

mrmartineau

Stimulus cheatsheet

• Website: https://stimulusjs.org/
• GitHub repo: https://github.com/stimulusjs/stimulus
• Handbook: https://stimulusjs.org/handbook/introduction
• Discourse: https://discourse.stimulusjs.org/

Lifecycle callbacks

• initialize: once, when the controller is first instantiated
• connect: anytime the controller is connected to the DOM