A

Apiwit

15 public snippets

typescriptUpdated about 2 months ago

Shadcn Breadcrumb

by @Apiwit

"use client";

import {
  Breadcrumb,
  BreadcrumbList,
  BreadcrumbItem,
  BreadcrumbLink,
  BreadcrumbSeparator,
typescriptUpdated about 2 months ago

React Context for theme switcher

by @Apiwit

import { createContext, useContext, useEffect, useState } from "react";

type Theme = "dark" | "light" | "system";

type ThemeProviderProps = {
  children: React.ReactNode;
  defaultTheme?: Theme;
  storageKey?: string;
typescriptUpdated about 2 months ago

React Context for loading state

by @Apiwit

"use client";

import React, {
  createContext,
  useContext,
  useState,
  useMemo,
  useCallback,
typescriptUpdated about 2 months ago

React Context example for e-commerce cart system

by @Apiwit

"use client";

import { ProductInterface } from "@/interfaces/product";
import { useRouter } from "next/navigation";
import {
  createContext,
  useContext,
  useEffect,
typescriptUpdated about 2 months ago

useBoolean

by @Apiwit

import { useCallback, useState } from "react";

import type { Dispatch, SetStateAction } from "react";

type UseBooleanReturn = {
  value: boolean;
  setValue: Dispatch<SetStateAction<boolean>>;
  setTrue: () => void;
typescriptUpdated about 2 months ago

useDebounce

by @Apiwit

/* eslint-disable @typescript-eslint/no-explicit-any */
import { useRef, useCallback } from "react";

function useDebounce<T extends (...args: any[]) => any>(
  callback: T,
  delay: number
) {
  const timer = useRef<NodeJS.Timeout | null>(null);
bashUpdated about 2 months ago

Set GitLab variable via REST Api (Repo)

by @Apiwit

#!/bin/bash

# this script looks for env file with the name in $ENV_FILE below
# from the root directory of repository and set variables based on it

# Colors
GREEN='\033[0;32m'
RED='\033[0;31m'
bashUpdated about 2 months ago

Set GitLab variable via REST Api (Local)

by @Apiwit

#!/bin/bash

# This script reads local .env or .env.example and updates GitLab variables via API
# For sensitive data, you should leave it empty as is and set it manually later

# Colors
GREEN='\033[0;32m'
RED='\033[0;31m'
typescriptUpdated about 2 months ago

Export file

by @Apiwit

interface DownloadFileConfig {
  fileName?: string;
  fileType?: string;
  ignoreFileType?: boolean;
}

export const downloadFile = (
  response: Blob,
typescriptUpdated about 2 months ago

Format number with currency.js

by @Apiwit

import Currency from "currency.js";

export function formatNumber(value: number, opts?: Currency.Options) {
  return Currency(value, {
    pattern: "#",
    negativePattern: "-#",
    precision: value % 2 === 0 ? 0 : 2,
    ...opts,
typescriptUpdated about 2 months ago

Capitalize first letter string

by @Apiwit

export function capitalizeFirstLetter(text?: string) {
  if (!text) return "";
  return String(text).charAt(0).toUpperCase() + String(text).slice(1);
}
typescriptUpdated about 2 months ago

Convert string space

by @Apiwit

export function convertStringSpace(
  text?: string,
  separator = "-",
  newSeparator = " "
) {
  if (!text) return "";
  return String(text).replace(separator, newSeparator);
}
typescriptUpdated about 2 months ago

Render string detail with dash

by @Apiwit

export const renderDetail = (data?: unknown): string => {
  if (!data || typeof data !== "string") return "-";

  return data;
};
typescriptUpdated about 2 months ago

cn

by @Apiwit

import { clsx, type ClassValue } from "clsx"
import { twMerge } from "tailwind-merge"

export function cn(...inputs: ClassValue[]) {
  return twMerge(clsx(inputs))
}
typescriptUpdated about 2 months ago

Format Date

by @Apiwit

export const formatDate = (date: Date): string => {
  return date.toISOString();
};