rcdexta

<details>
<summary>Languages Used</summary>
<p>This page was written in HTML and CSS. The CSS was compiled from SASS. Regardless, this could all be done in plain HTML and CSS</p>
</details>

<details>
<summary>How it Works</summary>
<p>Using the sibling and checked selectors, we can determine the styling of sibling elements based on the checked state of the checkbox input element. </p>
</details>

rcdexta

functions:
  lambda_sheets:
    handler: handler.runs
    description: Lambda function to pull data from Postgres and dump to Google Spreadsheet
    timeout: 900
    events:
    - schedule:
        rate: rate(1 hour)
        enabled: true

rcdexta

{
  "name": "Customers",
  "description": "All customer related details sync",
  "spreadsheetUrl": "https://docs.google.com/spreadsheets/d/1d4QXXx8qFRhcajpVcEbwVM8TlEXAvrclWpLGmqvw-Pc/edit#gid=0",
  "spreadsheetId": "1d4QXXx8qFRhcajpVcEbwVM8TlEXAvrclWpLGmqvw-Pc",
  "tables": [
    {
      "tableName": "customer_details",
      "sheetName": "Sheet1"
    }

rcdexta

const { Client } = require('pg')

const pg = {
  init: async function() {
    const client = new Client({
      user: process.env['DB_USER'] || 'postgres',
      host: process.env['DB_HOST'] || 'localhost',
      database: process.env['DB_NAME'] || 'customers',
      password: process.env['DB_PASSWORD'] || '',
      port: 5432

rcdexta

class ItemList extends React.Component {
  state = {
    items: this.props.items
  };
  onSortEnd = ({ oldIndex, newIndex }) => {
    this.setState({
      items: arrayMove(this.state.items, oldIndex, newIndex)
    });
  };

rcdexta

import React from 'react'

class App extends React.Component {
  state = {
    items: ["Item 1", "Item 2", "Item 3", "Item 4", "Item 5", "Item 6"]
  };

  addItem = newItem => {
    this.setState({ items: [...this.state.items, newItem] });
  };

rcdexta

import React from "react";

export default class NewItem extends React.Component {
  state = { value: "" };

  updateValue = evt => {
    this.setState({ value: evt.target.value });
  };

  addNewItem = () => {

rcdexta

import React from "react";
import {SortableContainer, SortableElement, SortableHandle, arrayMove} from "react-sortable-hoc";

const DragHandle = SortableHandle(() => (
  <span className="handle">&#x2261;</span>
));

const SortableItem = SortableElement(({ value }) => (
  <li>
    <DragHandle />

rcdexta

test('TodoForm should add new item and call onAddItem callback prop', () => {
  const addItem = jest.fn()
  const {getByTestId} = render(<TodoForm onAddItem={addItem}/>)

  let newItem = 'Get Milk'
  fireEvent.change(getByTestId('newItemField'), {target: {value: newItem}})
  getByTestId('addBtn').click()

  expect(addItem).toBeCalledWith({newItemValue: newItem})
  expect(addItem).toHaveBeenCalledTimes(1);

rcdexta

class TodoForm extends React.Component {

  static propTypes = {
    onAddItem: PropTypes.func
  }

  state = {value: ''}

  handleChange = (event) => {
    this.setState({value: event.target.value});