diff --git a/satellite/console/consoleweb/config.go b/satellite/console/consoleweb/config.go index 0266eb866..daa87bcff 100644 --- a/satellite/console/consoleweb/config.go +++ b/satellite/console/consoleweb/config.go @@ -47,6 +47,7 @@ type FrontendConfig struct { ABTestingEnabled bool `json:"abTestingEnabled"` PricingPackagesEnabled bool `json:"pricingPackagesEnabled"` NewUploadModalEnabled bool `json:"newUploadModalEnabled"` + GalleryViewEnabled bool `json:"galleryViewEnabled"` } // Satellites is a configuration value that contains a list of satellite names and addresses. diff --git a/satellite/console/consoleweb/server.go b/satellite/console/consoleweb/server.go index ee6565dba..5bf4fcee7 100644 --- a/satellite/console/consoleweb/server.go +++ b/satellite/console/consoleweb/server.go @@ -100,6 +100,7 @@ type Config struct { NativeTokenPaymentsEnabled bool `help:"indicates if storj native token payments system is enabled" default:"false"` PricingPackagesEnabled bool `help:"whether to allow purchasing pricing packages" default:"false" devDefault:"true"` NewUploadModalEnabled bool `help:"whether to show new upload modal" default:"false"` + GalleryViewEnabled bool `help:"whether to show new gallery view" default:"false"` OauthCodeExpiry time.Duration `help:"how long oauth authorization codes are issued for" default:"10m"` OauthAccessTokenExpiry time.Duration `help:"how long oauth access tokens are issued for" default:"24h"` @@ -544,6 +545,7 @@ func (server *Server) frontendConfigHandler(w http.ResponseWriter, r *http.Reque ABTestingEnabled: server.config.ABTesting.Enabled, PricingPackagesEnabled: server.config.PricingPackagesEnabled, NewUploadModalEnabled: server.config.NewUploadModalEnabled, + GalleryViewEnabled: server.config.GalleryViewEnabled, } err := json.NewEncoder(w).Encode(&cfg) diff --git a/scripts/testdata/satellite-config.yaml.lock b/scripts/testdata/satellite-config.yaml.lock index ee6fcb649..3ef15cbc2 100755 --- a/scripts/testdata/satellite-config.yaml.lock +++ b/scripts/testdata/satellite-config.yaml.lock @@ -256,6 +256,9 @@ compensation.withheld-percents: 75,75,75,50,50,50,25,25,25,0,0,0,0,0,0 # allow domains to embed the satellite in a frame, space separated # console.frame-ancestors: tardigrade.io storj.io +# whether to show new gallery view +# console.gallery-view-enabled: false + # url link for gateway credentials requests # console.gateway-credentials-request-url: https://auth.storjsatelliteshare.io diff --git a/web/satellite/package.json b/web/satellite/package.json index 9358603d8..06024c927 100644 --- a/web/satellite/package.json +++ b/web/satellite/package.json @@ -6,7 +6,7 @@ "preview": "vite preview", "dev": "vite", "build": "vite build", - "build-watch": "vite build --watch", + "build-watch": "NODE_ENV=development vite build --watch", "lint": "eslint --ext .js,.ts,.vue src --fix && stylelint . --max-warnings 0 --fix", "lint-ci": "eslint --ext .js,.ts,.vue src --no-fix && stylelint . --max-warnings 0 --no-fix", "wasm": "chmod +x ./scripts/build-wasm.sh && ./scripts/build-wasm.sh", diff --git a/web/satellite/src/components/browser/FileEntry.vue b/web/satellite/src/components/browser/FileEntry.vue index 18323b35d..eb597ddcb 100644 --- a/web/satellite/src/components/browser/FileEntry.vue +++ b/web/satellite/src/components/browser/FileEntry.vue @@ -122,6 +122,7 @@ import { AnalyticsErrorEventSource } from '@/utils/constants/analyticsEventNames import { MODALS } from '@/utils/constants/appStatePopUps'; import { BrowserObject, useObjectBrowserStore } from '@/store/modules/objectBrowserStore'; import { useAppStore } from '@/store/modules/appStore'; +import { useConfigStore } from '@/store/modules/configStore'; import TableItem from '@/components/common/TableItem.vue'; @@ -134,6 +135,7 @@ import CloseIcon from '@/../static/images/common/closeCross.svg'; const appStore = useAppStore(); const obStore = useObjectBrowserStore(); +const config = useConfigStore(); const notify = useNotify(); const router = useRouter(); @@ -252,7 +254,13 @@ const loadingSpinner = computed((): boolean => { */ function openModal(): void { obStore.setObjectPathForModal(props.path + props.file.Key); - appStore.updateActiveModal(MODALS.objectDetails); + + if (config.state.config.galleryViewEnabled) { + appStore.setGalleryView(true); + } else { + appStore.updateActiveModal(MODALS.objectDetails); + } + obStore.closeDropdown(); } diff --git a/web/satellite/src/components/browser/UpEntry.vue b/web/satellite/src/components/browser/UpEntry.vue index b1251430e..1f33fe18d 100644 --- a/web/satellite/src/components/browser/UpEntry.vue +++ b/web/satellite/src/components/browser/UpEntry.vue @@ -21,5 +21,4 @@ import TableItem from '@/components/common/TableItem.vue'; const props = defineProps<{ onBack: () => void; }>(); - diff --git a/web/satellite/src/components/browser/galleryView/ButtonIcon.vue b/web/satellite/src/components/browser/galleryView/ButtonIcon.vue new file mode 100644 index 000000000..58dee69a3 --- /dev/null +++ b/web/satellite/src/components/browser/galleryView/ButtonIcon.vue @@ -0,0 +1,36 @@ +// Copyright (C) 2023 Storj Labs, Inc. +// See LICENSE for copying information. + + + + + + diff --git a/web/satellite/src/components/browser/galleryView/GalleryView.vue b/web/satellite/src/components/browser/galleryView/GalleryView.vue new file mode 100644 index 000000000..8d66642e9 --- /dev/null +++ b/web/satellite/src/components/browser/galleryView/GalleryView.vue @@ -0,0 +1,490 @@ +// Copyright (C) 2023 Storj Labs, Inc. +// See LICENSE for copying information. + + + + + + diff --git a/web/satellite/src/components/modals/AllModals.vue b/web/satellite/src/components/modals/AllModals.vue index 04d855687..9a3263cc2 100644 --- a/web/satellite/src/components/modals/AllModals.vue +++ b/web/satellite/src/components/modals/AllModals.vue @@ -2,6 +2,7 @@ // See LICENSE for copying information.