1 files changed, 64 insertions, 0 deletions
diff --git a/app/assets/javascripts/usage_quotas/storage/components/project_storage_app.stories.js b/app/assets/javascripts/usage_quotas/storage/components/project_storage_app.stories.js
new file mode 100644
index 00000000000..9bf6d27235c
--- /dev/null
+++ b/app/assets/javascripts/usage_quotas/storage/components/project_storage_app.stories.js
@@ -0,0 +1,64 @@
+import { mockGetProjectStorageStatisticsGraphQLResponse } from 'jest/usage_quotas/storage/mock_data';
+import createMockApollo from 'helpers/mock_apollo_helper';
+import getProjectStorageStatisticsQuery from '../queries/project_storage.query.graphql';
+import ProjectStorageApp from './project_storage_app.vue';
+
+const meta = {
+  title: 'usage_quotas/storage/project_storage_app',
+  component: ProjectStorageApp,
+};
+
+export default meta;
+
+const createTemplate = (config = {}) => {
+  let { provide, apolloProvider } = config;
+
+  if (provide == null) {
+    provide = {};
+  }
+
+  if (apolloProvider == null) {
+    const requestHandlers = [
+      [
+        getProjectStorageStatisticsQuery,
+        () => Promise.resolve(mockGetProjectStorageStatisticsGraphQLResponse),
+      ],
+    ];
+    apolloProvider = createMockApollo(requestHandlers);
+  }
+
+  return (args, { argTypes }) => ({
+    components: { ProjectStorageApp },
+    apolloProvider,
+    provide: {
+      projectPath: '/namespace/project',
+      ...provide,
+    },
+    props: Object.keys(argTypes),
+    template: '<project-storage-app />',
+  });
+};
+
+export const Default = {
+  render: createTemplate(),
+};
+
+export const Loading = {
+  render(...args) {
+    const requestHandlers = [[getProjectStorageStatisticsQuery, () => new Promise(() => {})]];
+    const apolloProvider = createMockApollo(requestHandlers);
+    return createTemplate({
+      apolloProvider,
+    })(...args);
+  },
+};
+
+export const LoadingError = {
+  render(...args) {
+    const requestHandlers = [[getProjectStorageStatisticsQuery, () => Promise.reject()]];
+    const apolloProvider = createMockApollo(requestHandlers);
+    return createTemplate({
+      apolloProvider,
+    })(...args);
+  },
+};