Skip to content

Instantly share code, notes, and snippets.

View malte-wessel's full-sized avatar

Malte Wessel malte-wessel

View GitHub Profile
const Component = ({ markers }) => (
<Map>
<Clusterer renderCluster={(cluster) => <Cluster cluster={cluster} />}>
{markers.map((marker, idx) => (
<OverlayView key={idx}>
{(isVisible) => (
<Marker marker={marker} isVisible={isVisible} />
)}
</OverlayView>
import {
useRef,
useEffect,
FC,
ReactElement,
useState,
MutableRefObject,
} from 'react';
import { BehaviorSubject, Observable, Subject, Subscription } from 'rxjs';
import { distinctUntilChanged } from 'rxjs/operators';
import { h, Ref } from 'preact';
import { map, pluck, tap } from 'rxjs/operators';
import {
ComponentFunction,
ComponentTemplate,
createComponent
} from './component';
import { combine } from './util/combine';
import { createHandler } from './util/createHandler';
import { createRef } from './util/createRef';
import { useState, useEffect } from 'melody-hooks';
const getIsOffline =
typeof navigator.onLine === 'boolean'
? () => !navigator.onLine
: () => false;
export const useIsOffline = () => {
const [isOffline, setIsOffline] = useState(getIsOffline());
useEffect(() => {
import { useState, useEffect } from 'melody-hooks';
const canUseIntersectionObserver = window.IntersectionObserver !== undefined;
const useIsVisibleFallback = () => true;
export const createUseIsVisible = options => {
if (!canUseIntersectionObserver) {
return useIsVisibleFallback;
}
const initialState = {
resourceByHash: {},
isLoadingByHash: {},
errorByHash: {},
};
const reducer = (state = initialState, action) => {
switch (action.type) {
case 'START': {
const { hash } = action.payload;
const EPIC_END = Symbol('EPIC_END');
const createEpicStore = (reducer, initialState, epic) => {
let epicMiddleware = createEpicMiddleware();
let store = createStore(
reducer,
initialState,
applyMiddleware(epicMiddleware)
);
@malte-wessel
malte-wessel / poll.js
Last active December 14, 2018 09:47
Polling with Observables / RxJs
import { Observable } from 'rxjs/Observable';
import { fromPromise } from 'rxjs/observable/fromPromise';
import 'rxjs/add/operator/delay';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/expand';
import 'rxjs/add/operator/takeWhile';
import 'rxjs/add/operator/catch';
const defaultIsComplete = () => false;
const defaultKeepIntervalLow = () => false;
// https://github.com/salsita/geo-tree
// Red-black tree for geo coordinates, scalar indices with z-curve
import GeoTree from 'geo-tree';
const gt = new GeoTree();
// Items sorted by relevance, data holds itemId
const items = [
{lat: 48.85886, lng: 2.34706, data: 3849712},
{lat: 52.50754, lng: 13.42614, data: 234910},
@malte-wessel
malte-wessel / index.js
Created June 6, 2017 20:05
requirebin sketch
const Inferno = require('inferno');
const InfernoServer = require('inferno-server');
const createElement = require('inferno-create-element');
const tree = createElement('div', { className: 'basic' },
createElement('span', { className: 'foo' }, 'Hello World')
);
const root = document.getElementById('root');