coryhouse

/** Return this when the user signs in */
type GetUserPermissionsResponse = {
  featurePermissions: FeaturePermission[];
  projectPermissions: ProjectPermission[];
};

type FeaturePermission = {
  subModuleId: number;
  permissions: Permission[];
};

coryhouse

import { useEffect, useState } from "react";

type Cameras = {
  back: boolean;
  front: boolean;
};

/** Returns a device's cameras and their location */
export default function useHasCamera() {
  const [cameras, setCameras] = useState<Cameras | null>(null);

coryhouse

{
  "recommendations": [
    "dbaeumer.vscode-eslint",
    "esbenp.prettier-vscode",
    "streetsidesoftware.code-spell-checker",
    "GitHub.vscode-pull-request-github",
    "ms-playwright.playwright",
    "pflannery.vscode-versionlens",
    "ZixuanChen.vitest-explorer"
  ]

coryhouse

// This file assures that a Jest test file and Cypress test file exists for each component.
import path from "path";
import fs from "fs";

function getFiles(filepath: string) {
  return fs.readdirSync(filepath).filter(function (file) {
    return fs.statSync(path.join(filepath, file)).isFile();
  });
}

coryhouse

export const schema = {
  type: "object",
  properties: {
    users: {
      type: "array",
      minItems: 3,
      maxItems: 5,
      items: {
        type: "object",
        properties: {

coryhouse

import path from "path";

export default {
  mode: "development",
  devtool: "eval-source-map",
  entry: "./src/index.js",
  output: {
    path: path.resolve(__dirname, "src"),
    publicPath: "/",
    filename: "bundle.js",

coryhouse

{
  "name": "javascript-development-environment",
  "version": "1.0.0",
  "description": "JavaScript development environment Pluralsight course by Cory House",
  "scripts": {
  },
  "author": "Cory House",
  "license": "MIT",
  "dependencies": {
    "whatwg-fetch": "3.6.2"

coryhouse

import React from "react";
import { getUsers } from "./services/userService";
import { useQuery } from "react-query";

export default function ReactQueryDemo() {
  const { data, isLoading, error } = useQuery("users", getUsers);
  if (isLoading) return "Loading...";
  if (error) return "Oops!";
  return data[0].username;
}

coryhouse

import React from "react";
import useFetch from "./useFetch";

export default function HookDemo() {
  const { data, loading, error } = useFetch("users");
  if (loading) return "Loading...";
  if (error) return "Oops!";
  return data[0].username;
}

coryhouse

import { useState, useEffect, useRef } from "react";

// This custom hook centralizes and streamlines handling of HTTP calls
export default function useFetch(url, init) {
  const [data, setData] = useState(null);
  const [loading, setLoading] = useState(true);
  const [error, setError] = useState(null);
  const prevInit = useRef();
  const prevUrl = useRef();