Pārlūkot izejas kodu

move @joystream/components into atlas app, clean up build process

Klaudiusz Dembler 4 gadi atpakaļ
vecāks
revīzija
b81a2c04f8
100 mainītis faili ar 262 papildinājumiem un 106 dzēšanām
  1. 9 11
      README.md
  2. 1 2
      babel.config.json
  3. 1 35
      package.json
  4. 6 0
      packages/app/.parcelrc
  5. 43 8
      packages/app/package.json
  6. 3 3
      packages/app/src/App.tsx
  7. 1 1
      packages/app/src/components/ChannelGallery.tsx
  8. 1 1
      packages/app/src/components/Hero.tsx
  9. 1 1
      packages/app/src/components/Layout.tsx
  10. 1 1
      packages/app/src/components/SeriesGallery.tsx
  11. 1 1
      packages/app/src/components/TagsGallery.tsx
  12. 1 1
      packages/app/src/components/VideoGallery.tsx
  13. 0 0
      packages/app/src/shared/.storybook/.babelrc
  14. 3 3
      packages/app/src/shared/.storybook/main.js
  15. 0 0
      packages/app/src/shared/.storybook/manager-head.html
  16. 0 0
      packages/app/src/shared/.storybook/preview-head.html
  17. 1 1
      packages/app/src/shared/.storybook/preview.jsx
  18. 1 2
      packages/app/src/shared/.storybook/theme.js
  19. 13 0
      packages/app/src/shared/__tests__/Avatar.test.js
  20. 1 1
      packages/app/src/shared/__tests__/Button.test.js
  21. 0 0
      packages/app/src/shared/__tests__/__snapshots__/Avatar.test.js.snap
  22. 0 0
      packages/app/src/shared/__tests__/__snapshots__/Button.test.js.snap
  23. 1 1
      packages/app/src/shared/components/Avatar/Avatar.style.tsx
  24. 0 0
      packages/app/src/shared/components/Avatar/Avatar.tsx
  25. 0 0
      packages/app/src/shared/components/Avatar/index.tsx
  26. 0 0
      packages/app/src/shared/components/Button/Button.style.ts
  27. 1 1
      packages/app/src/shared/components/Button/Button.tsx
  28. 0 0
      packages/app/src/shared/components/Button/index.ts
  29. 0 0
      packages/app/src/shared/components/Carousel/Carousel.style.ts
  30. 0 0
      packages/app/src/shared/components/Carousel/Carousel.tsx
  31. 0 0
      packages/app/src/shared/components/Carousel/index.ts
  32. 0 0
      packages/app/src/shared/components/ChannelPreview/ChannelPreview.style.tsx
  33. 1 1
      packages/app/src/shared/components/ChannelPreview/ChannelPreview.tsx
  34. 0 0
      packages/app/src/shared/components/ChannelPreview/index.ts
  35. 0 0
      packages/app/src/shared/components/Checkbox/Checkbox.style.ts
  36. 3 4
      packages/app/src/shared/components/Checkbox/Checkbox.tsx
  37. 2 0
      packages/app/src/shared/components/Checkbox/index.ts
  38. 0 0
      packages/app/src/shared/components/Dropdown/Dropdown.style.ts
  39. 3 4
      packages/app/src/shared/components/Dropdown/Dropdown.tsx
  40. 0 0
      packages/app/src/shared/components/Dropdown/index.ts
  41. 0 0
      packages/app/src/shared/components/Gallery/Gallery.style.ts
  42. 0 0
      packages/app/src/shared/components/Gallery/Gallery.tsx
  43. 3 0
      packages/app/src/shared/components/Gallery/index.ts
  44. 0 0
      packages/app/src/shared/components/GlobalStyle/GlobalStyle.tsx
  45. 0 0
      packages/app/src/shared/components/GlobalStyle/index.ts
  46. 0 0
      packages/app/src/shared/components/Grid/Grid.style.ts
  47. 0 0
      packages/app/src/shared/components/Grid/Grid.tsx
  48. 0 0
      packages/app/src/shared/components/Grid/index.ts
  49. 0 0
      packages/app/src/shared/components/HamburgerButton/HamburgerButton.style.ts
  50. 0 0
      packages/app/src/shared/components/HamburgerButton/HamburgerButton.tsx
  51. 0 0
      packages/app/src/shared/components/HamburgerButton/index.ts
  52. 0 0
      packages/app/src/shared/components/Header/Header.style.ts
  53. 0 0
      packages/app/src/shared/components/Header/Header.tsx
  54. 0 0
      packages/app/src/shared/components/Header/index.ts
  55. 0 0
      packages/app/src/shared/components/Link/Link.style.ts
  56. 0 0
      packages/app/src/shared/components/Link/Link.tsx
  57. 0 0
      packages/app/src/shared/components/Link/index.ts
  58. 0 0
      packages/app/src/shared/components/NavButton/NavButton.style.ts
  59. 2 3
      packages/app/src/shared/components/NavButton/NavButton.tsx
  60. 0 0
      packages/app/src/shared/components/NavButton/index.ts
  61. 0 0
      packages/app/src/shared/components/RadioButton/RadioButton.style.ts
  62. 0 0
      packages/app/src/shared/components/RadioButton/RadioButton.tsx
  63. 0 0
      packages/app/src/shared/components/RadioButton/index.ts
  64. 0 0
      packages/app/src/shared/components/SeriesPreview/SeriesPreview.style.tsx
  65. 0 0
      packages/app/src/shared/components/SeriesPreview/SeriesPreview.tsx
  66. 0 0
      packages/app/src/shared/components/SeriesPreview/index.ts
  67. 18 17
      packages/app/src/shared/components/Sidenav/Sidenav.style.ts
  68. 0 0
      packages/app/src/shared/components/Sidenav/Sidenav.tsx
  69. 0 0
      packages/app/src/shared/components/Sidenav/index.ts
  70. 0 0
      packages/app/src/shared/components/Tabs/Tab.tsx
  71. 0 0
      packages/app/src/shared/components/Tabs/Tabs.style.ts
  72. 0 0
      packages/app/src/shared/components/Tabs/Tabs.tsx
  73. 0 0
      packages/app/src/shared/components/Tabs/index.ts
  74. 0 0
      packages/app/src/shared/components/Tag/Tag.style.ts
  75. 0 0
      packages/app/src/shared/components/Tag/Tag.tsx
  76. 0 0
      packages/app/src/shared/components/Tag/index.ts
  77. 0 0
      packages/app/src/shared/components/TagButton/TagButton.style.ts
  78. 0 0
      packages/app/src/shared/components/TagButton/TagButton.tsx
  79. 0 0
      packages/app/src/shared/components/TagButton/index.ts
  80. 0 0
      packages/app/src/shared/components/TextField/TextField.style.ts
  81. 0 0
      packages/app/src/shared/components/TextField/TextField.tsx
  82. 0 0
      packages/app/src/shared/components/TextField/index.ts
  83. 113 0
      packages/app/src/shared/components/Typography/Typography.style.ts
  84. 0 0
      packages/app/src/shared/components/Typography/Typography.tsx
  85. 0 0
      packages/app/src/shared/components/Typography/index.ts
  86. 0 0
      packages/app/src/shared/components/VideoPlayer/VideoPlayer.style.tsx
  87. 0 0
      packages/app/src/shared/components/VideoPlayer/VideoPlayer.tsx
  88. 0 0
      packages/app/src/shared/components/VideoPlayer/index.tsx
  89. 3 3
      packages/app/src/shared/components/VideoPreview/VideoPreview.styles.tsx
  90. 0 0
      packages/app/src/shared/components/VideoPreview/VideoPreview.tsx
  91. 0 0
      packages/app/src/shared/components/VideoPreview/index.tsx
  92. 24 0
      packages/app/src/shared/components/index.ts
  93. 0 0
      packages/app/src/shared/icons/bars-play.svg
  94. 0 0
      packages/app/src/shared/icons/bars-plus.svg
  95. 0 0
      packages/app/src/shared/icons/bars.svg
  96. 0 0
      packages/app/src/shared/icons/binocular.svg
  97. 0 0
      packages/app/src/shared/icons/block-large.svg
  98. 0 0
      packages/app/src/shared/icons/block.svg
  99. 0 0
      packages/app/src/shared/icons/books.svg
  100. 0 0
      packages/app/src/shared/icons/browse.svg

