<template>
  <img :src="svg" :style="style" />
</template>

<script>
  const requireAssets = require.context('../assets', false, /\.svg$/)
  const SVGs = requireAssets.keys().reduce((svgs, path) => {
    const svgFile = requireAssets(path)
    svgs[path.match(/^.*\/(.+?)\.svg$/)[1]] = svgFile
    return svgs
  }, {})
  export default {
    props: ['type'],
    computed: {
      svg () {
        return SVGs[this.type] || {}
      },
      style () {
        if (this.type === 'next') {
          return {
            transform: 'rotate(180deg)',
          }
        }
      }
    }
  }
</script>