Skip to content

Instantly share code, notes, and snippets.

View Akryum's full-sized avatar
☮️
Meow

Guillaume Chau Akryum

☮️
Meow
View GitHub Profile
@Akryum
Akryum / format-object.js
Created January 13, 2021 23:02
Format a JS object or array to JavaScript source code string
const KEY_ESCAPE_REG = /[\s-.:|#@$£*%]/
const MAX_SINGLE_LINE_ARRAY_LENGTH = 3
export function formatObjectToSource (obj) {
return printLines(Array.isArray(obj) ? arrayToSourceLines(obj) : objectToSourceLines(obj))
}
function objectToSourceLines (object, indentCount = 0) {
return createLines(indentCount, lines => {
lines.push('{')
<link rel="stylesheet" href="https://cdn.rawgit.com/luizbills/feather-icon-font/v4.7.0/dist/feather.css">
@Akryum
Akryum / eager-computed-options-alt.ts
Last active September 14, 2023 08:59
Eager Vue computed property - use for cheap computed properties that always update but that don't trigger updates when their value doesn't change
export function useEagerComputed() {
const properties = []
function eagerComputed(definitions) {
const computedProps = {}
for (const key in definitions) {
const effect = definitions[key]
properties.push({ key, effect })
computedProps[key] = function () {
return this.$data[key]
@Akryum
Akryum / dedupeApolloReferences.js
Created April 2, 2021 15:31
Dedupe Apollo Client 3 references in merge
function dedupeReferences (existing, incoming) {
// Dedupe items
const idMap = {}
for (const item of existing) {
idMap[item.__ref] = true
}
const validated = []
for (const item of incoming) {
if (!idMap[item.__ref]) {
validated.push(item)
@Akryum
Akryum / hookable.spec.ts
Created August 22, 2021 13:49
Type-safe hooks
import { Hookable } from '../src/hookable'
describe('hookable', () => {
test('hook with one callback', async () => {
const hooks = new Hookable<{
invert:(value: boolean) => boolean | Promise<boolean>
}>()
hooks.hook('invert', value => !value)
<script setup>
import { ref, computed } from 'vue'
import gql from 'graphql-tag'
import { client } from './weather'
const document = gql`query getCityWeather ($name: String!) {
city: getCityByName (name: $name) {
id
name
country
<template>
<VDropdown>
<button>Menu</button>
<template #popper="{ hide }">
<RunSelector
@close="hide()"
/>
</template>
</VDropdown>
@Akryum
Akryum / Before.vue
Last active June 27, 2022 08:18
Vue 3: Detect content inside slots
<!-- Doesn't work with Vue 2 scoped slots nor Vue 3 slots in some cases -->
<template>
<div>
<div v-if="$slots.foo">
<slot name="foo" title="Title" />
</div>
</div>
</template>
@Akryum
Akryum / a.ts
Last active September 16, 2022 15:04
Typed Meteor Methods and subscriptions
import { updateLobby, subscribeToLobby } from './lobby'
// ...
updateLobby('some-id', { title: 'Foo' })
subscribeToLobby('xxx-xxx-xxx')
@Akryum
Akryum / gist:6bab33ad28b4b786cc5fe85c20b2585a
Created September 29, 2022 10:21
RegExp to find dynamic Vue component imports
=\s\(\) => import\([\s\n]*(\/\*.*?\*\/[\s\n]*)?'.*?\.vue'[\s\n]*\)