web/satellite: request passphrasse on project change. Small styling f…

…ixes WHAT: rerequest passphrase when user selects another project small styling fixes WHY: bakeoff Change-Id: I59da49b3efff1c1a60fbbdc622ae497a1326b347
storj · Apr 16, 2021 · 9cd17fd · 9cd17fd
1 parent b57819f
commit 9cd17fd
Show file tree

Hide file tree

Showing 16 changed files with 34 additions and 30 deletions.
diff --git a/web/satellite/src/components/accessGrants/ConfirmDeletePopup.vue b/web/satellite/src/components/accessGrants/ConfirmDeletePopup.vue
@@ -151,6 +151,7 @@ export default class ConfirmDeletePopup extends Vue {
                 line-height: 21px;
                 text-align: center;
                 color: #000;
+                margin: 20px 0;
             }
 
             &__list-label {
@@ -160,6 +161,7 @@ export default class ConfirmDeletePopup extends Vue {
                 color: #e30011;
                 font-family: 'font_medium', sans-serif;
                 white-space: nowrap;
+                margin-bottom: 30px;
             }
 
             &__list {

diff --git a/web/satellite/src/components/accessGrants/steps/PermissionsStep.vue b/web/satellite/src/components/accessGrants/steps/PermissionsStep.vue
@@ -419,6 +419,7 @@ export default class PermissionsStep extends Vue {
             font-size: 16px;
             line-height: 23px;
             color: #0068dc;
+            margin-top: 20px;
         }
     }
 

diff --git a/web/satellite/src/components/account/ChangePasswordPopup.vue b/web/satellite/src/components/account/ChangePasswordPopup.vue
@@ -197,8 +197,9 @@ export default class ChangePasswordPopup extends Vue {
         font-family: 'font_regular', sans-serif;
     }
 
-    .input-container.full-input {
+    .full-input {
         width: 100%;
+        margin-bottom: 15px;
     }
 
     .change-password-row-container {

diff --git a/web/satellite/src/components/account/EditProfilePopup.vue b/web/satellite/src/components/account/EditProfilePopup.vue
@@ -133,6 +133,7 @@ export default class EditProfilePopup extends Vue {
         flex-direction: row;
         align-content: center;
         justify-content: flex-start;
+        margin-bottom: 20px;
     }
 
     .edit-profile-popup-container {

diff --git a/web/satellite/src/components/account/billing/freeCredits/SortingHeader.vue b/web/satellite/src/components/account/billing/freeCredits/SortingHeader.vue
@@ -35,6 +35,7 @@ export default class SortingHeader extends Vue {}
     .sort-header-container {
         display: flex;
         width: 100%;
+        margin-bottom: 10px;
 
         &__item {
             text-align: left;

diff --git a/web/satellite/src/components/common/HeaderedInput.vue b/web/satellite/src/components/common/HeaderedInput.vue
@@ -98,6 +98,7 @@ export default class HeaderedInput extends HeaderlessInput {
         display: flex;
         justify-content: space-between;
         align-items: center;
+        margin-bottom: 10px;
 
         &__main {
             display: flex;

diff --git a/web/satellite/src/components/errors/Page404.vue b/web/satellite/src/components/errors/Page404.vue
@@ -6,8 +6,8 @@
 <script lang="ts">
 import { Component, Vue } from 'vue-property-decorator';
 
-import MainIcon from '@/../static/images/errors/404.svg';
 import LogoIcon from '@/../static/images/dcs-logo.svg';
+import MainIcon from '@/../static/images/errors/404.svg';
 import TextIcon from '@/../static/images/errors/text.svg';
 
 @Component({

diff --git a/web/satellite/src/components/errors/Page50X.vue b/web/satellite/src/components/errors/Page50X.vue
@@ -6,8 +6,8 @@
 <script lang="ts">
 import { Component, Vue } from 'vue-property-decorator';
 
-import MainIcon from '@/../static/images/errors/50X.svg';
 import LogoIcon from '@/../static/images/dcs-logo.svg';
+import MainIcon from '@/../static/images/errors/50X.svg';
 import TextIcon from '@/../static/images/errors/text.svg';
 
 @Component({

diff --git a/web/satellite/src/components/header/projectsDropdown/ProjectDropdown.vue b/web/satellite/src/components/header/projectsDropdown/ProjectDropdown.vue
@@ -41,6 +41,7 @@ import SelectionIcon from '@/../static/images/header/selection.svg';
 import { RouteConfig } from '@/router';
 import { ACCESS_GRANTS_ACTIONS } from '@/store/modules/accessGrants';
 import { BUCKET_ACTIONS } from '@/store/modules/buckets';
+import { OBJECTS_ACTIONS } from '@/store/modules/objects';
 import { PAYMENTS_ACTIONS } from '@/store/modules/payments';
 import { PROJECTS_ACTIONS } from '@/store/modules/projects';
 import { Project } from '@/types/projects';
@@ -65,6 +66,11 @@ export default class ProjectDropdown extends Vue {
         await this.$store.dispatch(PM_ACTIONS.SET_SEARCH_QUERY, '');
         this.closeDropdown();
 
+        if (this.isObjectsView) {
+            await this.$store.dispatch(OBJECTS_ACTIONS.CLEAR);
+            await this.$router.push({name: RouteConfig.Objects.name}).catch(() => {return; });
+        }
+
         try {
             await this.$store.dispatch(PAYMENTS_ACTIONS.GET_PROJECT_USAGE_AND_CHARGES_CURRENT_ROLLUP);
             await this.$store.dispatch(PM_ACTIONS.FETCH, this.FIRST_PAGE);
@@ -90,21 +96,6 @@ export default class ProjectDropdown extends Vue {
         return this.$store.getters.selectedProject;
     }
 
-    /**
-     * Indicates if create project button is shown.
-     */
-    public get isCreateProjectButtonShown(): boolean {
-        return this.$store.state.appStateModule.appState.isCreateProjectButtonShown;
-    }
-
-    /**
-     * Redirects to create project page.
-     */
-    public onCreateProjectsClick(): void {
-        this.$router.push(RouteConfig.CreateProject.path);
-        this.closeDropdown();
-    }
-
     /**
      * Closes dropdown.
      */
@@ -119,6 +110,13 @@ export default class ProjectDropdown extends Vue {
         this.$router.push(RouteConfig.ProjectsList.path);
         this.$emit('close');
     }
+
+    /**
+     * Indicates if current route is objects view.
+     */
+    private get isObjectsView(): boolean {
+        return this.$route.path.includes(RouteConfig.Objects.path);
+    }
 }
 </script>
 
@@ -206,7 +204,7 @@ export default class ProjectDropdown extends Vue {
                 justify-content: space-between;
                 align-items: center;
                 width: calc(100% - 50px);
-                padding: 5px 25px;
+                padding: 15px 25px;
 
                 &__text,
                 &__arrow {

diff --git a/web/satellite/src/components/header/resourcesDropdown/resourcesDropdown.scss b/web/satellite/src/components/header/resourcesDropdown/resourcesDropdown.scss
@@ -25,7 +25,7 @@
         }
 
         &__title {
-            margin-left: 13px;
+            margin: 8px 0 14px 13px;
             font-size: 14px;
             line-height: 20px;
             color: #1b2533;

diff --git a/web/satellite/src/components/onboardingTour/steps/OverviewStep.vue b/web/satellite/src/components/onboardingTour/steps/OverviewStep.vue
@@ -155,7 +155,7 @@ export default class OverviewStep extends Vue {
 
             this.isLoading = false;
 
-            await this.$router.push(RouteConfig.Objects.path);
+            await this.$router.push(RouteConfig.Objects.path).catch(() => {return; });
         } catch (error) {
             await this.$notify.error(error.message);
             this.isLoading = false;

diff --git a/web/satellite/src/components/project/CreateProject.vue b/web/satellite/src/components/project/CreateProject.vue
@@ -5,7 +5,7 @@
     <div class="create-project-area">
         <div class="create-project-area__container">
             <img src="@/../static/images/project/createProject.png" alt="create project image">
-            <h2 class="create-project-area__title">Create a Project</h2>
+            <h2 class="create-project-area__container__title">Create a Project</h2>
             <HeaderedInput
                 label="Project Name"
                 additional-label="Up To 20 Characters"
@@ -236,6 +236,7 @@ export default class NewProjectPopup extends Vue {
                 line-height: 34px;
                 color: #384b65;
                 font-family: 'font_bold', sans-serif;
+                margin: 15px 0 30px 0;
             }
 
             &__button-container {

diff --git a/web/satellite/src/views/forgotPassword/forgotPassword.scss b/web/satellite/src/views/forgotPassword/forgotPassword.scss
@@ -37,7 +37,7 @@ body {
 
     &__logo {
         cursor: pointer;
-        width: 140px;
+        width: 207px;
         height: 62px;
     }
 

diff --git a/web/satellite/src/views/login/loginArea.scss b/web/satellite/src/views/login/loginArea.scss
@@ -32,7 +32,7 @@
 
     &__logo {
         cursor: pointer;
-        width: 140px;
+        width: 207px;
         height: 62px;
     }
 

diff --git a/web/satellite/src/views/register/registerArea.scss b/web/satellite/src/views/register/registerArea.scss
@@ -48,7 +48,7 @@ body {
 
     &__logo {
         cursor: pointer;
-        width: 140px;
+        width: 207px;
         height: 62px;
     }
 
@@ -126,11 +126,9 @@ body {
         align-items: center;
         justify-content: space-between;
         width: 100%;
-        margin-top: 20px;
 
         &__terms-area {
             display: flex;
-            flex-direction: row;
             justify-content: center;
             align-items: center;
 
@@ -141,8 +139,7 @@ body {
             &__terms-confirmation {
                 font-size: 14px;
                 line-height: 20px;
-                margin-top: 14px;
-                margin-left: 10px;
+                margin: 4px 0 0 10px;
                 color: #384b65;
             }
 
@@ -249,6 +246,7 @@ body {
 
 .input-wrap.full-input {
     width: 100%;
+    margin-bottom: 15px;
 }
 
 .image {

diff --git a/web/satellite/tests/unit/project/__snapshots__/CreateProject.spec.ts.snap b/web/satellite/tests/unit/project/__snapshots__/CreateProject.spec.ts.snap
@@ -3,7 +3,7 @@
 exports[`CreateProject.vue renders correctly 1`] = `
 <div class="create-project-area">
   <div class="create-project-area__container"><img src="@/../static/images/project/createProject.png" alt="create project image">
-    <h2 class="create-project-area__title">Create a Project</h2>
+    <h2 class="create-project-area__container__title">Create a Project</h2>
     <div class="input-container full-input">
       <div class="label-container">
         <div class="label-container__main">