Skip to content

Instantly share code, notes, and snippets.

View RichardSPrins's full-sized avatar
💻

Richard S Prins Jr. RichardSPrins

💻
View GitHub Profile
@RichardSPrins
RichardSPrins / useSlider.tsx
Created February 4, 2023 00:14
useSlider Hook
import { useState, useCallback, useEffect } from 'react';
import useEmblaCarousel from 'embla-carousel-react';
import { EmblaOptionsType } from 'embla-carousel-react';
export const useSlider = (options?: EmblaOptionsType) => {
const [isPrevButtonEnabled, setIsPrevButtonEnabled] = useState<boolean>(false);
const [isNextButtonEnabled, setIsNextButtonEnabled] = useState<boolean>(false);
const [activeSlideIndex, setActiveSlideIndex] = useState<number>(0);
const [scrollSnaps, setScrollSnaps] = useState<Array<number>>([]);
import * as React from "react";
import { GetServerSidePropsContext } from "next";
import { unstable_getServerSession } from "next-auth";
import AppLayout from "../../layouts/AppLayout";
import { trpc } from "../../utils/trpc";
import { authOptions } from "../api/auth/[...nextauth]";
import {
Button,
CopyButton,
Tooltip,
import { TRPCError } from "@trpc/server";
import { z } from "zod";
import { createProtectedRouter } from "./context";
export const stripeRouter = createProtectedRouter()
.middleware(async ({ ctx, next }) => {
// Any queries or mutations after this middleware will
// raise an error unless there is a current session
if (!ctx.session) {
throw new TRPCError({ code: "UNAUTHORIZED" });
import React, { useState, useEffect, useContext, createContext } from 'react';
import Router from 'next/router';
import nookies from 'nookies';
import firebase from './firebase';
import { createOrUpdateUser, deleteUser, setUserStatus } from './db';
import { useCometChat } from './cometChat';
const rtdb = firebase.database();
const formatUser = async (user: firebase.User) => {
import * as React from 'react';
import { HiTrash } from 'react-icons/hi';
import { useLongPress } from '../lib/hooks';
import ChatHeadshot from './ChatHeadshot';
import DeleteConversationModal from './DeleteConversationModal';
import { useDeviceDetect } from '../lib/hooks';
import { killEvent } from '../lib/utils';
type ConversationPreviewProps = {
conversation: any;
// This is your Prisma schema file,
// learn more about it in the docs: https://pris.ly/d/prisma-schema
datasource db {
provider = "postgres"
url = env("DATABASE_URL")
}
generator client {
provider = "prisma-client-js"
@RichardSPrins
RichardSPrins / GridList.jsx
Created September 10, 2021 21:46
GridList
const LearningPathDetailsPage = () => {
return (
<CoachLayout>
<Container maxW="7xl">
<Flex align="center" justify="space-between">
<Heading>Learning Path Name</Heading>
<Button mt="4" bg="green.400" _hover={{bgColor: "green.600"}} leftIcon={<Icon as={FiEdit}/>}>Edit Path</Button>
</Flex>
{/* <Heading size="lg" color="gray.500">Student Name</Heading> */}
<Grid
<?php include('header.php') ?>
<section id="list" class="list">
<header class="list__row list__header">
<h1>Assignments</h1>
<form action="." method="get" id="list__header_select" class="list__header_select">
<input type="hidden" name="action" value="list_assignments" />
<select required name="course_id">
<option value="0">View All</option>
<?php foreach ($courses as $course) : ?>
<?php if ($course_id == $course['courseID']) { ?>
import Header from 'components/clients/Flows/Table/Header/Header'
import * as React from 'react'
import Table, {AutoResizer, Column} from 'react-base-table'
import 'react-base-table/styles.css'
// import styled from '@emotion/styled'
// import { colors, fontFamily } from 'styles/theme'
import FlowStatus from './Columns/FlowStatus'
import FlowName from './Columns/FlowName'
import Contacts from './Columns/Contacts'
import Engaged from './Columns/Engaged'

Contact forms are like a direct line from your users to you, and more often than not provide a ton of insight into how your users perceive and communicate with your business, especially new customers. While you may think that creating a contact form is as easy as some inputs and some server to send off whatever data you provide it, there are a little more subtle nuances to making sure that your form works as expected, especially in production. At least, that is what I found out today while working on a contact page for my new service, SquadPerks. I was looking for some managed solution that leveraged my existing email service, address, and meshed well with my front end. Enter EmailJS. EmailJS offers complete support for a few of the most popular web frameworks, or just plain vanilla JavaScript, and comes with a nice dashboard that is quick and easy to get a contact service set up, using SMTP mail servers or existing mail services, in my case, Gmail. Jus