Get Started with 50 GB Free
- Adding a payment method ensures your project won’t be interrupted after your free credit is used. + Experience the decentralized cloud for free! If you find our network isn’t for you, cancel + any time before your credit runs out and you won’t be billed.
Transparent Monthly Pricing
@@ -84,6 +85,7 @@ import { Component, Vue } from 'vue-property-decorator';
import AddCardState from '@/components/onboardingTour/steps/paymentStates/AddCardState.vue';
import AddStorjState from '@/components/onboardingTour/steps/paymentStates/AddStorjState.vue';
+import { RouteConfig } from '@/router';
import { AddingPaymentState } from '@/utils/constants/onboardingTourEnums';
@Component({
@@ -102,6 +104,12 @@ export default class AddPaymentStep extends Vue {
* Sets area to needed state.
*/
public mounted(): void {
+ if (this.userHasProject) {
+ this.$router.push(RouteConfig.OnboardingTour.with(RouteConfig.AccessGrant).path);
+
+ return;
+ }
+
if (this.$store.getters.isTransactionProcessing || this.$store.getters.isBalancePositive) {
this.setAddStorjState();
}
@@ -143,10 +151,17 @@ export default class AddPaymentStep extends Vue {
}
/**
- * Sets tour area to creating project state.
+ * Sets tour area to creating access grant state.
*/
- public setProjectState(): void {
- this.$emit('setProjectState');
+ public setCreateGrantStep(): void {
+ this.$router.push(RouteConfig.OnboardingTour.with(RouteConfig.AccessGrant).path);
+ }
+
+ /**
+ * Indicates if user has at least one project.
+ */
+ private get userHasProject(): boolean {
+ return this.$store.state.projectsModule.projects.length > 0;
}
}
@@ -169,6 +184,7 @@ export default class AddPaymentStep extends Vue {
position: relative;
&__title {
+ font-family: 'font_bold', sans-serif;
font-size: 32px;
line-height: 39px;
color: #1b2533;
@@ -182,6 +198,10 @@ export default class AddPaymentStep extends Vue {
margin-bottom: 35px;
text-align: center;
word-break: break-word;
+
+ .bold {
+ font-family: 'font_medium', sans-serif;
+ }
}
&__methods-container {
diff --git a/web/satellite/src/components/onboardingTour/steps/OverviewStep.vue b/web/satellite/src/components/onboardingTour/steps/OverviewStep.vue
index 527d88375..f76c0e663 100644
--- a/web/satellite/src/components/onboardingTour/steps/OverviewStep.vue
+++ b/web/satellite/src/components/onboardingTour/steps/OverviewStep.vue
@@ -9,6 +9,13 @@ import { Component, Vue } from 'vue-property-decorator';
import VButton from '@/components/common/VButton.vue';
import { RouteConfig } from '@/router';
+import { API_KEYS_ACTIONS } from '@/store/modules/apiKeys';
+import { BUCKET_ACTIONS } from '@/store/modules/buckets';
+import { PAYMENTS_ACTIONS } from '@/store/modules/payments';
+import { PROJECTS_ACTIONS } from '@/store/modules/projects';
+import { ProjectFields } from '@/types/projects';
+import { PM_ACTIONS } from '@/utils/constants/actionNames';
+import { SegmentEvent } from '@/utils/constants/analyticsEventNames';
@Component({
components: {
@@ -16,6 +23,24 @@ import { RouteConfig } from '@/router';
},
})
export default class OverviewStep extends Vue {
+ public isLoading: boolean = false;
+
+ /**
+ * Lifecycle hook after initial render.
+ * Sets area to needed state.
+ */
+ public mounted(): void {
+ if (this.userHasProject || this.$store.state.paymentsModule.creditCards.length > 0) {
+ this.$router.push(RouteConfig.OnboardingTour.with(RouteConfig.AccessGrant).path);
+
+ return;
+ }
+
+ if (this.$store.getters.isTransactionProcessing || this.$store.getters.isBalancePositive) {
+ this.$router.push(RouteConfig.OnboardingTour.with(RouteConfig.PaymentStep).path);
+ }
+ }
+
/**
* Holds button click logic.
* Redirects to next step (adding payment method).
@@ -26,10 +51,46 @@ export default class OverviewStep extends Vue {
/**
* Holds button click logic.
- * Redirects to next step (creating access grant).
+ * Creates untitled project and redirects to next step (creating access grant).
*/
- public onCreateGrantClick(): void {
- this.$router.push(RouteConfig.OnboardingTour.with(RouteConfig.AccessGrant).path);
+ public async onCreateGrantClick(): Promise
-
-