Skip to content

Instantly share code, notes, and snippets.

View SimeonGriggs's full-sized avatar

Simeon Griggs SimeonGriggs

View GitHub Profile
@SimeonGriggs
SimeonGriggs / CopyToMarket.jsx
Last active April 27, 2022 11:52
Sanity.io Document Action to duplicate a document + update the `market` field to one selected.
/* eslint-disable react/prop-types */
/* eslint-disable react/jsx-no-bind */
import React, {useState, useCallback, useMemo} from 'react'
import {SearchIcon, ArrowRightIcon} from '@sanity/icons'
import {useToast, Text, Flex, Box, Button, Autocomplete, Label, Stack} from '@sanity/ui'
import sanityClient from 'part:@sanity/base/client'
export const MARKETS = [
{
name: `DE`,
@SimeonGriggs
SimeonGriggs / write-nextjs-redirect.js
Created April 25, 2022 10:38
A script to be run `prebuild` to dynamically generate a new vercel.json file with redirects written in Sanity
const sanityClient = require('@sanity/client')
const fs = require('fs')
const client = sanityClient({
apiVersion: '2021-04-01',
dataset: `XXX`,
projectId: `XXX`,
useCdn: true,
})
@SimeonGriggs
SimeonGriggs / market-separated-desk-structure.js
Last active March 30, 2022 12:38
Structure Builder for "markets" that share schema and populate an initial value template
import React from 'react'
import S from '@sanity/desk-tool/structure-builder'
import schema from 'part:@sanity/base/schema'
import userStore from 'part:@sanity/base/user'
// npm i pluralize
import pluralize from 'pluralize'
// BYO "Flag" component for an Icon
// import Flag from '../components/Flag/index'
@SimeonGriggs
SimeonGriggs / ToggleLive.js
Last active March 3, 2022 15:51
Document action to toggle an `isLive` field with double-confirmation
import {useState, useMemo, useEffect} from 'react'
import {useDocumentOperation} from '@sanity/react-hooks'
import {FiZap, FiZapOff} from 'react-icons/fi'
export function ToggleLive({id, type, draft, published, onComplete}) {
const {patch, publish} = useDocumentOperation(id, type)
const doc = useMemo(() => draft || published, [draft, published])
const [isPublishing, setIsPublishing] = useState(false)
const [dialogOpen, setDialogOpen] = useState(false)
@SimeonGriggs
SimeonGriggs / Message.jsx
Created March 3, 2022 11:56
A custom inputComponent to give user feedback based on values in the document
import React from 'react'
import PropTypes from 'prop-types'
import {withDocument} from 'part:@sanity/form-builder'
import {Stack, Card, Box, Text, Flex} from '@sanity/ui'
import {FiGitBranch, FiGitCommit, FiZap, FiAlertOctagon, FiFileText, FiFile} from 'react-icons/fi'
import DEFAULT_VARIANT from '../../lib/defaultVariant'
const Message = React.forwardRef(({document}, ref) => {
const {_id, variant, live, _createdAt} = document
@SimeonGriggs
SimeonGriggs / TradingHours.jsx
Created February 16, 2022 10:13
A mock prototype for a TradingHours custom input designed with Sanity UI
import React from 'react'
import {Stack, Card, Flex, Switch, Label, Box, Text, Autocomplete, Button} from '@sanity/ui'
import {AddIcon, TrashIcon} from '@sanity/icons'
import {daysOfTheWeek, hoursOfTheDay} from './data'
export default function TradingHours() {
// Update how trading times are searched for
const handleAutocompleteFilter = (query, option) => {
// Treat a search for 1.00 as 1:00
@SimeonGriggs
SimeonGriggs / wordle.js
Last active February 11, 2022 09:54
Sanity Schema for Wordle
import React from 'react'
import {withDocument} from 'part:@sanity/form-builder'
import {Stack, Card, Flex, Text} from '@sanity/ui'
import {format} from 'date-fns'
const WORD_LENGTH = 5
function Guess({char, answer, index}) {
const answerSplit = answer.split('')
let tone = `default`
@SimeonGriggs
SimeonGriggs / SuperSecretTool.jsx
Created February 3, 2022 10:45
A tool that renders differently based on User Role Name
import React from 'react'
import {Box, Card, Container, Text} from '@sanity/ui'
import {useCurrentUser} from './useCurrentUser'
export default function SuperSecretTool() {
const {roles} = useCurrentUser()
const isAdmin = roles?.length ? roles.find((role) => role?.name === 'administrator') : false
if (!isAdmin) {
@SimeonGriggs
SimeonGriggs / DateTimeDisplay.jsx
Created January 25, 2022 12:07
DateTimeDisplay Tool
import React, {useState} from 'react'
import {Box, Text, Container, Card, Stack, Flex} from '@sanity/ui'
import subDays from 'date-fns/subDays'
import {format} from 'date-fns'
import DateTimeInput from 'part:@sanity/form-builder'
export default function DateTimeDisplay() {
const [fromDate, setFromDate] = useState(subDays(new Date(), 1))
const [toDate, setToDate] = useState(new Date())
@SimeonGriggs
SimeonGriggs / DecoratedArray.js
Created December 10, 2021 14:19
Sanity.io Custom Input that will still resolve the default UI for field editing
/**
* Custom Input that will resolve Sanity's default UI for field editing
* As well as display some contextual information from the document
* This is example is for an `array` field of `car` type fields
* For which the default UI is shown below an image from the first array item
*
* The implementation is *not* bulletproof and only has basic handling
* of the potential pitfalls of recursive rendering of the
* <FormBuilderInput /> component
*/