Skip to content

Instantly share code, notes, and snippets.

View alex-streza's full-sized avatar
🦊
Likely coding

Alex Streza alex-streza

🦊
Likely coding
View GitHub Profile
You are an expert in TypeScript, Node.js, Next.js App Router, React, Shadcn UI, Radix UI, Tailwind, tRPC, better-auth, Drizzle ORM with PostgreSQL, and Biome.
<architecture>
1. Always leverage the Next.js App Router pattern, separating server and client components
2. Implement route groups (folders in parentheses) for logical organization
3. Use route handlers for API functionality with proper HTTP methods
4. Structure projects with clean separation between UI, data fetching, and business logic
5. Implement parallel routes and intercepting routes for advanced UI patterns when appropriate
</architecture>
@alex-streza
alex-streza / route.ts
Last active February 14, 2024 14:49
Next.js App Router - trpc-openapi
// /app/api/[...trpc]/route.ts
/**
"trpc-openapi": "^1.2.0",
"@trpc/client": "next",
"@trpc/next": "next",
"@trpc/react-query": "next",
"@trpc/server": "next",
**/
import { createOpenApiNextHandler } from "trpc-openapi";
@alex-streza
alex-streza / toggl-to-csv.js
Created December 23, 2023 15:38
Node.js script to fetch Toggl time entries via the official API, organizing data into a monthly CSV timesheet.
const fetch = require('node-fetch');
const jsonexport = require('jsonexport');
const fs = require('fs').promises;
const path = require('path');
const API_URL = process.env.API_URL;
const EMAIL = process.env.EMAIL;
const PASSWORD = process.env.PASSWORD;
const OUTPUT_PATH = process.env.OUTPUT_PATH;
const NAME = process.env.NAME;
@alex-streza
alex-streza / gsap.ts
Created April 2, 2023 09:20
GSAP Context Hook for React
const useGsapContext = (
func: gsap.ContextFunc,
deps: any[] = [],
target?: any,
) => {
useEffect(() => {
const ctx = gsap.context(func, target)
return () => ctx?.revert()
}, deps)
@alex-streza
alex-streza / export-toggl-timesheet-csv.js
Last active December 23, 2023 15:39
Script.kit compatible JS script to fetch Toggl time entries via the official API, organizing data into a monthly CSV timesheet.
// Name: Export Toggl Entries to CSV
import "@johnlindquist/kit";
const jsonexport = await npm("jsonexport");
const API_URL = await env("API_URL");
const EMAIL = await env("EMAIL");
const PASSWORD = await env("PASSWORD");
const OUTPUT_PATH = await env("OUTPUT_PATH");
const NAME = await env("NAME");
@alex-streza
alex-streza / FigmaProvider.ts
Last active December 28, 2024 10:47
Figma OAuth Provider implementation for Auth.js (previously next-auth)
import { Provider } from "next-auth/providers";
export const FigmaProvider: Provider = {
id: "figma",
name: "Figma",
type: "oauth",
authorization: {
url: "https://www.figma.com/oauth",
params: {
scope: "file_read",
@alex-streza
alex-streza / sync-cron.yml
Created December 8, 2022 08:54
GitHub Action to register a cron job that triggers a sync event on Vercel hosted endpoint
name: 5-minute-cron
on:
schedule:
- cron: "*/5 * * * *"
jobs:
cron:
runs-on: ubuntu-latest
steps:
- name: Call the sync API endpoint on Vercel
run: |
@alex-streza
alex-streza / theme.js
Created July 31, 2022 11:48
Script to add root class in accordance to dark mode preferences or local storage saved value.
const theme = (() => {
let theme = 'light'
if (typeof localStorage !== 'undefined' && localStorage.getItem('theme')) {
theme = localStorage.getItem('theme')
} else if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
theme = 'dark'
}
window.localStorage.setItem('theme', theme)
return theme
@alex-streza
alex-streza / Meta.tsx
Created February 3, 2022 10:42
Simple Meta component to boost NextJS SEO
import { NextSeo } from "next-seo";
import Head from "next/head";
import { useRouter } from "next/router";
type IMetaProps = {
title: string;
description: string;
image?: string;
canonical?: string;
};