From 8fae92267e3c9a5e9b46c47e689e36b59ca424c5 Mon Sep 17 00:00:00 2001 From: Ian Minoso Date: Fri, 28 Oct 2016 18:39:34 -0400 Subject: [PATCH 1/6] create all components for new repo page --- static/js/app.tsx | 14 ++++++++++++-- .../{component.tsx => publicRepo/header.tsx} | 2 +- .../js/directives/components/publicRepo/main.tsx | 10 ++++++++++ .../directives/components/publicRepo/sidebar.tsx | 10 ++++++++++ static/js/pages/repo-view.js | 5 ----- static/partials/repo-view.html | 4 +++- 6 files changed, 36 insertions(+), 9 deletions(-) rename static/js/directives/components/{component.tsx => publicRepo/header.tsx} (71%) create mode 100644 static/js/directives/components/publicRepo/main.tsx create mode 100644 static/js/directives/components/publicRepo/sidebar.tsx diff --git a/static/js/app.tsx b/static/js/app.tsx index b59f05101..4f5bc19fe 100644 --- a/static/js/app.tsx +++ b/static/js/app.tsx @@ -1,9 +1,19 @@ import * as React from "react"; import * as angular from "angular"; -import repoHeader from "./directives/components/component"; +import repoHeader from "./directives/components/publicRepo/header"; +import repoSidebar from "./directives/components/publicRepo/sidebar"; +import repoMain from "./directives/components/publicRepo/main"; -angular.module('quayPages').directive('repoHeader', function(reactDirective) { +angular.module('quayPages').directive('rpHeader', function(reactDirective) { return reactDirective(repoHeader); }); +angular.module('quayPages').directive('rpSidebar', function(reactDirective) { + return reactDirective(repoSidebar); +}); + +angular.module('quayPages').directive('rpMain', function(reactDirective) { + return reactDirective(repoMain); +}); + diff --git a/static/js/directives/components/component.tsx b/static/js/directives/components/publicRepo/header.tsx similarity index 71% rename from static/js/directives/components/component.tsx rename to static/js/directives/components/publicRepo/header.tsx index 0c5b6919e..606345da8 100644 --- a/static/js/directives/components/component.tsx +++ b/static/js/directives/components/publicRepo/header.tsx @@ -2,7 +2,7 @@ import * as React from "react"; class repoHeader extends React.Component<{}, {}> { render () { - return

The component for the header

; + return
The component for the header
; } } diff --git a/static/js/directives/components/publicRepo/main.tsx b/static/js/directives/components/publicRepo/main.tsx new file mode 100644 index 000000000..e3ff322db --- /dev/null +++ b/static/js/directives/components/publicRepo/main.tsx @@ -0,0 +1,10 @@ +import * as React from "react"; + +class main extends React.Component<{}, {}> { + render () { + return
The component for the main content
; + } +} + +export default main; + diff --git a/static/js/directives/components/publicRepo/sidebar.tsx b/static/js/directives/components/publicRepo/sidebar.tsx new file mode 100644 index 000000000..d2218f90e --- /dev/null +++ b/static/js/directives/components/publicRepo/sidebar.tsx @@ -0,0 +1,10 @@ +import * as React from "react"; + +class repo_sidebar extends React.Component<{}, {}> { + render () { + return
The component for the sidebar
; + } +} + +export default repo_sidebar; + diff --git a/static/js/pages/repo-view.js b/static/js/pages/repo-view.js index 09beb7d3b..3810f294c 100644 --- a/static/js/pages/repo-view.js +++ b/static/js/pages/repo-view.js @@ -11,11 +11,6 @@ }]); function RepoViewCtrl($scope, $routeParams, $location, $timeout, ApiService, UserService, AngularPollChannel, ImageLoaderService, CookieService) { - $scope.reactProps = { - firstProp: 'Prop 1', - secondProp: 'Prop 2' - }; - $scope.namespace = $routeParams.namespace; $scope.name = $routeParams.name; diff --git a/static/partials/repo-view.html b/static/partials/repo-view.html index f3da86092..b52440eab 100644 --- a/static/partials/repo-view.html +++ b/static/partials/repo-view.html @@ -5,7 +5,9 @@
- + + +
From 2383609c151ef828f43744d0bd50e2cdb7a1517a Mon Sep 17 00:00:00 2001 From: Ian Minoso Date: Mon, 31 Oct 2016 15:44:55 -0400 Subject: [PATCH 2/6] Create individual directory for each page --- static/js/app.tsx | 21 ++----------------- .../components/publicRepo/publicRepo.tsx | 21 +++++++++++++++++++ 2 files changed, 23 insertions(+), 19 deletions(-) create mode 100644 static/js/directives/components/publicRepo/publicRepo.tsx diff --git a/static/js/app.tsx b/static/js/app.tsx index 4f5bc19fe..83b4fae76 100644 --- a/static/js/app.tsx +++ b/static/js/app.tsx @@ -1,19 +1,2 @@ -import * as React from "react"; -import * as angular from "angular"; - -import repoHeader from "./directives/components/publicRepo/header"; -import repoSidebar from "./directives/components/publicRepo/sidebar"; -import repoMain from "./directives/components/publicRepo/main"; - -angular.module('quayPages').directive('rpHeader', function(reactDirective) { - return reactDirective(repoHeader); -}); - -angular.module('quayPages').directive('rpSidebar', function(reactDirective) { - return reactDirective(repoSidebar); -}); - -angular.module('quayPages').directive('rpMain', function(reactDirective) { - return reactDirective(repoMain); -}); - +import publicRepo from "./directives/components/publicRepo/publicRepo"; +publicRepo(); diff --git a/static/js/directives/components/publicRepo/publicRepo.tsx b/static/js/directives/components/publicRepo/publicRepo.tsx new file mode 100644 index 000000000..a6369c4b1 --- /dev/null +++ b/static/js/directives/components/publicRepo/publicRepo.tsx @@ -0,0 +1,21 @@ +import * as angular from "angular"; + +import repoHeader from "./header"; +import repoSidebar from "./sidebar"; +import repoMain from "./main"; + +var publicRepo = function(){ + angular.module('quayPages').directive('rpHeader', function(reactDirective) { + return reactDirective(repoHeader); + }); + + angular.module('quayPages').directive('rpSidebar', function(reactDirective) { + return reactDirective(repoSidebar); + }); + + angular.module('quayPages').directive('rpMain', function(reactDirective) { + return reactDirective(repoMain); + }); +} + +export default publicRepo; From 9653cad53cde69b174ee645bd59c693485ffaedd Mon Sep 17 00:00:00 2001 From: Ian Minoso Date: Mon, 31 Oct 2016 16:21:45 -0400 Subject: [PATCH 3/6] Namespace page directories --- static/js/app.tsx | 6 ++++-- .../body.tsx} | 4 ++-- .../header.tsx | 0 .../components/components-repo-page/main.tsx | 18 ++++++++++++++++ .../sidebar.tsx | 0 .../components/publicRepo/publicRepo.tsx | 21 ------------------- tslint.json | 5 +++++ 7 files changed, 29 insertions(+), 25 deletions(-) rename static/js/directives/components/{publicRepo/main.tsx => components-repo-page/body.tsx} (63%) rename static/js/directives/components/{publicRepo => components-repo-page}/header.tsx (100%) create mode 100644 static/js/directives/components/components-repo-page/main.tsx rename static/js/directives/components/{publicRepo => components-repo-page}/sidebar.tsx (100%) delete mode 100644 static/js/directives/components/publicRepo/publicRepo.tsx create mode 100644 tslint.json diff --git a/static/js/app.tsx b/static/js/app.tsx index 83b4fae76..fd3049bf4 100644 --- a/static/js/app.tsx +++ b/static/js/app.tsx @@ -1,2 +1,4 @@ -import publicRepo from "./directives/components/publicRepo/publicRepo"; -publicRepo(); +import publicRepoDirectives from "./directives/components/components-repo-page/main"; + +// Init for each page +publicRepoDirectives(); diff --git a/static/js/directives/components/publicRepo/main.tsx b/static/js/directives/components/components-repo-page/body.tsx similarity index 63% rename from static/js/directives/components/publicRepo/main.tsx rename to static/js/directives/components/components-repo-page/body.tsx index e3ff322db..6b145c0b1 100644 --- a/static/js/directives/components/publicRepo/main.tsx +++ b/static/js/directives/components/components-repo-page/body.tsx @@ -1,10 +1,10 @@ import * as React from "react"; -class main extends React.Component<{}, {}> { +class body extends React.Component<{}, {}> { render () { return
The component for the main content
; } } -export default main; +export default body; diff --git a/static/js/directives/components/publicRepo/header.tsx b/static/js/directives/components/components-repo-page/header.tsx similarity index 100% rename from static/js/directives/components/publicRepo/header.tsx rename to static/js/directives/components/components-repo-page/header.tsx diff --git a/static/js/directives/components/components-repo-page/main.tsx b/static/js/directives/components/components-repo-page/main.tsx new file mode 100644 index 000000000..0243590d6 --- /dev/null +++ b/static/js/directives/components/components-repo-page/main.tsx @@ -0,0 +1,18 @@ +import * as angular from "angular"; + +import repoHeader from "./header"; +import repoSidebar from "./sidebar"; +import repoMain from "./body"; + +angular.module('quayPages').directive('rpHeader', function(reactDirective) { + return reactDirective(repoHeader); +}); + +angular.module('quayPages').directive('rpSidebar', function(reactDirective) { + return reactDirective(repoSidebar); +}); + +angular.module('quayPages').directive('rpMain', function(reactDirective) { + return reactDirective(repoMain); +}); + \ No newline at end of file diff --git a/static/js/directives/components/publicRepo/sidebar.tsx b/static/js/directives/components/components-repo-page/sidebar.tsx similarity index 100% rename from static/js/directives/components/publicRepo/sidebar.tsx rename to static/js/directives/components/components-repo-page/sidebar.tsx diff --git a/static/js/directives/components/publicRepo/publicRepo.tsx b/static/js/directives/components/publicRepo/publicRepo.tsx deleted file mode 100644 index a6369c4b1..000000000 --- a/static/js/directives/components/publicRepo/publicRepo.tsx +++ /dev/null @@ -1,21 +0,0 @@ -import * as angular from "angular"; - -import repoHeader from "./header"; -import repoSidebar from "./sidebar"; -import repoMain from "./main"; - -var publicRepo = function(){ - angular.module('quayPages').directive('rpHeader', function(reactDirective) { - return reactDirective(repoHeader); - }); - - angular.module('quayPages').directive('rpSidebar', function(reactDirective) { - return reactDirective(repoSidebar); - }); - - angular.module('quayPages').directive('rpMain', function(reactDirective) { - return reactDirective(repoMain); - }); -} - -export default publicRepo; diff --git a/tslint.json b/tslint.json new file mode 100644 index 000000000..10a4b36d3 --- /dev/null +++ b/tslint.json @@ -0,0 +1,5 @@ +{ + "rules": { + "no-default-export": true + } +} \ No newline at end of file From f92551a9d1daca04cfe2ca358b5e700b642a3617 Mon Sep 17 00:00:00 2001 From: Ian Minoso Date: Tue, 1 Nov 2016 02:51:18 -0400 Subject: [PATCH 4/6] Named imports --- static/js/app.tsx | 4 ++-- .../components/components-repo-page/main.tsx | 21 +++++++++++-------- 2 files changed, 14 insertions(+), 11 deletions(-) diff --git a/static/js/app.tsx b/static/js/app.tsx index fd3049bf4..a4aa88c6e 100644 --- a/static/js/app.tsx +++ b/static/js/app.tsx @@ -1,4 +1,4 @@ -import publicRepoDirectives from "./directives/components/components-repo-page/main"; +import {rpDirectives as publicRepo} from "./directives/components/components-repo-page/main"; // Init for each page -publicRepoDirectives(); +publicRepo(); diff --git a/static/js/directives/components/components-repo-page/main.tsx b/static/js/directives/components/components-repo-page/main.tsx index 0243590d6..f26f58c09 100644 --- a/static/js/directives/components/components-repo-page/main.tsx +++ b/static/js/directives/components/components-repo-page/main.tsx @@ -4,15 +4,18 @@ import repoHeader from "./header"; import repoSidebar from "./sidebar"; import repoMain from "./body"; -angular.module('quayPages').directive('rpHeader', function(reactDirective) { - return reactDirective(repoHeader); -}); +export function rpDirectives(){ + angular.module('quayPages').directive('rpHeader', function(reactDirective) { + return reactDirective(repoHeader); + }); -angular.module('quayPages').directive('rpSidebar', function(reactDirective) { - return reactDirective(repoSidebar); -}); + angular.module('quayPages').directive('rpSidebar', function(reactDirective) { + return reactDirective(repoSidebar); + }); + + angular.module('quayPages').directive('rpMain', function(reactDirective) { + return reactDirective(repoMain); + }); +} -angular.module('quayPages').directive('rpMain', function(reactDirective) { - return reactDirective(repoMain); -}); \ No newline at end of file From 8d233ca493e2bf759809e259ddac20c92dda81d1 Mon Sep 17 00:00:00 2001 From: Ian Minoso Date: Tue, 1 Nov 2016 14:28:27 -0400 Subject: [PATCH 5/6] Organize directories and path --- static/js/app.tsx | 4 ++-- .../{components-repo-page => pages/repo-page}/body.tsx | 0 .../{components-repo-page => pages/repo-page}/header.tsx | 0 .../{components-repo-page => pages/repo-page}/main.tsx | 0 .../{components-repo-page => pages/repo-page}/sidebar.tsx | 0 5 files changed, 2 insertions(+), 2 deletions(-) rename static/js/directives/components/{components-repo-page => pages/repo-page}/body.tsx (100%) rename static/js/directives/components/{components-repo-page => pages/repo-page}/header.tsx (100%) rename static/js/directives/components/{components-repo-page => pages/repo-page}/main.tsx (100%) rename static/js/directives/components/{components-repo-page => pages/repo-page}/sidebar.tsx (100%) diff --git a/static/js/app.tsx b/static/js/app.tsx index a4aa88c6e..21ccc5298 100644 --- a/static/js/app.tsx +++ b/static/js/app.tsx @@ -1,4 +1,4 @@ -import {rpDirectives as publicRepo} from "./directives/components/components-repo-page/main"; +import {rpDirectives as repoPage} from "./directives/components/pages/repo-page/main"; // Init for each page -publicRepo(); +repoPage(); diff --git a/static/js/directives/components/components-repo-page/body.tsx b/static/js/directives/components/pages/repo-page/body.tsx similarity index 100% rename from static/js/directives/components/components-repo-page/body.tsx rename to static/js/directives/components/pages/repo-page/body.tsx diff --git a/static/js/directives/components/components-repo-page/header.tsx b/static/js/directives/components/pages/repo-page/header.tsx similarity index 100% rename from static/js/directives/components/components-repo-page/header.tsx rename to static/js/directives/components/pages/repo-page/header.tsx diff --git a/static/js/directives/components/components-repo-page/main.tsx b/static/js/directives/components/pages/repo-page/main.tsx similarity index 100% rename from static/js/directives/components/components-repo-page/main.tsx rename to static/js/directives/components/pages/repo-page/main.tsx diff --git a/static/js/directives/components/components-repo-page/sidebar.tsx b/static/js/directives/components/pages/repo-page/sidebar.tsx similarity index 100% rename from static/js/directives/components/components-repo-page/sidebar.tsx rename to static/js/directives/components/pages/repo-page/sidebar.tsx From 71dc3ff633f1a5e7e75c0abd805746fe0de42410 Mon Sep 17 00:00:00 2001 From: Ian Minoso Date: Tue, 1 Nov 2016 14:42:45 -0400 Subject: [PATCH 6/6] Fix import names --- static/js/directives/components/pages/repo-page/main.tsx | 6 +++--- static/js/directives/components/pages/repo-page/sidebar.tsx | 4 ++-- static/partials/repo-view.html | 2 +- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/static/js/directives/components/pages/repo-page/main.tsx b/static/js/directives/components/pages/repo-page/main.tsx index f26f58c09..9db546f49 100644 --- a/static/js/directives/components/pages/repo-page/main.tsx +++ b/static/js/directives/components/pages/repo-page/main.tsx @@ -2,7 +2,7 @@ import * as angular from "angular"; import repoHeader from "./header"; import repoSidebar from "./sidebar"; -import repoMain from "./body"; +import repoBody from "./body"; export function rpDirectives(){ angular.module('quayPages').directive('rpHeader', function(reactDirective) { @@ -13,8 +13,8 @@ export function rpDirectives(){ return reactDirective(repoSidebar); }); - angular.module('quayPages').directive('rpMain', function(reactDirective) { - return reactDirective(repoMain); + angular.module('quayPages').directive('rpBody', function(reactDirective) { + return reactDirective(repoBody); }); } diff --git a/static/js/directives/components/pages/repo-page/sidebar.tsx b/static/js/directives/components/pages/repo-page/sidebar.tsx index d2218f90e..fe51ae950 100644 --- a/static/js/directives/components/pages/repo-page/sidebar.tsx +++ b/static/js/directives/components/pages/repo-page/sidebar.tsx @@ -1,10 +1,10 @@ import * as React from "react"; -class repo_sidebar extends React.Component<{}, {}> { +class repoSidebar extends React.Component<{}, {}> { render () { return
The component for the sidebar
; } } -export default repo_sidebar; +export default repoSidebar; diff --git a/static/partials/repo-view.html b/static/partials/repo-view.html index b52440eab..4a4a368c2 100644 --- a/static/partials/repo-view.html +++ b/static/partials/repo-view.html @@ -7,7 +7,7 @@ - +