Skip to content

Instantly share code, notes, and snippets.

Jason Awbrey jsonberry

Block or report user

Report or block jsonberry

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@jsonberry
jsonberry / readme.md
Created Nov 27, 2019
Injecting Actions Service for profit
View readme.md

Reference to this twitter thread: https://twitter.com/jsonberrry/status/1199566382716731393

Subject: "injecting the actions service into the component level as a means for propagating success/error states to a presentational layer"

Question from @jdpearce

"“Injecting the actions service...” woah, woah, woah...what?!

Why aren’t you setting a property in the store and selecting that?"

@jsonberry
jsonberry / app.component.ts
Last active Feb 20, 2019
Reactive Angular Scroll Position Restoration with RxJS
View app.component.ts
import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
import { Event, NavigationEnd, NavigationStart, Router } from '@angular/router';
import { asyncScheduler } from 'rxjs';
import { filter, observeOn, scan } from 'rxjs/operators';
interface ScrollPositionRestore {
event: Event;
positions: { [K: number]: number };
trigger: 'imperative' | 'popstate';
idToRestore: number;
@jsonberry
jsonberry / composability.ts
Last active Jan 9, 2019
rxjs-toolkit examples
View composability.ts
import { someApiService } from './some-api.service';
import { propsAreTruthy, ignoreFalsySignals } from 'rxjs-toolkit';
// imagine getSource$ return an object like this:
const exampleSource = {
id: '123',
origin: {
name: '',
url: 'noop.com',
}
@jsonberry
jsonberry / propsAreTruthy.ts
Last active Jan 13, 2019
rxjs-toolkit examples
View propsAreTruthy.ts
import { of } from 'rxjs';
import { propsAreTruthy, tapLog } from 'rxjs-toolkit';
const source$ = of({
foo: {
bar: {
baz: 'truthy!',
},
},
zap: {
@jsonberry
jsonberry / propsAreTruthy.ts
Last active Jan 14, 2019
rxjs-toolkit examples
View propsAreTruthy.ts
import { from } from 'rxjs';
import { propsAreTruthy, tapLog } from 'rxjs-toolkit';
const topLevelTruthy = {
one: 'I',
two: 'am',
three: 'truthy',
iHaveNestedProps: { // top level also truthy
nested: null,
},
View ignoreFalsyValues.ts
import { someDataSource } from './some-api.service';
import { ignoreFalsySignals, tapLog } from 'rxjs-toolkit';
interface Signal {
foo: string;
}
/**
* signals$ pushes out an Observable of Signal
* imagine the source of the stream is the return from an API call
View ignoreFalsyValues.ts
import { from } from 'rxjs';
import { ignoreFalsySignals, tapLog } from 'rxjs-toolkit';
from([
'I',
false,
'am',
null,
'truthy',
]).pipe(
@jsonberry
jsonberry / tapLog.ts
Last active Jan 9, 2019
rxjs-toolkit examples
View tapLog.ts
import { of } from 'rxjs';
import { tapLog } from 'rxjs-toolkit';
of('hello').pipe(
tapLog(), // log out whatever the signal is, so "hello"
tapLog('labelFoo') // give it a label, { labelFoo: "hello" }
).subscribe()
@jsonberry
jsonberry / actions.js
Last active Nov 9, 2018
Angular ngrx-router-store Router Actions / Effects
View actions.js
/* tslint:disable:max-classes-per-file */
import {Action} from '@ngrx/store';
import {NavigationExtras} from '@angular/router';
export enum RouterActionTypes {
GO = '[router] Go',
BACK = '[router] Back',
FORWARD = '[router] Forward',
}
View bp.scss
/// Breakpoints
/// @author Jason Awbrey
/// @param { phone | tablet-portrait | tablet-landscape | desktop | desktop-big } $type [no default]
/// @return { Number } Rem calculated value for a given breakpoint
@function bp($type) {
/// @prop
$breakpoints: (phone: 599, tablet-portrait: 600, tablet-landscape: 900, desktop: 1200, desktop-big: 1800);
@if (map-has-key($breakpoints, $type) != true) {
@error "$type must be one of these: #{map-keys($breakpoints)}";
}
You can’t perform that action at this time.