Skip to content

Instantly share code, notes, and snippets.

View maapteh's full-sized avatar
🏠
Working from home

Mаартен - Maarten maapteh

🏠
Working from home
  • The Hague, Moscow
View GitHub Profile
@maapteh
maapteh / user-agent-detection.js
Last active January 28, 2022 06:28
middleware user agent
// reason: package provided by our components library
// eslint-disable-next-line import/no-extraneous-dependencies
import MobileDetect from 'mobile-detect';
import { Viewport } from '@lib/types';
/** server-side script for guessing user Viewport if its Mobile/Tablet or others. This initial Viewport is used in our ViewportProvider which then runs the Viewport detection client-side */
export const getViewportFromUserAgent = (
userAgent: string | null
): Viewport.lg | Viewport.sm | Viewport.md => {
// corporate firewalls or users who like to stay unknown
@maapteh
maapteh / simple.js
Last active January 27, 2022 08:26
simple component
type ComponentProps = {
isDifficult?: boolean;
} & BoxProps;
export function Component({
isDifficult,
...boxProps
}: ComponentProps) {
return (
<Box
@maapteh
maapteh / Theme.js
Created October 14, 2021 19:57
Theme
import { addDecorator } from '@storybook/react';
import { themeDefault } from '../themes/default';
import { themeFoo } from '../themes/foo';
import { themeBar } from '../themes/bar';
export const globalTypes = {
theme: {
name: 'Theme',
description: 'Theme selector',
toolbar: {
const StyledRow = styled(Box)`
box-sizing: content-box;
`;
const padding = { base: 4, md: 8 };
export function Row({
...boxProps
}: Omit<BoxProps, 'p' | 'pl' | 'pr' | 'm' | 'ml' | 'mr'>) {
return (
@maapteh
maapteh / Box.js
Last active October 14, 2021 19:57
Box
/**
* Box is the most abstract component on top of which other chakra
* components are built. It renders a `div` element by default.
*
* @see Docs https://chakra-ui.com/box
*/
export declare const Box: import("@chakra-ui/system").ChakraComponent<"div", {}>;
@maapteh
maapteh / builder typed for mocks
Last active March 25, 2021 18:04
typescripted builder for mocks, making the differentations easy while working
```
// thanks to Olga
const merge = require('deepmerge');
type DeepPartial<T> = T extends object
? { [K in keyof T]?: DeepPartial<T[K]> }
: T;
export type TBuilder<O> = (attrs?: DeepPartial<O>) => O;
const overwriteMerge = <T extends any>(
destinationArray: T[],
sourceArray: T[],
import 'reflect-metadata';
import {
createModule,
testkit,
gql,
} from 'graphql-modules';
export const _hackKeepExtendWorking = {
typeDefs: gql`
type Query {
/* eslint-disable */
declare namespace PetstoreRaw {
namespace RequestBodies {
export type Pet = Schemas.Pet;
export type UserArray = Schemas.User[];
}
namespace Schemas {
export interface Address {
/**
* example:
@maapteh
maapteh / jsesc.js
Last active December 10, 2019 21:46
wrong jsesc usage
const jsonString = jsesc(JSON.stringify(data), {
json: true,
isScriptContext: true
});
<script>window.__INITIAL_STATE__ = JSON.parse(${jsonString})</script>
@maapteh
maapteh / cache-middleware.js
Last active December 11, 2019 04:11
caching
function (duration) {
// cutted code
return (req, res, next) => {
// cutted code
if (res.locals.ratelimited) {
if (cacheContent) {
res.setHeader(cacheKeyHeader, 'HIT');
res.status(200).send(cacheContent);
return;
} else {