stevecastaneda

These are some of Ryan Bates's favorite gems to use for various tasks:

• JavaScript: jQuery with jquery-rails
• Pagination: Kaminari
• Testing: RSpec and Cucumber
• Factories: Factory Girl
• Authentication: Nifty Generators and Omniauth
• Authorization: CanCan
• File Attachments: Carrierwave
• HTML/XML Parsing: Nokogiri

stevecastaneda

// Remove the task from the UI
$("#task_<%= @task.id %>").slideUp("slow", function() {
	// Reload the tasks
	$("#tasks").html("<%= escape_javascript(render(:partial => 'tasks/tasks'))%>");

	// Highlight the task that was rescheduled
	$("#task_<%= @task.id %>").effect("highlight", {}, 1250);
});

stevecastaneda

// Detach the task from it's current location and save to var task
var task = null;
task = $("#task_<%= @task.id %>").detach();

// Was this the last task for one of the sections?
// If so, remove the header and spacer (remove), add no-tasks span if today
if($("#tasks_today > div.task").length == 0) {
	if($("#tasks_today").children("div").children("span").length == 0) {
		$("#tasks_today > hr").before('<div class="span-7 last"><span>Nothing to do. <%= link_to "Bored?", "#", :id => "bored_link" %></span></div>');
	}

stevecastaneda

Railties 3.1 Beta 1

• The -j option of the application generator accepts an arbitrary string. If passed "foo", the gem "foo-rails" is added to the Gemfile, and the application JavaScript manifest requires "foo" and "foo_ujs". As of this writing "prototype-rails" and "jquery-rails" exist and provide those files via the asset pipeline. Default is "jquery". [fxn]

• jQuery is no longer vendored, it is provided from now on by the jquery-rails gem. [fxn]

• Prototype and Scriptaculous are no longer vendored, they are provided from now on by the prototype-rails gem. [fxn]

• The scaffold controller will now produce SCSS file if Sass is available [Prem Sichanugrist]

stevecastaneda

// http://reactcommunity.org/react-transition-group/transition
// http://reactcommunity.org/react-transition-group/transition-group

import React, { ReactNode } from "react";
import { Transition as ReactTransition } from "react-transition-group";

interface TransitionProps {
  in?: boolean;
  timeout: number | { appear?: number; enter?: number; exit?: number };
  enter?: string;

stevecastaneda

import React, { useEffect } from "react";

// Run the callable function on mount only once by adding an empty array.

export function Callable() {
  useEffect(() => {
    async function helloWorld() {
      try {
        const helloWorldCallableFunction = functions.httpsCallable("helloWorld", { timeout: 10000 });
        const response = await helloWorldCallableFunction();

stevecastaneda

// Modal Source: https://tailwindui.com/components/application-ui/overlays/modals

import React, { ReactNode } from "react";
import { Transition } from "components/transition";

interface Props {
  /** The modal open/close state */
  open: boolean; 
}

stevecastaneda

import React, { useState, useContext, useRef } from "react";
import { useOverlayTriggerState } from "@react-stately/overlays";
import { useButton } from "@react-aria/button";
import { Modal } from "components/overlays/Modal";

export function Example() {
  let state = useOverlayTriggerState({});

  function onOpen() {
    state.open();

stevecastaneda

import React, { ReactNode } from "react";
import { CSSTransition as ReactTransition } from "react-transition-group";

interface TransitionProps {
  in?: boolean;
  timeout: number;
  enter?: string;
  enterFrom?: string;
  enterTo?: string;
  leave?: string;

stevecastaneda

// From Github issue
// https://github.com/ueberdosis/tiptap/issues/3700

// Requires that the node have an ID
// See: https://tiptap.dev/api/extensions/unique-id

import { Node } from "@tiptap/pm/model";
import { Editor as CoreEditor } from "@tiptap/core";