Skip to content

Instantly share code, notes, and snippets.

View pugson's full-sized avatar

wojtek pugson

View GitHub Profile
@pugson
pugson / withExpoP3.ts
Created March 10, 2025 12:48 — forked from lauridskern/withExpoP3.ts
Expo config plugin to enable P3 colors
const { withAppDelegate } = require("expo/config-plugins");
const {
mergeContents,
} = require("@expo/config-plugins/build/utils/generateCode");
const withExpoP3 = (config) => {
return withAppDelegate(config, (config) => {
if (
config.modResults.language === "objc" ||
config.modResults.language === "objcpp"
@pugson
pugson / _readme.md
Created November 11, 2024 21:54
Interactive component showing sleep data from Oura Ring API

Preview

preview

See the demo on Twitter

Rough prototype of visualizing my sleep data with Visx and Framer Motion.

This is a code snippet from a Next.js 14 app. Uses the Oura v2 API to get data from your account.

@pugson
pugson / fix-svg-jsx.mjs
Created June 4, 2024 09:38
fix svg in jsx with a script
import fs from "fs/promises";
import path from "path";
import { fileURLToPath } from "url";
const __filename = fileURLToPath(import.meta.url);
const __dirname = path.dirname(__filename);
const APPS_DIRECTORY = path.resolve(__dirname, "../../apps");
// Common SVG attributes that need renaming to camelCase for JSX
const attributeReplacements = {
blueprint:
name: Philips Hue Tap Dial Light Brightness Control
description: Use the Philips Hue Tap Dial to control the brightness of a light.
domain: automation
input:
tap_dial:
name: Tap Dial
description: The tap dial to use. Select the battery sensor that is exposed.
selector:
entity:
@pugson
pugson / image-with-avg-color.tsx
Created June 2, 2024 09:32
client component that uses FastAverageColor
"use client";
import { FastAverageColor } from "fast-average-color";
import { useEffect, useState } from "react";
const fac = new FastAverageColor();
export function ImageWithAvgColor({ src }: { src: string }) {
const [avgColor, setAvgColor] = useState<string>("transparent");
useEffect(() => {
@pugson
pugson / constants.ts
Created April 13, 2024 23:09 — forked from matthewmorek/constants.ts
Handling BASE_URLs in Vercel env
const { CI, PORT = 3000, VERCEL_ENV, NEXT_PUBLIC_VERCEL_ENV, VERCEL_URL, NEXT_PUBLIC_VERCEL_URL } = process.env;
export const ENVIRONMENT = VERCEL_ENV || NEXT_PUBLIC_VERCEL_ENV;
const baseDomainSource = CI ? VERCEL_URL : NEXT_PUBLIC_VERCEL_URL;
const baseDomain = baseDomainSource;
let BASE_URL: string;
if (ENVIRONMENT === 'preview') {
@pugson
pugson / props.md
Created January 29, 2024 00:27
SVG → JSX
SVG Attribute JSX Property
class className
fill-opacity fillOpacity
stroke-opacity strokeOpacity
stroke-width strokeWidth
stroke-linecap strokeLinecap
stroke-linejoin strokeLinejoin
stroke-dasharray strokeDasharray
stroke-dashoffset strokeDashoffset
import * as React from 'react';
const useIsFirstRender = (): boolean => {
const isFirst = React.useRef(true);
if (isFirst.current) {
isFirst.current = false;
return true;
} else {
@pugson
pugson / youtube.css
Last active August 30, 2023 02:46
Fullscreen YouTube Player for Arc Browser https://arc.net/boost/BD693D78-8BFF-4927-8AF7-CE93CEF5B35A
ytd-watch-flexy[full-bleed-player] #player-full-bleed-container.ytd-watch-flexy {
max-height: calc(100vh - 56px) !important;
}
ytd-watch-flexy[fullscreen] #player-full-bleed-container.ytd-watch-flexy {
max-height: none !important;
}
@pugson
pugson / github-search-cheatsheet.md
Created December 21, 2022 21:12 — forked from bonniss/github-search-cheatsheet.md
Github search cheatsheet from official docs.

Github Search Cheat Sheet

GitHub’s search supports a variety of different operations. Here’s a quick cheat sheet for some of the common searches.

For more information, visit our search help section.

Basic search