Skip to content

Instantly share code, notes, and snippets.

View iamdanthedev's full-sized avatar
😃

Dan The Dev iamdanthedev

😃
  • Bonliva AB
  • Stockholm/Kiev
View GitHub Profile
@iamdanthedev
iamdanthedev / withConfirn.tsx
Created January 26, 2018 00:03
withConfirm react hoc
import * as React from 'react';
import { compose, withStateHandlers } from 'recompose';
import Confirm from 'semantic-ui-react/dist/commonjs/addons/Confirm/Confirm';
/**
* with confirm hoc
* wraps an underlying component with a modal action confirmation
*/
export type ConfirmOptions = {
@iamdanthedev
iamdanthedev / withFormBlock.ts
Created January 7, 2018 18:31
react hoc that blocks history transition
import { compose, lifecycle, withState } from 'recompose';
import { History, UnregisterCallback } from 'history';
type Props = {
pristine: boolean;
history: History;
};
type State = {
historyBlock: UnregisterCallback;
@iamdanthedev
iamdanthedev / withModal.tsx
Created January 7, 2018 18:28
withModal hoc (semantic-ui-react modal)
import * as React from 'react';
import { Modal, ModalProps } from './semantic';
export function withModal<T extends {} = any>(
modalOptions: ModalProps | ((props: T) => ModalProps),
) {
return BaseComponent => props => {
const modalProps =
typeof modalOptions === 'function' ? modalOptions(props) : modalOptions;
@iamdanthedev
iamdanthedev / withTheme.tsx
Created December 27, 2017 16:47
react storybook styled-components theme provider decorator
import * as React from 'react';
import { StoryDecorator } from 'storybook__react';
import { ThemeProvider } from 'styled-components';
/**
* Storybook styled-components theme provider
*/
export function withTheme(theme): StoryDecorator {
@iamdanthedev
iamdanthedev / gist:a63fc9ae83819f4587bb498ac10a689f
Last active June 17, 2023 04:56
Typescript fully typed mongoose workflow incl. virtuals, statics and hooks
import { Document, model, Model, Schema } from 'mongoose';
import { withFindOrCreate, WithFindOrCreate } from '../utils/findOrCreate';
import { NutrientUnitInstance, NutrientUnitModel } from '../NutrientUnit/NutrientUnit';
import { ObjectID } from 'bson';
/**
* Nutrient (e.g. calcium)
*/
export interface Nutrient {
@iamdanthedev
iamdanthedev / gist:6d411a4f6441b5548eeadadfd1f7b60a
Created December 27, 2017 05:39
findOrCreate mongoose typescript plugin
import { Document, Model, Schema } from 'mongoose';
import { ObjectID } from 'bson';
/**
* Find or create mongoose static function creator
*/
export type WithFindOrCreate<T extends Document> = {
findOrCreate: (id?: string | ObjectID | null) => T;
};
@iamdanthedev
iamdanthedev / Nutrient.ts
Created December 19, 2017 14:21
Mongoose post init hook in typescript
// @ts-ignore
nutrientSchema.post('init', async function(this: NutrientInstance) {
// noinspection JSDeprecatedSymbols
if (!this.displayUnitCode && this.displayUnitId) {
const unit = await NutrientUnitModel.findById(this.displayUnitId);
if (unit) {
this.displayUnitCode = unit.code;
await this.save();
}
}
@iamdanthedev
iamdanthedev / tsconfig.ts
Created November 16, 2017 01:12
tsconfig.ts paths
{
"compilerOptions": {
"target": "es2017", /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', or 'ESNEXT'. */
"lib": ["dom", "es2017", "esnext"],
"module": "commonjs", /* Specify module code generation: 'none', commonjs', 'amd', 'system', 'umd', 'es2015', or 'ESNext'. */
// "noEmit": true, /* Do not emit outputs. */
"strict": true,
"strictFunctionTypes": false,
"noImplicitAny": false,
"experimentalDecorators": true,
@iamdanthedev
iamdanthedev / scratch.tsx
Created November 13, 2017 18:51
React composition with apollo query, mutation and react-router
import { graphql, QueryProps } from 'react-apollo';
/**
* QUERY
*/
const PAYMENT_QUERY = gql`
query payment($id: ID!) {
payment(id: $id) {
id
@iamdanthedev
iamdanthedev / dataLoadingOrError.tsx
Last active December 2, 2017 11:14
Apollo data loading or error HOC
import * as React from 'react';
import { Loading } from '@common/components/Loading/Loading';
import { ErrorMessage } from '@common/components/ErrorMessage/ErrorMessage';
import { IconSizeProp } from 'semantic-ui-react/src/elements/Icon/Icon';
type Options<T = any> = {
loaderSize?: IconSizeProp,
errorExtraCheck?: (props: T) => string | null | undefined,
loadingExtraCheck?: (props: T) => boolean,