+ 9 - 11
README.md

@@ -10,13 +10,13 @@ $ yarn start
 
 
 To start the app on `localhost:1234`, Storybook on `localhost:6006` and the bundler in watch mode.
 To start the app on `localhost:1234`, Storybook on `localhost:6006` and the bundler in watch mode.
 
 
-To build both the component package and the app together, run
+To build the app for distribution, run:
 
 
 ```bash
 ```bash
 $ yarn build
 $ yarn build
 ```
 ```
 
 
-To run tests (Currently WIP) run
+To run tests (Currently WIP) run:
 
 
 ```bash
 ```bash
 $ yarn test
 $ yarn test
@@ -24,7 +24,6 @@ $ yarn test
 
 
 ## Packages
 ## Packages
 
 
-This monorepo consists of two packages, `app` and `@joystream/components` (the components package).
 This repo is managed with [yarn workspaces](https://classic.yarnpkg.com/en/docs/workspaces/)
 This repo is managed with [yarn workspaces](https://classic.yarnpkg.com/en/docs/workspaces/)
 
 
 To run a command in a workspace:
 To run a command in a workspace:
@@ -33,22 +32,21 @@ To run a command in a workspace:
 $ yarn workspace YOUR_WORKSPACE_NAME YOUR_COMMAND
 $ yarn workspace YOUR_WORKSPACE_NAME YOUR_COMMAND
 ```
 ```
 
 
-For example, to add `react-spring` to `@joystream/components`:
+For example, to add `react-spring` to `atlas-app`:
 
 
 ```bash
 ```bash
-$ yarn workspace @joystream/components add react-spring
+$ yarn workspace atlas-app add react-spring
 ```
 ```
 
 
-### Components Package
-
-The components package is located under `./packages/components` and can is usually referenced by `@joystream/components`.
-It is, as the name suggests, a component library and everything related to components and atomic parts of the UI belongs here.
-
 ### App package
 ### App package
 
 
-The components package is located under `./packages/app` and is where the actual Atlas application lives.
+The app package is located under `./packages/app` and is where the actual Atlas application lives.
 Business logic, full pages and data fetching should all reside here.
 Business logic, full pages and data fetching should all reside here.
 
 
+### Shared folder
+
+Historically, Atlas codebase was split between two packages - `app` and `@joystream/components`. Due to build process and developer experience issues it was decided to merge those packages into one until the separation is actually needed. Hence the `shared` directory under `app/src`. This folder is what used to be `@joystream/components` and it's intended to be application-agnostic. That means no Atlas-specific logic (like routing) should be put there, only atomic UI components.
+
 ## Deploy Previews
 ## Deploy Previews
 
 
 Each PR has deploy previews for both for Storybook and for the App on Chromia and Netlify respectively.
 Each PR has deploy previews for both for Storybook and for the App on Chromia and Netlify respectively.

+ 1 - 2
babel.config.json

@@ -4,6 +4,5 @@
 		"@babel/preset-react",
 		"@babel/preset-react",
 		"@babel/preset-typescript",
 		"@babel/preset-typescript",
 		"@emotion/babel-preset-css-prop"
 		"@emotion/babel-preset-css-prop"
-	],
-	"babelrcRoots": ["*", "packages/*"]
+	]
 }
 }

+ 1 - 35
package.json

@@ -8,7 +8,7 @@
 		"start": "concurrently \"yarn dev\" \"yarn storybook\"",
 		"start": "concurrently \"yarn dev\" \"yarn storybook\"",
 		"build": "lerna run build",
 		"build": "lerna run build",
 		"dev": "lerna run --parallel dev",
 		"dev": "lerna run --parallel dev",
-		"storybook": "lerna run --scope @joystream/components --stream storybook",
+		"storybook": "lerna run --scope atlas-app --stream storybook",
 		"clean": "lerna clean && rm -rf node_modules",
 		"clean": "lerna clean && rm -rf node_modules",
 		"test": "jest"
 		"test": "jest"
 	},
 	},
@@ -24,36 +24,9 @@
 		"@babel/preset-react": "^7.8.3",
 		"@babel/preset-react": "^7.8.3",
 		"@babel/preset-typescript": "^7.9.0",
 		"@babel/preset-typescript": "^7.9.0",
 		"@emotion/babel-preset-css-prop": "^10.0.27",
 		"@emotion/babel-preset-css-prop": "^10.0.27",
