OlivierJM

  function onInputChange(file) {
    // convert image file to base64 string
    const reader = new FileReader();

    reader.addEventListener(
      'load',
      () => {
        setInputImg(reader.result);
      },
      false

OlivierJM

const createImage = url => {
  return new Promise((resolve, reject) => {
    const image = new Image();
    image.addEventListener('load', () => resolve(image));
    image.addEventListener('error', error => reject(error));
    image.setAttribute('crossOrigin', 'anonymous');
    image.src = url;
  });
};

OlivierJM

import React, { useState } from 'react'
import Cropper from 'react-easy-crop'
import { getCroppedImg } from '../../../utils/helpers'

export default function ImageCropper({ getBlob, inputImg, fileName }){
  const [crop, setCrop] = useState({ x: 0, y: 0 })
  const [zoom, setZoom] = useState(1)
  const onCropComplete = async (_, croppedAreaPixels) => {
  const croppedImage = await getCroppedImg(
    inputImg,

OlivierJM

Africa/Abidjan
Africa/Accra
Africa/Addis_Ababa
Africa/Algiers
Africa/Asmara
Africa/Asmera
Africa/Bamako
Africa/Bangui
Africa/Banjul
Africa/Bissau

OlivierJM

function countingValleys(steps, path) {
  for (let index = 0; index < steps; index++) {
    const currentStep = path[index];
    const nextStep = path[index + 1];
    let downHill = 0;
    let upHill = 0;
    if (currentStep + nextStep !== "UD") {
      if (currentStep === nextStep) {
        // we are either going downhill or uphill
        // now check if currentStep is D which means downhil, if U then upHill

OlivierJM

import * as actions from "../actions/";
import * as types from "../utils/types";
import { moviesMock } from "../utils/moviemock";

describe("actions", () => {
  it("should create an action to fetch popular movies", () => {
    const fetchMovieAction = {
      type: types.FETCH_POPULAR_MOVIES,
      movies: moviesMock
    };

OlivierJM

import { createContext, useContext, useState } from "react";

// Consumer
// useContext
const AppContext = createContext();
const ThemeContext = createContext();

export default function App() {
  const [language, setLanguage] = useState("en-US");
  const [color, setColor] = useState("blue");

OlivierJM

import { useState } from 'react'
import { Button } from '@chakra-ui/react'

const initialState = {
  age: 0,
  name: '',
  address: '',
  phoneNumber: '',
  location: '',
}

OlivierJM

import PropTypes from 'prop-types'

export default function Card({ title, mainText, color, colors, details }) {
  return (
    <div>
      <h2 style={{ color }}>{title}</h2>
      <p>{mainText}</p>
      {colors.map((colorItem) => (
        <span key={colorItem}>{colorItem}</span>
      ))}

OlivierJM

Dropping Migration Table, Models, Controller

Command Line

1. Drop Table/Migration

rails generate migration DropTablename

A file will be created, in the db > migrate folder, make sure it looks like: