Skip to content

Instantly share code, notes, and snippets.

View LauraBeatris's full-sized avatar
🌟

Laura Beatris LauraBeatris

🌟
View GitHub Profile
@LauraBeatris
LauraBeatris / photo_manager.js
Created April 11, 2020 11:33
JS module for a photo manager
const PhotoUpload = {
input: null,
files: [],
uploadLimit: 6,
hasLimit(event){
const { files: FileList } = event.target
if ((FileList.length > PhotoUpload.uploadLimit) || ((FileList.length + PhotoUpload.files.length) > PhotoUpload.uploadLimit)) {
event.preventDefault()
alert(`Você só pode realizar o upload de até ${PhotoUpload.uploadLimit} fotos`)
return true
@LauraBeatris
LauraBeatris / Spinner.js
Created April 16, 2020 21:59
Roullete Spinner made with React Hooks
const spinWheel = useCallback(() => {
// Receives the winner prop and search for his position in the spinner bets array
const order = [8, 1, 14, 2, 13, 3, 12, 4, 0, 11, 5, 10, 6, 9, 7];
const position = order.indexOf(winner);
// Determine position where to land
const rows = 12;
const card = 80 + 2 * 2;
let landingPosition = rows * 15 * card + position * card;
@LauraBeatris
LauraBeatris / dateFns.ts
Created June 13, 2020 14:38
Internacionalization setup for React with i18n and date-fns
import * as dateFnsLocales from 'date-fns/locale';
import { Locale } from 'date-fns';
import i18n from './i18n';
interface Locales {
[key: string]: Locale;
}
const getDateFnsLocale = (): Locale => {
@LauraBeatris
LauraBeatris / SocketContainer.jsx
Created July 21, 2020 16:08
React Phoenix Socket Context
import React, { useEffect, useMemo } from "react";
import { Socket } from "phoenix";
// A utility to get the JWT token of the user
import getUserJWT from "utils/getUserJWT";
// The URL of the socket, example: ws://localhost:4000
import { SOCKET_URL } from "settings/socket";
// A hook that returns the current user authenticated
@LauraBeatris
LauraBeatris / styledComponentWithProps.ts
Last active October 30, 2023 11:47
Helper TS function to provide props for a Styled Component
function styledComponentWithProps<T, U extends HTMLElement = HTMLElement>
(styledFunction: StyledFunction<React.HTMLProps<U>>): StyledFunction<T & React.HTMLProps<U>> {
return styledFunction
}