-		"@fortawesome/fontawesome-svg-core": "^1.2.28",
-		"@fortawesome/free-solid-svg-icons": "^5.13.0",
-		"@fortawesome/react-fontawesome": "^0.1.9",
-		"@parcel/transformer-svg-react": "^2.0.0-nightly.1739",
-		"@rollup/plugin-babel": "^5.0.3",
-		"@rollup/plugin-commonjs": "^11.0.2",
-		"@rollup/plugin-node-resolve": "^7.1.1",
-		"@storybook/addon-actions": "^5.3.17",
-		"@storybook/addon-docs": "^5.3.17",
-		"@storybook/addon-knobs": "^5.3.17",
-		"@storybook/addon-links": "^5.3.17",
-		"@storybook/addon-storysource": "^5.3.17",
-		"@storybook/addons": "^5.3.19",
-		"@storybook/react": "^5.3.17",
-		"@storybook/theming": "^5.3.19",
-		"@svgr/rollup": "^5.4.0",
-		"@svgr/webpack": "^5.4.0",
-		"@types/reach__router": "^1.3.5",
-		"@types/react": "^16.9.36",
-		"@types/react-dom": "^16.9.8",
-		"@types/react-redux": "^7.1.9",
-		"@types/redux": "^3.6.0",
 		"@typescript-eslint/eslint-plugin": "^3.2.0",
 		"@typescript-eslint/eslint-plugin": "^3.2.0",
 		"@typescript-eslint/parser": "^3.2.0",
 		"@typescript-eslint/parser": "^3.2.0",
-		"babel-core": "^6.26.3",
 		"babel-loader": "^8.0.6",
 		"babel-loader": "^8.0.6",
-		"babel-plugin-transform-export-extensions": "^6.22.0",
-		"babel-preset-env": "^1.7.0",
-		"babel-preset-react": "^6.24.1",
-		"chromatic": "^4.0.3",
 		"concurrently": "^5.2.0",
 		"concurrently": "^5.2.0",
 		"csstype": "^2.6.10",
 		"csstype": "^2.6.10",
 		"enzyme": "^3.11.0",
 		"enzyme": "^3.11.0",
@@ -67,14 +40,7 @@
 		"jest": "^26.0.1",
 		"jest": "^26.0.1",
 		"lerna": "^3.20.2",
 		"lerna": "^3.20.2",
 		"lint-staged": "^10.2.7",
 		"lint-staged": "^10.2.7",
-		"parcel": "^2.0.0-alpha.3.2",
 		"prettier": "^2.0.5",
 		"prettier": "^2.0.5",
-		"react-docgen-typescript-loader": "^3.7.1",
-		"rollup": "^2.1.0",
-		"rollup-plugin-babel": "^4.4.0",
-		"rollup-plugin-peer-deps-external": "^2.2.2",
-		"rollup-plugin-typescript2": "^0.26.0",
-		"storybook-addon-jsx": "^7.1.15",
 		"ts-loader": "^6.2.1",
 		"ts-loader": "^6.2.1",
 		"typescript": "^3.8.3"
 		"typescript": "^3.8.3"
 	}
 	}

+ 6 - 0
packages/app/.parcelrc

@@ -0,0 +1,6 @@
+{
+  "extends": "@parcel/config-default",
+  "transformers": {
+    "*.svg": ["@parcel/transformer-svgo", "@parcel/transformer-svg-react"]
+  }
+}

+ 43 - 8
packages/app/package.json

@@ -1,10 +1,10 @@
 {
 {
-	"name": "app",
+	"name": "atlas-app",
 	"version": "1.0.0",
 	"version": "1.0.0",
 	"description": "A user governed video platform",
 	"description": "A user governed video platform",
-	"homepage": "https://github.com/Joystream/atlas#readme",
+	"homepage": "https://github.com/Joystream/joystream/tree/init_atlas/atlas",
 	"license": "ISC",
 	"license": "ISC",
-	"main": "src/app.js",
+	"main": "../../dist/app.html",
 	"directories": {
 	"directories": {
 		"src": "src",
 		"src": "src",
 		"test": "__tests__"
 		"test": "__tests__"
@@ -14,25 +14,60 @@
 	],
 	],
 	"repository": {
 	"repository": {
 		"type": "git",
 		"type": "git",
-		"url": "https://github.com/Joystream/atlas.git"
+		"url": "https://github.com/Joystream/joystream.git"
 	},
 	},
 	"scripts": {
 	"scripts": {
 		"start": "parcel public/index.html",
 		"start": "parcel public/index.html",
 		"build": "parcel build public/index.html",
 		"build": "parcel build public/index.html",
 		"dev": "parcel public/index.html",
 		"dev": "parcel public/index.html",
-		"test": "echo \"Error: run tests from root\" && exit 1"
+		"storybook": "start-storybook -p 6006 -c src/shared/.storybook",
+		"build-storybook": "build-storybook -c src/shared/.storybook",
+		"test": "echo \"Error: run tests from root\" && exit 1",
+		"chromatic": "chromatic --project-token=qq8aetz26u"
 	},
 	},
 	"bugs": {
 	"bugs": {
-		"url": "https://github.com/Joystream/atlas/issues"
+		"url": "https://github.com/Joystream/joystream/issues"
 	},
 	},
 	"dependencies": {
 	"dependencies": {
 		"@emotion/core": "^10.0.28",
 		"@emotion/core": "^10.0.28",
-		"@joystream/components": "1.0.0",
 		"@reach/router": "^1.3.3",
 		"@reach/router": "^1.3.3",
+		"@types/reach__router": "^1.3.5",
+		"@types/react": "^16.9.36",
+		"@types/react-dom": "^16.9.8",
+		"@types/react-redux": "^7.1.9",
+		"@types/redux": "^3.6.0",
 		"emotion-normalize": "^10.1.0",
 		"emotion-normalize": "^10.1.0",
 		"react": "^16.13.1",
 		"react": "^16.13.1",
 		"react-dom": "^16.13.1",
 		"react-dom": "^16.13.1",
 		"react-redux": "^7.2.0",
 		"react-redux": "^7.2.0",
-		"redux": "^4.0.5"
+		"redux": "^4.0.5",
+		"react-player": "^2.2.0",
+		"react-spring": "^8.0.27",
+		"use-resize-observer": "^6.1.0",
+		"chromatic": "^4.0.3",
+		"react-docgen-typescript-loader": "^3.7.1",
+		"storybook-addon-jsx": "^7.1.15",
+		"parcel": "^2.0.0-beta.1",
+		"@fortawesome/fontawesome-svg-core": "^1.2.28",
+		"@fortawesome/free-solid-svg-icons": "^5.13.0",
+		"@fortawesome/react-fontawesome": "^0.1.9",
+		"@parcel/transformer-svg-react": "^2.0.0-nightly.1739",
+		"@parcel/transformer-svgo": "^2.0.0-nightly.1739",
+		"@storybook/addon-actions": "^5.3.17",
+		"@storybook/addon-docs": "^5.3.17",
+		"@storybook/addon-knobs": "^5.3.17",
+		"@storybook/addon-links": "^5.3.17",
+		"@storybook/addon-storysource": "^5.3.17",
+		"@storybook/addons": "^5.3.19",
+		"@storybook/react": "^5.3.17",
+		"@storybook/theming": "^5.3.19",
+		"@svgr/webpack": "^5.4.0"
+	},
+	"alias": {
+		"components": "./src/components",
+		"shared": "./src/shared",
+		"store": "./src/store",
+		"theme": "./src/theme",
+		"views": "./src/views"
 	}
 	}
 }
 }

