diff --git a/web/satellite/src/components/accessGrants/permissions/BucketsSelection.vue b/web/satellite/src/components/accessGrants/permissions/BucketsSelection.vue index 0b93c813a..4d03f9c48 100644 --- a/web/satellite/src/components/accessGrants/permissions/BucketsSelection.vue +++ b/web/satellite/src/components/accessGrants/permissions/BucketsSelection.vue @@ -28,7 +28,8 @@ import { Component, Vue } from 'vue-property-decorator'; import BucketsDropdown from '@/components/accessGrants/permissions/BucketsDropdown.vue'; import ExpandIcon from '@/../static/images/common/BlackArrowExpand.svg'; -import {RouteConfig} from "@/router"; + +import { RouteConfig } from '@/router'; @Component({ components: { @@ -101,6 +102,7 @@ export default class BucketsSelection extends Vue { justify-content: space-between; padding: 15px 20px; width: calc(100% - 40px); + border-radius: 6px; &__name { font-style: normal; diff --git a/web/satellite/src/components/header/accountDropdown/AccountDropdown.vue b/web/satellite/src/components/header/accountDropdown/AccountDropdown.vue index 9aa4b614a..aff397d73 100644 --- a/web/satellite/src/components/header/accountDropdown/AccountDropdown.vue +++ b/web/satellite/src/components/header/accountDropdown/AccountDropdown.vue @@ -20,7 +20,7 @@ import { Component, Vue } from 'vue-property-decorator'; import { AuthHttpApi } from '@/api/auth'; import { RouteConfig } from '@/router'; -import { API_KEYS_ACTIONS } from '@/store/modules/apiKeys'; +import { ACCESS_GRANTS_ACTIONS } from '@/store/modules/accessGrants'; import { BUCKET_ACTIONS } from '@/store/modules/buckets'; import { PROJECTS_ACTIONS } from '@/store/modules/projects'; import { USER_ACTIONS } from '@/store/modules/users'; @@ -58,7 +58,7 @@ export default class AccountDropdown extends Vue { await this.$store.dispatch(PM_ACTIONS.CLEAR); await this.$store.dispatch(PROJECTS_ACTIONS.CLEAR); await this.$store.dispatch(USER_ACTIONS.CLEAR); - await this.$store.dispatch(API_KEYS_ACTIONS.CLEAR); + await this.$store.dispatch(ACCESS_GRANTS_ACTIONS.CLEAR); await this.$store.dispatch(NOTIFICATION_ACTIONS.CLEAR); await this.$store.dispatch(BUCKET_ACTIONS.CLEAR); await this.$store.dispatch(APP_STATE_ACTIONS.CLOSE_POPUPS); diff --git a/web/satellite/src/components/header/projectsDropdown/ProjectDropdown.vue b/web/satellite/src/components/header/projectsDropdown/ProjectDropdown.vue index e5c95f823..97b80ee06 100644 --- a/web/satellite/src/components/header/projectsDropdown/ProjectDropdown.vue +++ b/web/satellite/src/components/header/projectsDropdown/ProjectDropdown.vue @@ -39,7 +39,7 @@ import { Component, Vue } from 'vue-property-decorator'; import SelectionIcon from '@/../static/images/header/selection.svg'; import { RouteConfig } from '@/router'; -import { API_KEYS_ACTIONS } from '@/store/modules/apiKeys'; +import { ACCESS_GRANTS_ACTIONS } from '@/store/modules/accessGrants'; import { BUCKET_ACTIONS } from '@/store/modules/buckets'; import { PAYMENTS_ACTIONS } from '@/store/modules/payments'; import { PROJECTS_ACTIONS } from '@/store/modules/projects'; @@ -68,7 +68,7 @@ export default class ProjectDropdown extends Vue { try { await this.$store.dispatch(PAYMENTS_ACTIONS.GET_PROJECT_USAGE_AND_CHARGES_CURRENT_ROLLUP); await this.$store.dispatch(PM_ACTIONS.FETCH, this.FIRST_PAGE); - await this.$store.dispatch(API_KEYS_ACTIONS.FETCH, this.FIRST_PAGE); + await this.$store.dispatch(ACCESS_GRANTS_ACTIONS.FETCH, this.FIRST_PAGE); await this.$store.dispatch(BUCKET_ACTIONS.FETCH, this.FIRST_PAGE); await this.$store.dispatch(PROJECTS_ACTIONS.GET_LIMITS, this.$store.getters.selectedProject.id); } catch (error) { diff --git a/web/satellite/src/components/navigation/NavigationArea.vue b/web/satellite/src/components/navigation/NavigationArea.vue index 97c803077..8f6765323 100644 --- a/web/satellite/src/components/navigation/NavigationArea.vue +++ b/web/satellite/src/components/navigation/NavigationArea.vue @@ -24,7 +24,7 @@ import { Component, Vue } from 'vue-property-decorator'; import EditProjectDropdown from '@/components/navigation/EditProjectDropdown.vue'; -import ApiKeysIcon from '@/../static/images/navigation/apiKeys.svg'; +import AccessGrantsIcon from '@/../static/images/navigation/apiKeys.svg'; import DashboardIcon from '@/../static/images/navigation/dashboard.svg'; import TeamIcon from '@/../static/images/navigation/team.svg'; @@ -34,7 +34,7 @@ import { NavigationLink } from '@/types/navigation'; @Component({ components: { DashboardIcon, - ApiKeysIcon, + AccessGrantsIcon, TeamIcon, EditProjectDropdown, }, @@ -45,7 +45,7 @@ export default class NavigationArea extends Vue { */ public readonly navigation: NavigationLink[] = [ RouteConfig.ProjectDashboard.withIcon(DashboardIcon), - RouteConfig.ApiKeys.withIcon(ApiKeysIcon), + RouteConfig.AccessGrants.withIcon(AccessGrantsIcon), RouteConfig.Users.withIcon(TeamIcon), ]; diff --git a/web/satellite/src/components/onboardingTour/steps/AddPaymentStep.vue b/web/satellite/src/components/onboardingTour/steps/AddPaymentStep.vue index 01f18db79..01cd7772c 100644 --- a/web/satellite/src/components/onboardingTour/steps/AddPaymentStep.vue +++ b/web/satellite/src/components/onboardingTour/steps/AddPaymentStep.vue @@ -154,7 +154,7 @@ export default class AddPaymentStep extends Vue { * Sets tour area to creating access grant state. */ public setCreateGrantStep(): void { - this.$router.push(RouteConfig.OnboardingTour.with(RouteConfig.AccessGrant).path); + this.$router.push(RouteConfig.OnboardingTour.with(RouteConfig.AccessGrant).with(RouteConfig.AccessGrantName).path); } /** diff --git a/web/satellite/src/components/onboardingTour/steps/OverviewStep.vue b/web/satellite/src/components/onboardingTour/steps/OverviewStep.vue index f76c0e663..4cb1933f0 100644 --- a/web/satellite/src/components/onboardingTour/steps/OverviewStep.vue +++ b/web/satellite/src/components/onboardingTour/steps/OverviewStep.vue @@ -9,7 +9,7 @@ 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 { ACCESS_GRANTS_ACTIONS } from '@/store/modules/accessGrants'; import { BUCKET_ACTIONS } from '@/store/modules/buckets'; import { PAYMENTS_ACTIONS } from '@/store/modules/payments'; import { PROJECTS_ACTIONS } from '@/store/modules/projects'; @@ -81,12 +81,12 @@ export default class OverviewStep extends Vue { await this.$store.dispatch(PAYMENTS_ACTIONS.GET_BALANCE); await this.$store.dispatch(PAYMENTS_ACTIONS.GET_PROJECT_USAGE_AND_CHARGES_CURRENT_ROLLUP); await this.$store.dispatch(PROJECTS_ACTIONS.GET_LIMITS, createdProjectId); - await this.$store.dispatch(API_KEYS_ACTIONS.CLEAR); + await this.$store.dispatch(ACCESS_GRANTS_ACTIONS.CLEAR); await this.$store.dispatch(BUCKET_ACTIONS.CLEAR); this.isLoading = false; - await this.$router.push(RouteConfig.OnboardingTour.with(RouteConfig.AccessGrant).path); + await this.$router.push(RouteConfig.OnboardingTour.with(RouteConfig.AccessGrant).with(RouteConfig.AccessGrantName).path); } catch (error) { await this.$notify.error(error.message); this.isLoading = false; diff --git a/web/satellite/src/components/onboardingTour/steps/paymentStates/AddCardState.vue b/web/satellite/src/components/onboardingTour/steps/paymentStates/AddCardState.vue index 568de3436..7c5216ce7 100644 --- a/web/satellite/src/components/onboardingTour/steps/paymentStates/AddCardState.vue +++ b/web/satellite/src/components/onboardingTour/steps/paymentStates/AddCardState.vue @@ -35,7 +35,7 @@ import VButton from '@/components/common/VButton.vue'; import LockImage from '@/../static/images/account/billing/lock.svg'; -import { API_KEYS_ACTIONS } from '@/store/modules/apiKeys'; +import { ACCESS_GRANTS_ACTIONS } from '@/store/modules/accessGrants'; import { BUCKET_ACTIONS } from '@/store/modules/buckets'; import { PAYMENTS_ACTIONS } from '@/store/modules/payments'; import { PROJECTS_ACTIONS } from '@/store/modules/projects'; @@ -108,7 +108,7 @@ export default class AddCardState extends Vue { await this.$store.dispatch(PAYMENTS_ACTIONS.GET_BALANCE); await this.$store.dispatch(PAYMENTS_ACTIONS.GET_PROJECT_USAGE_AND_CHARGES_CURRENT_ROLLUP); await this.$store.dispatch(PROJECTS_ACTIONS.GET_LIMITS, createdProjectId); - await this.$store.dispatch(API_KEYS_ACTIONS.CLEAR); + await this.$store.dispatch(ACCESS_GRANTS_ACTIONS.CLEAR); await this.$store.dispatch(BUCKET_ACTIONS.CLEAR); this.setDefaultState(); diff --git a/web/satellite/src/components/onboardingTour/steps/paymentStates/AddStorjState.vue b/web/satellite/src/components/onboardingTour/steps/paymentStates/AddStorjState.vue index 5f1937394..0856dfae0 100644 --- a/web/satellite/src/components/onboardingTour/steps/paymentStates/AddStorjState.vue +++ b/web/satellite/src/components/onboardingTour/steps/paymentStates/AddStorjState.vue @@ -53,7 +53,7 @@ import PayingStep from '@/components/onboardingTour/steps/paymentStates/tokenSub import VerifiedStep from '@/components/onboardingTour/steps/paymentStates/tokenSubSteps/VerifiedStep.vue'; import VerifyingStep from '@/components/onboardingTour/steps/paymentStates/tokenSubSteps/VerifyingStep.vue'; -import { API_KEYS_ACTIONS } from '@/store/modules/apiKeys'; +import { ACCESS_GRANTS_ACTIONS } from '@/store/modules/accessGrants'; import { BUCKET_ACTIONS } from '@/store/modules/buckets'; import { PAYMENTS_ACTIONS } from '@/store/modules/payments'; import { PROJECTS_ACTIONS } from '@/store/modules/projects'; @@ -128,7 +128,7 @@ export default class AddStorjState extends Vue { await this.$store.dispatch(PAYMENTS_ACTIONS.GET_BALANCE); await this.$store.dispatch(PAYMENTS_ACTIONS.GET_PROJECT_USAGE_AND_CHARGES_CURRENT_ROLLUP); await this.$store.dispatch(PROJECTS_ACTIONS.GET_LIMITS, createdProjectId); - await this.$store.dispatch(API_KEYS_ACTIONS.CLEAR); + await this.$store.dispatch(ACCESS_GRANTS_ACTIONS.CLEAR); await this.$store.dispatch(BUCKET_ACTIONS.CLEAR); this.toggleIsLoading(); diff --git a/web/satellite/src/components/project/CreateProject.vue b/web/satellite/src/components/project/CreateProject.vue index e7ee30a3d..70836367a 100644 --- a/web/satellite/src/components/project/CreateProject.vue +++ b/web/satellite/src/components/project/CreateProject.vue @@ -65,7 +65,7 @@ import HeaderedInput from '@/components/common/HeaderedInput.vue'; import VButton from '@/components/common/VButton.vue'; import { RouteConfig } from '@/router'; -import { API_KEYS_ACTIONS } from '@/store/modules/apiKeys'; +import { ACCESS_GRANTS_ACTIONS } from '@/store/modules/accessGrants'; import { BUCKET_ACTIONS } from '@/store/modules/buckets'; import { PAYMENTS_ACTIONS } from '@/store/modules/payments'; import { PROJECTS_ACTIONS } from '@/store/modules/projects'; @@ -200,7 +200,7 @@ export default class NewProjectPopup extends Vue { * Clears api keys store. */ private clearApiKeys(): void { - this.$store.dispatch(API_KEYS_ACTIONS.CLEAR); + this.$store.dispatch(ACCESS_GRANTS_ACTIONS.CLEAR); } /** diff --git a/web/satellite/src/components/project/DeleteProjectPopup.vue b/web/satellite/src/components/project/DeleteProjectPopup.vue index 3e0fe210a..3bf83d987 100644 --- a/web/satellite/src/components/project/DeleteProjectPopup.vue +++ b/web/satellite/src/components/project/DeleteProjectPopup.vue @@ -58,7 +58,7 @@ import CloseCrossIcon from '@/../static/images/common/closeCross.svg'; import DeleteProjectIcon from '@/../static/images/project/deleteProject.svg'; import ErrorIcon from '@/../static/images/register/ErrorInfo.svg'; -import { API_KEYS_ACTIONS } from '@/store/modules/apiKeys'; +import { ACCESS_GRANTS_ACTIONS } from '@/store/modules/accessGrants'; import { BUCKET_ACTIONS } from '@/store/modules/buckets'; import { PROJECTS_ACTIONS } from '@/store/modules/projects'; import { @@ -146,7 +146,7 @@ export default class DeleteProjectPopup extends Vue { private async selectProject(): Promise { if (this.$store.state.projectsModule.projects.length === 0) { await this.$store.dispatch(PM_ACTIONS.CLEAR); - await this.$store.dispatch(API_KEYS_ACTIONS.CLEAR); + await this.$store.dispatch(ACCESS_GRANTS_ACTIONS.CLEAR); await this.$store.dispatch(BUCKET_ACTIONS.CLEAR); return; @@ -155,7 +155,7 @@ export default class DeleteProjectPopup extends Vue { // TODO: reuse select project functionality await this.$store.dispatch(PROJECTS_ACTIONS.SELECT, this.$store.state.projectsModule.projects[0].id); await this.$store.dispatch(PM_ACTIONS.FETCH, 1); - await this.$store.dispatch(API_KEYS_ACTIONS.FETCH, 1); + await this.$store.dispatch(ACCESS_GRANTS_ACTIONS.FETCH, 1); await this.$store.dispatch(BUCKET_ACTIONS.FETCH, 1); } } diff --git a/web/satellite/src/components/project/summary/ProjectSummary.vue b/web/satellite/src/components/project/summary/ProjectSummary.vue index ac7891863..842c31b13 100644 --- a/web/satellite/src/components/project/summary/ProjectSummary.vue +++ b/web/satellite/src/components/project/summary/ProjectSummary.vue @@ -18,8 +18,8 @@ background-color="#f5f6fa" title-color="#1b2533" value-color="#000" - title="API Keys" - :value="apiKeysAmount" + title="Access Grants" + :value="accessGrantsAmount" /> Dashboard - +
-

API Keys

+

Access Grants

 diff --git a/web/satellite/tests/unit/project/summary/ProjectSummary.spec.ts b/web/satellite/tests/unit/project/summary/ProjectSummary.spec.ts index c4fd7f4ad..71fb67588 100644 --- a/web/satellite/tests/unit/project/summary/ProjectSummary.spec.ts +++ b/web/satellite/tests/unit/project/summary/ProjectSummary.spec.ts @@ -5,7 +5,7 @@ import Vuex from 'vuex'; import ProjectSummary from '@/components/project/summary/ProjectSummary.vue'; -import { makeApiKeysModule } from '@/store/modules/apiKeys'; +import { makeAccessGrantsModule } from '@/store/modules/accessGrants'; import { makeBucketsModule } from '@/store/modules/buckets'; import { makePaymentsModule } from '@/store/modules/payments'; import { makeProjectMembersModule } from '@/store/modules/projectMembers'; @@ -13,7 +13,7 @@ import { makeProjectsModule } from '@/store/modules/projects'; import { NotificatorPlugin } from '@/utils/plugins/notificator'; import { createLocalVue, mount } from '@vue/test-utils'; -import { ApiKeysMock } from '../../mock/api/apiKeys'; +import { AccessGrantsMock } from '../../mock/api/accessGrants'; import { BucketsMock } from '../../mock/api/buckets'; import { PaymentsMock } from '../../mock/api/payments'; import { ProjectMembersApiMock } from '../../mock/api/projectMembers'; @@ -35,12 +35,12 @@ const paymentsApi = new PaymentsMock(); const paymentsModule = makePaymentsModule(paymentsApi); const bucketsApi = new BucketsMock(); const bucketUsageModule = makeBucketsModule(bucketsApi); -const apiKeysApi = new ApiKeysMock(); -const apiKeysModule = makeApiKeysModule(apiKeysApi); +const accessGrantsApi = new AccessGrantsMock(); +const accessGrantsModule = makeAccessGrantsModule(accessGrantsApi); const projectMembersApi = new ProjectMembersApiMock(); const projectMembersModule = makeProjectMembersModule(projectMembersApi); -const store = new Vuex.Store({ modules: { projectsModule, paymentsModule, bucketUsageModule, projectMembersModule, apiKeysModule }}); +const store = new Vuex.Store({ modules: { projectsModule, paymentsModule, bucketUsageModule, projectMembersModule, accessGrantsModule }}); describe('ProjectSummary.vue', (): void => { it('renders correctly', (): void => { diff --git a/web/satellite/tests/unit/project/summary/__snapshots__/ProjectSummary.spec.ts.snap b/web/satellite/tests/unit/project/summary/__snapshots__/ProjectSummary.spec.ts.snap index adebacae5..3a3a2c403 100644 --- a/web/satellite/tests/unit/project/summary/__snapshots__/ProjectSummary.spec.ts.snap +++ b/web/satellite/tests/unit/project/summary/__snapshots__/ProjectSummary.spec.ts.snap @@ -9,7 +9,7 @@ exports[`ProjectSummary.vue renders correctly 1`] = `

0

-

API Keys

+

Access Grants

0

diff --git a/web/satellite/tests/unit/views/DashboardArea.spec.ts b/web/satellite/tests/unit/views/DashboardArea.spec.ts index b9a1c0b12..0f1a41397 100644 --- a/web/satellite/tests/unit/views/DashboardArea.spec.ts +++ b/web/satellite/tests/unit/views/DashboardArea.spec.ts @@ -4,7 +4,7 @@ import Vuex from 'vuex'; import { RouteConfig, router } from '@/router'; -import { makeApiKeysModule } from '@/store/modules/apiKeys'; +import { makeAccessGrantsModule } from '@/store/modules/accessGrants'; import { appStateModule } from '@/store/modules/appState'; import { makeBucketsModule } from '@/store/modules/buckets'; import { makeNotificationsModule } from '@/store/modules/notifications'; @@ -12,7 +12,6 @@ import { makePaymentsModule } from '@/store/modules/payments'; import { makeProjectMembersModule } from '@/store/modules/projectMembers'; import { makeProjectsModule } from '@/store/modules/projects'; import { makeUsersModule } from '@/store/modules/users'; -import { APP_STATE_MUTATIONS } from '@/store/mutationConstants'; import { User } from '@/types/users'; import { APP_STATE_ACTIONS } from '@/utils/constants/actionNames'; import { AppState } from '@/utils/constants/appStateEnum'; @@ -21,6 +20,7 @@ import { SegmentioPlugin } from '@/utils/plugins/segment'; import DashboardArea from '@/views/DashboardArea.vue'; import { createLocalVue, shallowMount } from '@vue/test-utils'; +import { AccessGrantsMock } from '../mock/api/accessGrants'; import { ApiKeysMock } from '../mock/api/apiKeys'; import { BucketsMock } from '../mock/api/buckets'; import { PaymentsMock } from '../mock/api/payments'; @@ -43,7 +43,7 @@ projectsApi.setMockProjects([]); const usersModule = makeUsersModule(usersApi); const projectsModule = makeProjectsModule(projectsApi); -const apiKeysModule = makeApiKeysModule(new ApiKeysMock()); +const accessGrantsModule = makeAccessGrantsModule(new AccessGrantsMock()); const teamMembersModule = makeProjectMembersModule(new ProjectMembersApiMock()); const bucketsModule = makeBucketsModule(new BucketsMock()); const notificationsModule = makeNotificationsModule(); @@ -53,7 +53,7 @@ const store = new Vuex.Store({ modules: { notificationsModule, bucketsModule, - apiKeysModule, + accessGrantsModule, usersModule, projectsModule, appStateModule, @@ -114,7 +114,7 @@ describe('Dashboard', () => { it('loads routes correctly when authorithed without project with unavailable routes', async () => { const unavailableWithoutProject = [ - RouteConfig.ApiKeys.path, + RouteConfig.AccessGrants.path, RouteConfig.Users.path, RouteConfig.ProjectDashboard.path, ];