Skip to content

Instantly share code, notes, and snippets.

View josippapez's full-sized avatar

Josip Papež josippapez

View GitHub Profile
@josippapez
josippapez / BlurredIceBackground.tsx
Created January 31, 2025 14:52
Blurred ice background 3d
const BLurredIceBackground = () => {
return (
<mesh scale={[10, 10, 1]} position={[0, 0, 1]}>
<planeGeometry args={[2, 2]} />
<MeshTransmissionMaterial
samples={1}
resolution={16}
anisotropicBlur={0.1}
thickness={0.1}
roughness={0.4}
@josippapez
josippapez / MovingBlobsBackground.tsx
Created January 31, 2025 09:18
Moving Blobs shader
const MovingBlobsBackground = () => {
const shaderRef = useRef<ShaderMaterial>(null!)
useFrame((state) => {
if (shaderRef.current) {
shaderRef.current.uniforms.uTime.value = state.clock.elapsedTime
}
})
return (
@josippapez
josippapez / PhoneInput.tsx
Last active November 3, 2024 14:18
PhoneInput
​'use client';
import clsx from 'clsx';
import {
ChangeEvent,
InputHTMLAttributes,
forwardRef,
useEffect,
useState,
} from 'react';
"use client";
import {
Collapsible,
CollapsibleContent,
CollapsibleTrigger,
} from "@/components/ui/collapsible";
import { cn } from "@/lib/utils";
import { Maximize, Minimize } from "lucide-react";
import React, { useState } from "react";
@josippapez
josippapez / utils.ts
Last active April 1, 2024 09:42
utils
export type Modify<T, R> = Omit<T, keyof R> & R;
@josippapez
josippapez / Makefile
Last active September 17, 2024 19:28
Tanstack
openapi:
curl http://localhost:3000/api-docs-json > ./libs/api/src/openapi.json
rm -rf ./libs/api/src/openapi-config
rm -rf ./libs/api/src/openapi-schemas
npx orval --config ./libs/api/orval.config.ts
npx prettier --write ./libs/api/src
rm ./libs/api/src/openapi.json
@josippapez
josippapez / Paginate.tsx
Created March 2, 2024 11:36
Pagination
"use client";
import { cltm } from "@57hours-frontend/utils";
import { FC, useEffect, useState } from "react";
interface PaginateProps {
pageCount: number;
onPageChange: (selectedItem: { selected: number }) => void;
previousLabel: string | JSX.Element;
nextLabel: string | JSX.Element;
@josippapez
josippapez / cltm.ts
Created March 2, 2024 11:36
Tailwind merge
import { clsx } from "clsx";
import { ClassNameValue, extendTailwindMerge } from "tailwind-merge";
const extendedTwMerge = extendTailwindMerge({});
// used for merging tailwind classes with clsx
export function cltm(...args: ClassNameValue[]) {
return extendedTwMerge(clsx(args));
}
@josippapez
josippapez / FirebaseService.ts
Last active October 18, 2023 10:18
FirebaseService
import firebaseConfig from '@/store/Config/fbConfig';
import { FirebaseApp, initializeApp } from 'firebase/app';
import { Auth, connectAuthEmulator, getAuth } from 'firebase/auth';
import {
Firestore,
connectFirestoreEmulator,
getFirestore,
} from 'firebase/firestore';
import {
Functions,
@josippapez
josippapez / Components.tsx
Last active May 7, 2023 11:44
React-pdf to HTML components
import {
PropsDefs,
PropsDocument,
PropsG,
PropsImage,
PropsLine,
PropsLinearGradient,
PropsLink,
PropsPage,
PropsPath,