BosNaufal

import styled from 'vue-styled-components';

const WrapperProps = ["bg", "fontSize"]

const Wrapper = styled('div', WrapperProps)`
  background: ${(props) => props.bg};
  color: white;
  font-size: ${(props) => props.fontSize}rem;
`

BosNaufal

import styled from 'vue-styled-components';

const MyButtonProps = {
  success: Boolean
}

const MyButton = styled('button', MyButtonProps)`
  background: ${
    ({ success }) => success
      ? "green"

BosNaufal

import styled, { css } from 'vue-styled-components';

const baseDarkModeStyle = css`
  background: black;
  color: white;
`

const DarkButton = styled('button')`
  ${baseDarkModeStyle}
  font-size: 2rem;

BosNaufal

import styled from 'vue-styled-components';

const adaptCurrentMode = (isDarkMode = false, customColor) => {
  return isDarkMode 
    ? (`
      background: black;
      color: ${customColor || 'white'};
    `)
    : ""
}

BosNaufal

import styled, { ThemeProvider } from 'vue-styled-components';

const Button = styled('button')`
  background: ${({ theme }) => theme.bg};
  color: ${({ theme }) => theme.text};
  font-size: 2rem;
  border-color: ${({ theme }) => theme.borderColor};  
`

const Card = styled('div')`

BosNaufal

import styled, { ThemeProvider } from 'vue-styled-components';

const Button = styled('button')`
  background: ${({ theme }) => theme.bg};
  color: ${({ theme }) => theme.text};
  font-size: 2rem;
  border-color: ${({ theme }) => theme.borderColor};  
`

const Card = styled('div')`

BosNaufal

/* Adapted from Tom Cunningham's 'Data Warehousing with MySql' (www.meansandends.com/mysql-data-warehouse) */
/* BASED ON: https://gist.github.com/johngrimes/408559 */

-- YOUR VARIABLES HERE;
SET @DATE_START = '2010-01-01';
SET @DATE_END = '2020-01-01';

###### small-numbers table
DROP TABLE IF EXISTS numbers_small;
CREATE TABLE numbers_small (number INT);

BosNaufal

import { call } from 'vuex-saga'
import api from '../api'

function *fetchFlow() {
  let [product, other] = yield [call(api.fetchProduct), call(api.otherApis)]
}

BosNaufal

import api from '../api'

function *fetchFlow() {
  let product = yield call(api.fetchProduct)
  let seller = yield call(api.fetchSeller, { product })
  let statistic = yield call(api.statistic, { product, seller })
  let lastFetch = yield call(api.needStatisticProductAndSeller, { statistic, product, seller })
  return lastFetch
}

BosNaufal

import api from '../api'

api.fetchProduct()
.then((product) => {
  return api.fetchSeller(product.id)
  .then((seller) => {
    return api.statistic(product, seller)
    .then((statistic) => {
      return api.needStatisticProductAndSeller(statstic, product, seller)
    })