durierem

function downloadBlob(dataArray, fileName) {
  const blob = new Blob(dataArray);
  const blobUrl = URL.createObjectURL(blob);
  const link = document.createElement('a');
  link.href = blobUrl;
  link.download = fileName;
  document.body.appendChild(link);
  link.click();
  URL.revokeObjectURL(blobUrl);
  document.body.removeChild(link);

durierem

Navigation tabs with native custom elements

Components

We have two components:

tab-presenter wraps the content containers. It's job at any given time is to show only one of its child and hide the others.

Multiple tab-switcher handle the tab selection and tells their tab-presenter which content to show.

durierem

import React from 'react'
import Image from 'next/image'

export default function MyComponent({ base64Image }) {
  return (
    <div>
      <Image src={`data:image/png;base64,${base64Image}`} alt="image" layout="fill" />
    </div>
  )
}

durierem

/**
 * Fetch a JSON API.
 *
 * @param {String} url                      The full URL endpoint
 * @param {Object} [options={}]             A hash of options (see below)
 * @param {Object} [options.headers]        Additional headers (Accept and Content-Type are already set)
 * @param {String} [options.method='GET']   The HTTP method (default: 'GET')
 * @param {Object} [options.body]           The body of the request
 * @returns {Promise} A promise resolved or rejected depending on the response status. Either way, the response body is passed with.
 */