Juan P. Prieto juanpprieto

Sr. Full Stack Engineer at @Shopify Hydrogen. Passionate about design, Typescript, React, VueJs, Remix, Next and headless commerce.

juanpprieto / Providers.tsx

Created May 9, 2024 16:15 — forked from julrich/Providers.tsx

Unpic blurhash handling with React

	function isStoryblokAsset(object: unknown): object is AssetStoryblok {
	return (object as AssetStoryblok)?.filename !== undefined;
	}

	const Picture = forwardRef<
	HTMLImageElement,
	PictureProps & ImgHTMLAttributes<HTMLImageElement>
	>(({ src, lazy, ...props }, ref) => {
	const internalRef = useRef<HTMLImageElement>(null);

juanpprieto / onetrust-shopify-callback.js

Created March 13, 2024 22:20 — forked from vvastdev/onetrust-shopify-callback.js

Callback to Shopify privacy API on OneTrust banner interaction, passing boolean based on OT tracking consent codes

	<script>

	const performanceCookieCategory = '2,';

	function waitForOneTrust() {
	hasOneTrustLoaded();

	let attempts = 0;
	const interval = setInterval(function () {

juanpprieto / gist:a9bf007124973b3c5ab19b21352ec249

Created August 10, 2023 14:45 — forked from AlemTuzlak/gist:89ee03a57c97cb820d6c30d7cd88b341

Type inference with zod and remix-hook-form

	import type { ZodType, z } from "zod";
	import { zodResolver } from "@hookform/resolvers/zod";
	import { getValidatedFormData as getValidatedFormDataPrimitive, useRemixForm as useForm, UseRemixFormOptions } from "remix-hook-form";

	interface UseRemixFormZodOptions<T extends ZodType, U extends FromZodType<T>> extends UseRemixFormOptions<U> {
	schema: T;
	}

	export type FromZodType<T extends ZodType> = z.infer<T>;

juanpprieto / headless-theme-redirect.liquid

Created May 23, 2023 15:10 — forked from benjaminsehl/headless-theme-redirect.liquid

Shopify Headless Theme.liquid Redirect — UPDATE: replace with this theme: https://github.com/benjaminsehl/shopify-headless-theme

	{% comment %}

	UPDATE: Now you can use this theme to more easily manage your redirects:
	https://github.com/benjaminsehl/shopify-headless-theme

	{% endcomment %}

	{% assign new_website = 'https://headless-website.com/' %}
	<!doctype html>
	<html>

juanpprieto / auth0-rule-shopify-multipass.js

Created March 12, 2023 17:07 — forked from drovani/auth0-rule-shopify-multipass.js

Auth0 Rule to Generate a Multipass token and redirect the user back to the Shopify store

	function (user, context, callback) {
	if (context.clientMetadata && context.clientMetadata.shopify_domain && context.clientMetadata.shopify_multipass_secret)
	{
	const RULE_NAME = 'shopify-multipasstoken';
	const CLIENTNAME = context.clientName;
	console.log(`${RULE_NAME} started by ${CLIENTNAME}`);

	const now = (new Date()).toISOString();
	let shopifyToken = {
	email: user.email,

juanpprieto / karabiner-custom-capslock.json

Created February 24, 2023 20:37 — forked from justinmklam/karabiner-custom-capslock.json

Map caps lock to esc (if tapped) or control (if held down or combined with another key). Use with Karabiner Elements on MacOS

	{
	"title": "Change caps_lock to Esc and Control",
	"rules": [
	{
	"description": "Post Esc if Caps is tapped, Control if held.",
	"manipulators": [
	{
	"type": "basic",
	"from": {
	"key_code": "caps_lock",

juanpprieto / datalayer.js

Created December 8, 2021 18:42 — forked from elephantsneverforget/datalayer.js

	<!--- Elevar Base Data Layer ----!>


	{% if customer %}
	window.dataLayer.push({
	"event": "dl_user_data"
	"event_id": {{ uuid }} // unique uuid for FB conversion API
	"cart_total": "{{ cart.total_price }}",
	"user_properties": {
	"visitor_type": "logged_in",

juanpprieto / ffmpeg-install.sh

Created November 12, 2021 14:26 — forked from clayton/ffmpeg-install.sh

Install FFMPEG on OS X with HomeBrew to convert Mp4 to WebM

	# Installation
	brew install ffmpeg --with-vpx --with-vorbis --with-libvorbis --with-vpx --with-vorbis --with-theora --with-libogg --with-libvorbis --with-gpl --with-version3 --with-nonfree --with-postproc --with-libaacplus --with-libass --with-libcelt --with-libfaac --with-libfdk-aac --with-libfreetype --with-libmp3lame --with-libopencore-amrnb --with-libopencore-amrwb --with-libopenjpeg --with-openssl --with-libopus --with-libschroedinger --with-libspeex --with-libtheora --with-libvo-aacenc --with-libvorbis --with-libvpx --with-libx264 --with-libxvid

	# Easy Peasy
	ffmpeg -i video.mp4 video.webm

juanpprieto / Convert mp4 to webm Using ffmpeg on Mac

Created November 12, 2021 01:21 — forked from muratgozel/Convert mp4 to webm Using ffmpeg on Mac

	1. Install ffmpeg:
	brew install ffmpeg --with-vpx --with-vorbis --with-libvorbis --with-vpx --with-vorbis --with-theora --with-libogg --with-libvorbis --with-gpl --with-version3 --with-nonfree --with-postproc --with-libaacplus --with-libass --with-libcelt --with-libfaac --with-libfdk-aac --with-libfreetype --with-libmp3lame --with-libopencore-amrnb --with-libopencore-amrwb --with-libopenjpeg --with-openssl --with-libopus --with-libschroedinger --with-libspeex --with-libtheora --with-libvo-aacenc --with-libvorbis --with-libvpx --with-libx264 --with-libxvid

	2. Convert:
	ffmpeg -i input-file.mp4 -c:v libvpx -crf 10 -b:v 1M -c:a libvorbis output-file.webm

juanpprieto / vimeo-background-cover.html

Created July 10, 2021 00:26