Skip to content

Instantly share code, notes, and snippets.

View bautistaaa's full-sized avatar
🎯
Focusing

bautistaaa

🎯
Focusing
View GitHub Profile
@bautistaaa
bautistaaa / typescript-helloworld.ts
Created May 30, 2023 21:12 — forked from fariszacina/typescript-helloworld.ts
TypeScript - Hello World Typescript
class Greeter {
constructor(public greeting: string) { }
greet() {
return "<h1>" + this.greeting + "</h1>";
}
};
var greeter = new Greeter("Hello, Ministry of Programming!");
var str = greeter.greet();
@bautistaaa
bautistaaa / i18n.ts
Last active August 12, 2022 21:52
typesafe i18n
const translations = {
translationOne: 'hello world',
translationTwo: 'hello {{world}}',
translationThree: "hello {{world}}, I'm {{name}}!",
translationFour: '{{foo}} has a {{bar}}',
} as const;
type Translations = typeof translations;
type InterpolateInner<
S extends string,
@bautistaaa
bautistaaa / machine.js
Created November 16, 2021 20:32
Generated by XState Viz: https://xstate.js.org/viz
// Available variables:
// - Machine
// - interpret
// - assign
// - send
// - sendParent
// - spawn
// - raise
// - actions
@bautistaaa
bautistaaa / machine.js
Last active July 19, 2021 11:44
Generated by XState Viz: https://xstate.js.org/viz
const playerMachine = Machine({
id: 'player',
initial: 'boot',
context: {
playbackState: undefined
},
states: {
boot: {
on: {
RESOLVE: { target: 'initialized'},
import React, { useState, useEffect, useRef } from "react";
const TimerFunction = ({ minutes, seconds }) => {
const [min, setMin] = useState(minutes);
const [sec, setSec] = useState(seconds);
const [active, setActive] = useState(false);
const intervalRef = useRef();
useEffect(() => {
setMin(minutes);
import React, { useState } from "react";
// import StartStopTimer from "./StartStopTimer";
import Timer from "./TimerFunction";
const Clock = () => {
const [minutes, setMinutes] = useState(0);
const [seconds, setSeconds] = useState(0);
const [submittedMinutes, setSubmittedMinutes] = useState(0);
const [submittedSeconds, setSubmittedSeconds] = useState(0);
{selectedMenus[depth] === label && (
<SidebarItem.List depth={depth}>
{children.map((child, i) => {
const { label } = child;
const childDepth = depth + 1;
return (
<SidebarItem
link={child}
handleMenuSelection={handleMenuSelection}
key={`child-${label}-${i}`}
const SidebarItem = ({
link,
handleMenuSelection,
selectedMenus,
depth = 0,
}) => {
const { label, path, children = [] } = link;
return (
<>
{children.length > 0 ? (
<Sidebar.Wrapper>
<Sidebar.List onMouseLeave={() => setSelectedMenus([])}>
{links.map((link) => {
return (
<SidebarItem
link={link}
handleMenuSelection={handleMenuSelection}
key={link.label}
selectedMenus={selectedMenus}
/>
const Sidebar = (props) => {
const { links } = props;
const [selectedMenus, setSelectedMenus] = useState([]);
const handleMenuSelection = (label, depth) => {
setSelectedMenus((selectedMenus) => {
const newSelectedMenus = [...selectedMenus];
// trim any menus after the depth
newSelectedMenus.length = depth;
if (label !== '') {
newSelectedMenus[depth] = label;