Skip to content

Instantly share code, notes, and snippets.

View sturmenta's full-sized avatar
🌌

Nicolas Sturm sturmenta

🌌
  • Argentina
View GitHub Profile
@sturmenta
sturmenta / useOnlyCallOnce.ts
Created September 30, 2024 17:52
useOnlyCallOnce
import { useEffect, useRef } from 'react';
export const useOnlyCallOnce = (cb, condition = true) => {
const isCalledRef = useRef(false);
useEffect(() => {
if (condition && !isCalledRef.current) {
isCalledRef.current = true;
cb();
}
@sturmenta
sturmenta / readme.md
Created March 28, 2024 10:41
raspberry pico w hello world (without probe) blink example

using embassy

  1. git clone https://github.com/embassy-rs/embassy.git & cd embassy/examples/rp
  2. edit the .cargo/config.toml file and replace runner line with this: runner = "elf2uf2-rs -d"
  3. cargo run --bin wifi_blinky --release
@sturmenta
sturmenta / useWindowSize.ts
Created March 10, 2024 22:58
window addEventListener resize
import { useEffect, useState } from "react"
export const useWindowSize = () => {
const [size, setSize] = useState({ vh: 0, vw: 0 })
const onResize = (props: any) =>
setSize({
vh: props.target.innerHeight,
vw: props.target.innerWidth
})
@sturmenta
sturmenta / global.css
Created March 10, 2024 05:39
show / hide scroll - css
/* Hide scrollbar with class .hide-scroll */
/* for Chrome, Safari and Opera */
.hide-scroll::-webkit-scrollbar {
display: none;
/* Hide scrollbar for IE, Edge and Firefox */
-ms-overflow-style: none; /* IE and Edge */
scrollbar-width: none; /* Firefox */
}
/* Always show scrollbar with class .always-show-scroll */
@sturmenta
sturmenta / RemainingTime.tsx
Created February 10, 2024 23:07
show remaining time in react (59:59 - 00:00) with dayjs
import dayjs from "dayjs"
import { useEffect, useState } from "react"
import { Text } from "react-native"
// NOTE:
// show max 59:59 time remaining
// show 00:00 when time is expired
export const RemainingTime = ({ expired_time }: { expired_time: string }) => {
const [time, setTime] = useState("00:00")
@sturmenta
sturmenta / supabase-edge-functions--starter.md
Last active December 31, 2023 17:14
supabase edge functions - starter

supabase edge functions - starter

  • this need a workspace to work because supabase-edge-functions run on deno and the linter and config is different for typescript and deno
  1. move existing files to a folder (website, frontend, etc)
  2. create a new workspace file to vscode config called name-of-your-project.code-workspace and inside put this:
{
 "folders": [
@sturmenta
sturmenta / dashboard-example.tsx
Last active October 14, 2024 20:30
Sidebar for mobile and desktop using shadcn-ui
"use client"
import { WithSidebar } from "@/components/with-sidebar"
export const Dashboard = () => {
return (
<WithSidebar
sidebarContent={SidebarContent}
mobileDashboardHeader={CustomHeader}>
<div className="p-10">
@sturmenta
sturmenta / getPercentageInHex.ts
Created July 24, 2023 05:05
convert decimal percentage on hexadecimal percentage to be used with hex colors
export const getPercentageInHex = (percentage: number): string => {
if (percentage >= 0 && percentage <= 100) {
const preHexNumber = (percentage * 255) / 100;
const hexNumber = preHexNumber.toString(16).split('.')[0].padStart(2, '0').replace('f0', 'ff');
return hexNumber;
}
return 'ff';
};
@sturmenta
sturmenta / useGetDivDimensions.ts
Last active March 3, 2024 05:13
get dimensions of div with ResizeObserver and hooks
import { useEffect, useRef, useState } from "react";
export const useGetDivDimensions = () => {
const [dimensions, setDimensions] = useState({ height: 0, width: 0 });
const div_ref = useRef<HTMLDivElement | null>(null);
useEffect(() => {
const resizeObserver = new ResizeObserver((event) => {
setDimensions({
@sturmenta
sturmenta / WeekdaysSelector.tsx
Created June 12, 2023 03:53
react native WeekdaysSelector
import { TouchableOpacity, View } from 'react-native';
import { withLightHapticFeedback } from '_utils';
import { C_Text } from './C_Text';
const weekdays = ['L', 'M', 'X', 'J', 'V', 'S', 'D'];
export const WeekdaysSelector = ({
selectedDays,