+ 3 - 3
packages/app/src/App.tsx

@@ -2,9 +2,9 @@ import React from "react";
 import { Provider } from "react-redux";
 import { Provider } from "react-redux";
 import { Router } from "@reach/router";
 import { Router } from "@reach/router";
 
 
-import store from "./store";
-import { Layout } from "./components";
-import HomeView from "app/src/views/HomeView";
+import store from "store";
+import { Layout } from "components";
+import { HomeView } from "views";
 
 
 export default function App() {
 export default function App() {
 	return (
 	return (

+ 1 - 1
packages/app/src/components/ChannelGallery.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import React from "react";
 import { css } from "@emotion/core";
 import { css } from "@emotion/core";
-import { ChannelPreview, Gallery } from "@joystream/components";
+import { ChannelPreview, Gallery } from "shared/components";
 
 
 const channels = [
 const channels = [
 	{
 	{

+ 1 - 1
packages/app/src/components/Hero.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import React from "react";
 import { css } from "@emotion/core";
 import { css } from "@emotion/core";
-import { Header, Button } from "@joystream/components";
+import { Button, Header } from "shared/components";
 
 
 type HeroProps = {
 type HeroProps = {
 	backgroundImg: string;
 	backgroundImg: string;

+ 1 - 1
packages/app/src/components/Layout.tsx

@@ -1,5 +1,5 @@
 import React from "react";
 import React from "react";
-import { GlobalStyle } from "@joystream/components";
+import { GlobalStyle } from "shared/components";
 
 
 const Layout: React.FC = ({ children }) => (
 const Layout: React.FC = ({ children }) => (
 	<main>
 	<main>

+ 1 - 1
packages/app/src/components/SeriesGallery.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import React from "react";
 import { css } from "@emotion/core";
 import { css } from "@emotion/core";
-import { Gallery, SeriesPreview } from "@joystream/components";
+import { Gallery, SeriesPreview } from "shared/components";
 
 
 type SeriesGalleryProps = {
 type SeriesGalleryProps = {
 	title: string;
 	title: string;

+ 1 - 1
packages/app/src/components/TagsGallery.tsx

@@ -1,5 +1,5 @@
 import React from "react";
 import React from "react";
-import { TagButton, Gallery } from "@joystream/components";
+import { Gallery, TagButton } from "shared/components";
 
 
 const tags = [
 const tags = [
 	"finance",
 	"finance",

+ 1 - 1
packages/app/src/components/VideoGallery.tsx

@@ -1,7 +1,7 @@
 import React, { useCallback, useState } from "react";
 import React, { useCallback, useState } from "react";
 import { css, SerializedStyles } from "@emotion/core";
 import { css, SerializedStyles } from "@emotion/core";
 
 
-import { Gallery, VideoPreview } from "@joystream/components";
+import { Gallery, VideoPreview } from "shared/components";
 
 
 type VideoGalleryProps = {
 type VideoGalleryProps = {
 	title: string;
 	title: string;

+ 0 - 0
packages/components/.storybook/.babelrc → packages/app/src/shared/.storybook/.babelrc


+ 3 - 3
packages/components/.storybook/main.js → packages/app/src/shared/.storybook/main.js

@@ -1,6 +1,6 @@
 const path = require("path");
 const path = require("path");
 
 
-const AssetsDir = path.join(__dirname, "..", "assets");
+const IconsDir = path.join(__dirname, "..", "icons");
 
 
 module.exports = {
 module.exports = {
 	stories: ["../stories/**/*.stories.(js|jsx|ts|tsx|mdx)"],
 	stories: ["../stories/**/*.stories.(js|jsx|ts|tsx|mdx)"],
@@ -15,10 +15,10 @@ module.exports = {
 	webpackFinal: async (config) => {
 	webpackFinal: async (config) => {
 		// Disable the Storybook internal-`.svg`-rule for components loaded from our app.
 		// Disable the Storybook internal-`.svg`-rule for components loaded from our app.
 		const svgRule = config.module.rules.find((rule) => "test.svg".match(rule.test));
 		const svgRule = config.module.rules.find((rule) => "test.svg".match(rule.test));
-		svgRule.exclude = [AssetsDir];
+		svgRule.exclude = [IconsDir];
 		config.module.rules.push({
 		config.module.rules.push({
 			test: /\.svg$/i,
 			test: /\.svg$/i,
-			include: [AssetsDir],
+			include: [IconsDir],
 			use: [
 			use: [
 				{
 				{
 					loader: "@svgr/webpack",
 					loader: "@svgr/webpack",

+ 0 - 0
packages/components/.storybook/manager-head.html → packages/app/src/shared/.storybook/manager-head.html


+ 0 - 0
packages/components/.storybook/preview-head.html → packages/app/src/shared/.storybook/preview-head.html


+ 1 - 1
packages/components/.storybook/preview.jsx → packages/app/src/shared/.storybook/preview.jsx

@@ -4,7 +4,7 @@ import { addDecorator, addParameters } from "@storybook/react";
 import { withKnobs } from "@storybook/addon-knobs";
 import { withKnobs } from "@storybook/addon-knobs";
 import { jsxDecorator } from "storybook-addon-jsx";
 import { jsxDecorator } from "storybook-addon-jsx";
 import theme from "./theme";
 import theme from "./theme";
-import GlobalStyle from "../src/components/GlobalStyle";
+import { GlobalStyle } from "../components";
 
 
 const wrapperStyle = css`
 const wrapperStyle = css`
 	padding: 10px;
 	padding: 10px;

+ 1 - 2
packages/components/.storybook/theme.js → packages/app/src/shared/.storybook/theme.js

@@ -1,6 +1,5 @@
 import { create } from "@storybook/theming/create";
 import { create } from "@storybook/theming/create";
-
-import { colors } from "../src/theme";
+import { colors } from "../theme";
 
 
 export default create({
 export default create({
 	base: "dark",
 	base: "dark",

+ 13 - 0
packages/app/src/shared/__tests__/Avatar.test.js

@@ -0,0 +1,13 @@
+import React from "react"
+import { mount } from "enzyme"
+import Avatar from "../components/Avatar"
+
+describe("Avatar component", () => {
+
+	const component = mount(<Avatar img="https://s3.amazonaws.com/keybase_processed_uploads/9003a57620356bd89d62bd34c7c0c305_360_360.jpg" />)
+
+	it("Should render correctly", () => {
+		expect(component).toMatchSnapshot()
+	})
+
+})

+ 1 - 1
packages/components/__tests__/Button.test.js → packages/app/src/shared/__tests__/Button.test.js

@@ -1,6 +1,6 @@
 import React from "react";
 import React from "react";
 import { mount } from "enzyme";
 import { mount } from "enzyme";
-import Button from "./../src/components/Button";
+import { Button } from "../components";
 
 
 describe("Button component", () => {
 describe("Button component", () => {
 	it("Should render default button correctly", () => {
 	it("Should render default button correctly", () => {

+ 0 - 0
packages/components/__tests__/__snapshots__/Avatar.test.js.snap → packages/app/src/shared/__tests__/__snapshots__/Avatar.test.js.snap


+ 0 - 0
packages/components/__tests__/__snapshots__/Button.test.js.snap → packages/app/src/shared/__tests__/__snapshots__/Button.test.js.snap


+ 1 - 1
packages/components/src/components/Avatar/Avatar.style.tsx → packages/app/src/shared/components/Avatar/Avatar.style.tsx

@@ -1,5 +1,5 @@
 import { makeStyles, StyleFn } from "../../utils";
 import { makeStyles, StyleFn } from "../../utils";
-import { spacing, colors } from "../../theme";
+import { colors, spacing } from "../../theme";
 
 
 export type AvatarStyleProps = {
 export type AvatarStyleProps = {
 	size: "small" | "default" | "large";
 	size: "small" | "default" | "large";

+ 0 - 0
packages/components/src/components/Avatar/Avatar.tsx → packages/app/src/shared/components/Avatar/Avatar.tsx


+ 0 - 0
packages/components/src/components/Avatar/index.tsx → packages/app/src/shared/components/Avatar/index.tsx


+ 0 - 0
packages/components/src/components/Button/Button.style.ts → packages/app/src/shared/components/Button/Button.style.ts


+ 1 - 1
packages/components/src/components/Button/Button.tsx → packages/app/src/shared/components/Button/Button.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import React from "react";
 import { SerializedStyles } from "@emotion/core";
 import { SerializedStyles } from "@emotion/core";
 import { ButtonStyleProps, useCSS } from "./Button.style";
 import { ButtonStyleProps, useCSS } from "./Button.style";
-import BlockIcon from "../../../assets/block.svg";
+import { BlockIcon } from "../../icons";
 
 
 type ButtonProps = {
 type ButtonProps = {
 	children?: React.ReactNode;
 	children?: React.ReactNode;

+ 0 - 0
packages/components/src/components/Button/index.ts → packages/app/src/shared/components/Button/index.ts


+ 0 - 0
packages/components/src/components/Carousel/Carousel.style.ts → packages/app/src/shared/components/Carousel/Carousel.style.ts


+ 0 - 0
packages/components/src/components/Carousel/Carousel.tsx → packages/app/src/shared/components/Carousel/Carousel.tsx


+ 0 - 0
packages/components/src/components/Carousel/index.ts → packages/app/src/shared/components/Carousel/index.ts


+ 0 - 0
packages/components/src/components/ChannelPreview/ChannelPreview.style.tsx → packages/app/src/shared/components/ChannelPreview/ChannelPreview.style.tsx


+ 1 - 1
packages/components/src/components/ChannelPreview/ChannelPreview.tsx → packages/app/src/shared/components/ChannelPreview/ChannelPreview.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import React from "react";
 import { SerializedStyles } from "@emotion/core";
 import { SerializedStyles } from "@emotion/core";
 import { ChannelPreviewStyleProps, useCSS } from "./ChannelPreview.style";
 import { ChannelPreviewStyleProps, useCSS } from "./ChannelPreview.style";
-import Avatar from "../Avatar/Avatar";
+import Avatar from "../Avatar";
 
 
 type ChannelPreviewProps = {
 type ChannelPreviewProps = {
 	views: string;
 	views: string;

+ 0 - 0
packages/components/src/components/ChannelPreview/index.ts → packages/app/src/shared/components/ChannelPreview/index.ts


+ 0 - 0
packages/components/src/components/Checkbox/Checkbox.style.ts → packages/app/src/shared/components/Checkbox/Checkbox.style.ts


+ 3 - 4
packages/components/src/components/Checkbox/Checkbox.tsx → packages/app/src/shared/components/Checkbox/Checkbox.tsx

@@ -1,7 +1,6 @@
-import React, { useState } from "react";
-import { useCSS, CheckboxStyleProps } from "./Checkbox.style";
-import CheckIcon from "../../../assets/check.svg";
-import DashIcon from "../../../assets/dash.svg";
+import React from "react";
+import { CheckboxStyleProps, useCSS } from "./Checkbox.style";
+import { CheckIcon, DashIcon } from "../../icons";
 
 
 type CheckboxProps = {
 type CheckboxProps = {
 	label?: string;
 	label?: string;

+ 2 - 0
packages/app/src/shared/components/Checkbox/index.ts

@@ -0,0 +1,2 @@
+import Checkbox from "./Checkbox";
+export default Checkbox;

+ 0 - 0
packages/components/src/components/Dropdown/Dropdown.style.ts → packages/app/src/shared/components/Dropdown/Dropdown.style.ts


+ 3 - 4
packages/components/src/components/Dropdown/Dropdown.tsx → packages/app/src/shared/components/Dropdown/Dropdown.tsx

@@ -1,8 +1,7 @@
-import React, { useState, useRef, useEffect } from "react";
+import React, { useRef, useState } from "react";
 import { DropdownStyleProps, useCSS } from "./Dropdown.style";
 import { DropdownStyleProps, useCSS } from "./Dropdown.style";
-import ChevronIconUp from "../../../assets/chevron-down-big.svg";
-import ChevronIconDown from "../../../assets/chevron-up-big.svg";
-import { spacing } from "./../../theme";
+import { ChevronIconDown, ChevronIconUp } from "../../icons";
+import { spacing } from "../../theme";
 
 
 type DropdownOption = {
 type DropdownOption = {
 	text: string;
 	text: string;

+ 0 - 0
packages/components/src/components/Dropdown/index.ts → packages/app/src/shared/components/Dropdown/index.ts


+ 0 - 0
packages/components/src/components/Gallery/Gallery.style.ts → packages/app/src/shared/components/Gallery/Gallery.style.ts


+ 0 - 0
packages/components/src/components/Gallery/Gallery.tsx → packages/app/src/shared/components/Gallery/Gallery.tsx


+ 3 - 0
packages/app/src/shared/components/Gallery/index.ts

@@ -0,0 +1,3 @@
+import Gallery from "./Gallery";
+
+export default Gallery;

+ 0 - 0
packages/components/src/components/GlobalStyle/GlobalStyle.tsx → packages/app/src/shared/components/GlobalStyle/GlobalStyle.tsx


+ 0 - 0
packages/components/src/components/GlobalStyle/index.ts → packages/app/src/shared/components/GlobalStyle/index.ts


+ 0 - 0
packages/components/src/components/Grid/Grid.style.ts → packages/app/src/shared/components/Grid/Grid.style.ts


+ 0 - 0
packages/components/src/components/Grid/Grid.tsx → packages/app/src/shared/components/Grid/Grid.tsx


+ 0 - 0
packages/components/src/components/Grid/index.ts → packages/app/src/shared/components/Grid/index.ts


+ 0 - 0
packages/components/src/components/HamburgerButton/HamburgerButton.style.ts → packages/app/src/shared/components/HamburgerButton/HamburgerButton.style.ts


+ 0 - 0
packages/components/src/components/HamburgerButton/HamburgerButton.tsx → packages/app/src/shared/components/HamburgerButton/HamburgerButton.tsx


+ 0 - 0
packages/components/src/components/HamburgerButton/index.ts → packages/app/src/shared/components/HamburgerButton/index.ts


+ 0 - 0
packages/components/src/components/Header/Header.style.ts → packages/app/src/shared/components/Header/Header.style.ts


+ 0 - 0
packages/components/src/components/Header/Header.tsx → packages/app/src/shared/components/Header/Header.tsx


+ 0 - 0
packages/components/src/components/Header/index.ts → packages/app/src/shared/components/Header/index.ts


+ 0 - 0
packages/components/src/components/Link/Link.style.ts → packages/app/src/shared/components/Link/Link.style.ts


+ 0 - 0
packages/components/src/components/Link/Link.tsx → packages/app/src/shared/components/Link/Link.tsx


+ 0 - 0
packages/components/src/components/Link/index.ts → packages/app/src/shared/components/Link/index.ts


+ 0 - 0
packages/components/src/components/NavButton/NavButton.style.ts → packages/app/src/shared/components/NavButton/NavButton.style.ts


+ 2 - 3
packages/components/src/components/NavButton/NavButton.tsx → packages/app/src/shared/components/NavButton/NavButton.tsx

@@ -1,8 +1,7 @@
 import React from "react";
 import React from "react";
 import { SerializedStyles } from "@emotion/core";
 import { SerializedStyles } from "@emotion/core";
-import { useCSS, NavButtonStyleProps } from "./NavButton.style";
-import ChevronRightIcon from "../../../assets/chevron-right-big.svg";
-import ChevronLeftIcon from "../../../assets/chevron-left-big.svg";
+import { NavButtonStyleProps, useCSS } from "./NavButton.style";
+import { ChevronLeftIcon, ChevronRightIcon } from "../../icons";
 
 
 type NavButtonProps = {
 type NavButtonProps = {
 	direction: "right" | "left";
 	direction: "right" | "left";

+ 0 - 0
packages/components/src/components/NavButton/index.ts → packages/app/src/shared/components/NavButton/index.ts


+ 0 - 0
packages/components/src/components/RadioButton/RadioButton.style.ts → packages/app/src/shared/components/RadioButton/RadioButton.style.ts


+ 0 - 0
packages/components/src/components/RadioButton/RadioButton.tsx → packages/app/src/shared/components/RadioButton/RadioButton.tsx


+ 0 - 0
packages/components/src/components/RadioButton/index.ts → packages/app/src/shared/components/RadioButton/index.ts


+ 0 - 0
packages/components/src/components/SeriesPreview/SeriesPreview.style.tsx → packages/app/src/shared/components/SeriesPreview/SeriesPreview.style.tsx


+ 0 - 0
packages/components/src/components/SeriesPreview/SeriesPreview.tsx → packages/app/src/shared/components/SeriesPreview/SeriesPreview.tsx


+ 0 - 0
packages/components/src/components/SeriesPreview/index.ts → packages/app/src/shared/components/SeriesPreview/index.ts


+ 18 - 17
packages/components/src/components/Sidenav/Sidenav.style.ts → packages/app/src/shared/components/Sidenav/Sidenav.style.ts

@@ -1,4 +1,5 @@
-import { theme, utils } from "../..";
+import theme from "../../theme";
+import { makeStyles, StyleFn } from "../../utils";
 
 
 export const SIDENAV_WIDTH = 56;
 export const SIDENAV_WIDTH = 56;
 export const EXPANDED_SIDENAV_WIDTH = 360;
 export const EXPANDED_SIDENAV_WIDTH = 360;
@@ -7,7 +8,7 @@ type SidenavStyleProps = {
 	expanded: boolean;
 	expanded: boolean;
 };
 };
 
 
-const nav: utils.StyleFn = () => ({
+const nav: StyleFn = () => ({
 	position: "fixed",
 	position: "fixed",
 	top: 0,
 	top: 0,
 	left: 0,
 	left: 0,
@@ -26,12 +27,12 @@ const nav: utils.StyleFn = () => ({
 	color: theme.colors.white,
 	color: theme.colors.white,
 });
 });
 
 
-const expandButton: utils.StyleFn = () => ({
+const expandButton: StyleFn = () => ({
 	padding: "7px",
 	padding: "7px",
 	margin: "-4px",
 	margin: "-4px",
 });
 });
 
 
-const drawerOverlay: utils.StyleFn<SidenavStyleProps> = (_, { expanded }) => ({
+const drawerOverlay: StyleFn<SidenavStyleProps> = (_, { expanded }) => ({
 	position: "fixed",
 	position: "fixed",
 	top: 0,
 	top: 0,
 	right: 0,
 	right: 0,
@@ -44,11 +45,11 @@ const drawerOverlay: utils.StyleFn<SidenavStyleProps> = (_, { expanded }) => ({
 	backgroundColor: "rgba(0, 0, 0, 0.5)",
 	backgroundColor: "rgba(0, 0, 0, 0.5)",
 });
 });
 
 
-const navItemsWrapper: utils.StyleFn = () => ({
+const navItemsWrapper: StyleFn = () => ({
 	marginTop: "90px",
 	marginTop: "90px",
 });
 });
 
 
-const navItemContainer: utils.StyleFn = () => ({
+const navItemContainer: StyleFn = () => ({
 	":not(:first-child)": {
 	":not(:first-child)": {
 		marginTop: theme.spacing.xxxl,
 		marginTop: theme.spacing.xxxl,
 	},
 	},
@@ -56,7 +57,7 @@ const navItemContainer: utils.StyleFn = () => ({
 	flexDirection: "column",
 	flexDirection: "column",
 });
 });
 
 
-const navItem: utils.StyleFn = () => ({
+const navItem: StyleFn = () => ({
 	display: "flex",
 	display: "flex",
 	alignItems: "center",
 	alignItems: "center",
 	"> span": {
 	"> span": {
@@ -68,7 +69,7 @@ const navItem: utils.StyleFn = () => ({
 	},
 	},
 });
 });
 
 
-const navSubitemsWrapper: utils.StyleFn = () => ({
+const navSubitemsWrapper: StyleFn = () => ({
 	paddingLeft: `calc(${theme.typography.sizes.icon.xlarge} + ${theme.spacing.xxl})`,
 	paddingLeft: `calc(${theme.typography.sizes.icon.xlarge} + ${theme.spacing.xxl})`,
 	overflow: "hidden",
 	overflow: "hidden",
 	"> div": {
 	"> div": {
@@ -77,7 +78,7 @@ const navSubitemsWrapper: utils.StyleFn = () => ({
 	},
 	},
 });
 });
 
 
-const navSubitem: utils.StyleFn = () => ({
+const navSubitem: StyleFn = () => ({
 	fontSize: theme.typography.sizes.body2,
 	fontSize: theme.typography.sizes.body2,
 	fontFamily: theme.typography.fonts.base,
 	fontFamily: theme.typography.fonts.base,
 	marginTop: theme.spacing.xxl,
 	marginTop: theme.spacing.xxl,
@@ -87,15 +88,15 @@ const navSubitem: utils.StyleFn = () => ({
 });
 });
 
 
 export const useSidenavCSS = (props: SidenavStyleProps) => ({
 export const useSidenavCSS = (props: SidenavStyleProps) => ({
-	nav: utils.makeStyles([nav])(props),
-	expandButton: utils.makeStyles([expandButton])(props),
-	drawerOverlay: utils.makeStyles([drawerOverlay])(props),
-	navItemsWrapper: utils.makeStyles([navItemsWrapper])(props),
+	nav: makeStyles([nav])(props),
+	expandButton: makeStyles([expandButton])(props),
+	drawerOverlay: makeStyles([drawerOverlay])(props),
+	navItemsWrapper: makeStyles([navItemsWrapper])(props),
 });
 });
 
 
 export const useNavItemCSS = (props: SidenavStyleProps) => ({
 export const useNavItemCSS = (props: SidenavStyleProps) => ({
-	navItemContainer: utils.makeStyles([navItemContainer])(props),
-	navItem: utils.makeStyles([navItem])(props),
-	navSubitemsWrapper: utils.makeStyles([navSubitemsWrapper])(props),
-	navSubitem: utils.makeStyles([navSubitem])(props),
+	navItemContainer: makeStyles([navItemContainer])(props),
+	navItem: makeStyles([navItem])(props),
+	navSubitemsWrapper: makeStyles([navSubitemsWrapper])(props),
+	navSubitem: makeStyles([navSubitem])(props),
 });
 });

+ 0 - 0
packages/components/src/components/Sidenav/Sidenav.tsx → packages/app/src/shared/components/Sidenav/Sidenav.tsx


+ 0 - 0
packages/components/src/components/Sidenav/index.ts → packages/app/src/shared/components/Sidenav/index.ts


+ 0 - 0
packages/components/src/components/Tabs/Tab.tsx → packages/app/src/shared/components/Tabs/Tab.tsx


+ 0 - 0
packages/components/src/components/Tabs/Tabs.style.ts → packages/app/src/shared/components/Tabs/Tabs.style.ts


+ 0 - 0
packages/components/src/components/Tabs/Tabs.tsx → packages/app/src/shared/components/Tabs/Tabs.tsx


+ 0 - 0
packages/components/src/components/Tabs/index.ts → packages/app/src/shared/components/Tabs/index.ts


+ 0 - 0
packages/components/src/components/Tag/Tag.style.ts → packages/app/src/shared/components/Tag/Tag.style.ts


+ 0 - 0
packages/components/src/components/Tag/Tag.tsx → packages/app/src/shared/components/Tag/Tag.tsx


+ 0 - 0
packages/components/src/components/Tag/index.ts → packages/app/src/shared/components/Tag/index.ts


+ 0 - 0
packages/components/src/components/TagButton/TagButton.style.ts → packages/app/src/shared/components/TagButton/TagButton.style.ts


+ 0 - 0
packages/components/src/components/TagButton/TagButton.tsx → packages/app/src/shared/components/TagButton/TagButton.tsx


+ 0 - 0
packages/components/src/components/TagButton/index.ts → packages/app/src/shared/components/TagButton/index.ts


+ 0 - 0
packages/components/src/components/TextField/TextField.style.ts → packages/app/src/shared/components/TextField/TextField.style.ts


+ 0 - 0
packages/components/src/components/TextField/TextField.tsx → packages/app/src/shared/components/TextField/TextField.tsx


+ 0 - 0
packages/components/src/components/TextField/index.ts → packages/app/src/shared/components/TextField/index.ts


+ 113 - 0
packages/app/src/shared/components/Typography/Typography.style.ts

@@ -0,0 +1,113 @@
+import { typography, colors, spacing } from "../../theme"
+
+export type TypographyStyleProps = {
+	variant: "hero" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "subtitle1" | "subtitle2" | "body1" | "body2" | "caption" | "overhead"
+}
+
+export let makeStyles = ({
+  variant = "body1"
+}: TypographyStyleProps) => {
+
+	const base = {
+		fontFamily: typography.fonts.base,
+		color: colors.white
+	}
+
+	let specific = {}
+
+	switch(variant) {
+		case "hero":
+			specific = {
+				fontSize: typography.sizes.hero,
+				fontWeight: typography.weights.medium,
+				margin: `${spacing.xxxl} 0`
+			}
+			break
+		case "h1":
+			specific = {
+				fontSize: typography.sizes.h1,
+				fontWeight: typography.weights.medium,
+				margin: `${spacing.xxl} 0`
+			}
+			break
+		case "h2":
+			specific = {
+				fontSize: typography.sizes.h2,
+				fontWeight: typography.weights.medium,
+				margin: `${spacing.xl} 0`
+			}
+			break
+		case "h3":
+			specific = {
+				fontSize: typography.sizes.h3,
+				fontWeight: typography.weights.medium,
+				margin: `${spacing.l} 0`
+			}
+			break
+		case "h4":
+			specific = {
+				fontSize: typography.sizes.h4,
+				fontWeight: typography.weights.medium,
+				margin: `${spacing.l} 0`
+			}
+			break
+		case "h5":
+			specific = {
+				fontSize: typography.sizes.h5,
+				fontWeight: typography.weights.medium,
+				margin: `${spacing.m} 0`
+			}
+			break
+		case "h6":
+			specific = {
+				fontSize: typography.sizes.h6,
+				fontWeight: typography.weights.medium,
+				margin: `${spacing.m} 0`
+			}
+			break
+		case "subtitle1":
+			specific = {
+				fontSize: typography.sizes.subtitle1,
+				fontWeight: typography.weights.light,
+				margin: `${spacing.l} 0`
+			}
+			break
+		case "subtitle2":
+			specific = {
+				fontSize: typography.sizes.subtitle2,
+				fontWeight: typography.weights.regular,
+				margin: `${spacing.m} 0`
+			}
+			break
+		case "body1":
+			specific = {
+				fontSize: typography.sizes.body1,
+				fontWeight: typography.weights.light,
+				margin: `${spacing.s} 0`
+			}
+			break
+		case "body2":
+			specific = {
+				fontSize: typography.sizes.body2,
+				fontWeight: typography.weights.light,
+				margin: `${spacing.xs} 0`
+			}
+			break
+		case "caption":
+			specific = {
+				fontSize: typography.sizes.caption,
+				fontWeight: typography.weights.light,
+				margin: `${spacing.xs} 0`
+			}
+			break
+		case "overhead":
+			specific = {
+				fontSize: typography.sizes.overhead,
+				fontWeight: typography.weights.regular,
+				margin: `${spacing.xs} 0`
+			}
+			break
+	}
+
+	return { ...base, ...specific }
+}

+ 0 - 0
packages/components/src/components/Typography/Typography.tsx → packages/app/src/shared/components/Typography/Typography.tsx


+ 0 - 0
packages/components/src/components/Typography/index.ts → packages/app/src/shared/components/Typography/index.ts


+ 0 - 0
packages/components/src/components/VideoPlayer/VideoPlayer.style.tsx → packages/app/src/shared/components/VideoPlayer/VideoPlayer.style.tsx


+ 0 - 0
packages/components/src/components/VideoPlayer/VideoPlayer.tsx → packages/app/src/shared/components/VideoPlayer/VideoPlayer.tsx


+ 0 - 0
packages/components/src/components/VideoPlayer/index.tsx → packages/app/src/shared/components/VideoPlayer/index.tsx


+ 3 - 3
packages/components/src/components/VideoPreview/VideoPreview.styles.tsx → packages/app/src/shared/components/VideoPreview/VideoPreview.styles.tsx

@@ -1,7 +1,7 @@
 import styled from "@emotion/styled";
 import styled from "@emotion/styled";
-import { colors, spacing, typography } from "./../../theme";
-import Avatar from "components/Avatar";
-import Play from "../../../assets/play.svg";
+import { colors, spacing, typography } from "../../theme";
+import Avatar from "../Avatar";
+import { Play } from "../../icons";
 
 
 const HOVER_BORDER_SIZE = "2px";
 const HOVER_BORDER_SIZE = "2px";
 
 

+ 0 - 0
packages/components/src/components/VideoPreview/VideoPreview.tsx → packages/app/src/shared/components/VideoPreview/VideoPreview.tsx


+ 0 - 0
packages/components/src/components/VideoPreview/index.tsx → packages/app/src/shared/components/VideoPreview/index.tsx


+ 24 - 0
packages/app/src/shared/components/index.ts

@@ -0,0 +1,24 @@
+export { default as Avatar } from "./Avatar";
+export { default as Button } from "./Button";
+export { default as Carousel } from "./Carousel";
+export { default as Dropdown } from "./Dropdown";
+export { default as Grid } from "./Grid";
+export { default as Header } from "./Header";
+export { default as Link } from "./Link";
+export { default as NavButton } from "./NavButton";
+export { default as RadioButton } from "./RadioButton";
+export { default as Checkbox } from "./Checkbox";
+export { default as TagButton } from "./TagButton";
+export { default as Tabs } from "./Tabs";
+export { default as Tab } from "./Tabs/Tab";
+export { default as Tag } from "./Tag";
+export { default as TextField } from "./TextField";
+export { default as Typography } from "./Typography";
+export { default as VideoPreview } from "./VideoPreview";
+export { default as VideoPlayer } from "./VideoPlayer";
+export { default as SeriesPreview } from "./SeriesPreview";
+export { default as ChannelPreview } from "./ChannelPreview";
+export { default as HamburgerButton } from "./HamburgerButton";
+export { default as Gallery } from "./Gallery";
+export { default as Sidenav, SIDENAV_WIDTH, EXPANDED_SIDENAV_WIDTH, NavItem } from "./Sidenav";
+export { default as GlobalStyle } from "./GlobalStyle";

+ 0 - 0
packages/components/assets/bars-play.svg → packages/app/src/shared/icons/bars-play.svg


+ 0 - 0
packages/components/assets/bars-plus.svg → packages/app/src/shared/icons/bars-plus.svg


+ 0 - 0
packages/components/assets/bars.svg → packages/app/src/shared/icons/bars.svg


+ 0 - 0
packages/components/assets/binocular.svg → packages/app/src/shared/icons/binocular.svg


+ 0 - 0
packages/components/assets/block-large.svg → packages/app/src/shared/icons/block-large.svg


+ 0 - 0
packages/components/assets/block.svg → packages/app/src/shared/icons/block.svg


+ 0 - 0
packages/components/assets/books.svg → packages/app/src/shared/icons/books.svg


+ 0 - 0
packages/components/assets/browse.svg → packages/app/src/shared/icons/browse.svg


Daži faili netika attēloti, jo izmaiņu fails ir pārāk liels