OlivierJM

  Mutation: {
    async register(root, { email, password }) {
      // { email, password } this is coming from the args(arguments) that are passed down when registering 
      let user = new User()
      user.email = email
      // here we hash the password using bcrypt and store the hashed value in the db
      user.password = await bcrypt.hash(password, 12)
      // save the user to the db
      // it shouldn't matter what db you are using
      return user.save()

OlivierJM

Theory

1. Briefly explain the difference between props and states

2. What are synthetic events in React?

3. What are refs and give example of a use case?

OlivierJM

<ErrorBoundary>
  <ComponentThatCanCauseAnError />
  { /* If you want you can even nest this */ }
  <ErrorBoundary>
    <AnotherComponent />
  </ErrorBoundary>
</ErrorBoundary>
  

OlivierJM

import React, { Component } from 'react';
import { PropTypes } from 'prop-types';
import { Meteor } from 'meteor/meteor';
import { formatText } from '../utils/utils';

export default class ErrorBoundary extends Component {
  constructor(props) {
    super(props);
    this.state = { hasError: false };
  }

OlivierJM

  "titles": {
    "addreference": "Ajouter Références",
    "referenceDisplaced": "Références affichées",
    "feedback": "Commentaire",
    "source": "Source",
    "usersfeedback": "Commentaires de l'utilisateur",
    "notifications": "Notifications",
    "bookmarks": "Signets"
  }

OlivierJM

// this is truncated and don't mind this comment in JSON 😉
{
  "_locale": "en-us",
  "_namespace": "common",
  "language": {
    "enUS": "English - U.S.",
    "esES": "Spanish - SP",
    "frFr": "French - FR",
    "Language": "Language"
  },

OlivierJM

// This file has been truncated for brevity

import React, { Fragment, Component } from 'react';
import { Meteor } from 'meteor/meteor';
import PropTypes from 'prop-types';
import i18n from 'meteor/universe:i18n';
import { ThemeContext } from '../../containers/AppWrapper';

const T = i18n.createComponent();

OlivierJM

/* eslint class-methods-use-this: "off" */
/* eslint import/no-unresolved: "off" */
import React, { Fragment } from 'react';
import { PropTypes } from 'prop-types';
import Header from '../components/layouts/Header';

export const ThemeContext = React.createContext();

export default class AppWrapper extends React.Component {
  state = {

OlivierJM

  it("should add the country when number starts with 9", () => {
    expect(formatNumber("943434")("260")).toEqual("260 943434");
  });

  it("should format even if the code existed", () => {
    expect(formatNumber("+260943434")("260")).toEqual("260 943434");
  }); 

  it("should format even if number is spaced out", () => {
    expect(formatNumber("+260 943434")("260")).toEqual("260 943434");

OlivierJM

import * as R from 'ramda'

const formatNumber = R.compose(
  appendCountryCode,
  removePrefix,
  removeSymbol
);

// the above function can be called like this 
formatNumber(numberToformat)(countryCode)