Skip to content

Instantly share code, notes, and snippets.

View MartinMalinda's full-sized avatar

Martin Malinda MartinMalinda

View GitHub Profile
import { SupabaseClient } from "@supabase/supabase-js";
import { GenericSchema } from "@supabase/supabase-js/dist/module/lib/types";
import { supabase } from "/~/data/supabase";
import { defineStore } from "pinia";
export function defineSupaStore<Database, SchemaName extends string & keyof Database, Schema extends GenericSchema, TableName extends string & keyof Schema['Tables']>(supabase: SupabaseClient<Database, SchemaName, Schema>, tableName: TableName) {
const table = () => supabase.from(tableName);
type Row = Schema['Tables'][TableName]['Row'];
type Insert = Schema['Tables'][TableName]['Insert'];
<!-- PARENT -->
<script>
const editInvoiceModal = Vue.component({
template: () => vue.h('div', { props: }, [{
vue.h('div', { title: '' }, [
])
}])
});
import { defineStore } from 'pinia';
import get from 'deep-access';
import { isDevelopment } from '../media/detect';
export type PluralizeFn = (parts: string[], n: number) => string;
export const useI18n = () => {
const store = useI18nStore();
const t = (key, params?: Record<string, any>, n?: number) => store.t(key, params, n);
const setLocale = (locale: string, { data, pluralizeFn }: { data: Record<string, any>, pluralizeFn?: PluralizeFn }) => {
@MartinMalinda
MartinMalinda / img.vue
Created January 7, 2022 16:40
Lazy Image Component
<script lang="ts">
import { defineComponent, computed, ref } from '@vue/composition-api';
import Intersect from 'vue-intersect';
import { oneOf } from '~/utils/props';
import {
responsifyImageSource,
responsifyImageSourceSet,
ImageSizeOption,
ImageParam,
} from '~/utils/img';
<script lang="ts">
import { useIntersectionObserver } from "@vueuse/core";
import { ref, nextTick } from "vue";
function onIdle(cb = () => {}) {
if ("requestIdleCallback" in window) {
window.requestIdleCallback(cb);
} else {
setTimeout(() => {
nextTick(cb);
<script lang="ts">
import { useIntersectionObserver } from '@vueuse/core';
function onIdle(cb = () => {}) {
if ('requestIdleCallback' in window) {
window.requestIdleCallback(cb);
} else {
setTimeout(() => {
nextTick(cb);
}, 300);
<script lang="ts">
import { useIntersectionObserver } from '@vueuse/core'
export default {
setup() {
const shouldRender = ref(false);
const targetEl = ref();
const { stop } = useIntersectionObserver(
targetEl,
<script lang="ts">
import { nextTick } from 'vue';
export default {
setup() {
const shouldRender = ref(false);
nextTick(() => {
shouldRender.value = true;
});
<script>
function searchSpecies(term, options) {
return ajax(
`https://api.gbif.org/v1/species/search?q=${term}&rank=GENUS`,
options
);
}
export default defineComponent({
setup() {
<script>
function searchSpecies(term, options) {
return ajax(
`https://api.gbif.org/v1/species/search?q=${term}&rank=GENUS`,
options
);
}
export default defineComponent({
setup() {