Skip to content

frontend: App: Add new way to enter in dev mode #2754

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Jun 27, 2024
Merged

frontend: App: Add new way to enter in dev mode #2754

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
a50a315
frontend: settings: Add is dev mode set/get
joaomariolago Jun 26, 2024
1ce27cc
frontend: App: Add enter dev mode
joaomariolago Jun 26, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
25 changes: 23 additions & 2 deletions core/frontend/src/App.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -61,7 +61,7 @@
<internet-tray-menu />
<wifi-tray-menu />
<ethernet-tray-menu />
<cloud-tray-menu />
<cloud-tray-menu v-if="settings.is_dev_mode" />
<notification-tray-button />
</v-app-bar>
</v-card>
Expand Down Expand Up @@ -296,10 +296,24 @@
>
Bootstrap Version: {{ bootstrap_version.split(':')[1] }}
</span>
<!-- eslint-disable vuejs-accessibility/click-events-have-key-events -->
<span
id="current-version"
class="build_info"
>Build: {{ build_date }}</span>
@click="buildDateClick"
>
Build: {{ build_date }}
<v-btn
v-if="settings.is_dev_mode"
v-tooltip="'Disable dev mode'"
icon
@click.stop="settings.is_dev_mode = false"
>
<v-icon color="red">
mdi-pill
</v-icon>
</v-btn>
</span>
<span
class="build_info"
>
Expand Down Expand Up @@ -426,6 +440,7 @@ export default Vue.extend({
],
selected_widgets: settings.user_top_widgets,
bootstrap_version: undefined as string|undefined,
build_clicks: 0,
}),
computed: {
topWidgetsName(): string[] {
Expand Down Expand Up @@ -719,6 +734,12 @@ export default Vue.extend({
this.$router.push('/')
}
},
buildDateClick(): void {
this.build_clicks = (this.build_clicks + 1) % 10
if (this.build_clicks === 0) {
settings.is_dev_mode = true
}
Comment on lines +738 to +741
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is there a reason for not doing something simpler ?

Suggested change
this.build_clicks = (this.build_clicks + 1) % 10
if (this.build_clicks === 0) {
settings.is_dev_mode = true
}
this.build_clicks += 1
settings.is_dev_mode = this.build_clicks > 10

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just to keep consistent that if the user activate and deactivate the dev mode without refreshing it still will require 10 clicks and not only one in the second activation.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I see, thanks!

},
},
})
</script>
Expand Down
10 changes: 10 additions & 0 deletions core/frontend/src/libs/settings.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,16 @@ class Settings {
settingsStore.setPirateMode(value)
}

// eslint-disable-next-line
get is_dev_mode(): boolean {
return settingsStore.is_dev_mode
}

// eslint-disable-next-line
set is_dev_mode(value: boolean) {
settingsStore.setDevMode(value)
}

// eslint-disable-next-line
get user_top_widgets(): string[] {
return settingsStore.user_top_widgets || []
Expand Down
16 changes: 13 additions & 3 deletions core/frontend/src/store/settings.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,8 @@ class SettingsStore extends VuexModule {

is_pirate_mode = false

is_dev_mode_enabled = false

last_version_update_notification_time = 0 // Start in 1970: https://www.youtube.com/watch?v=wwcKs5K1oWg

tour_version = 0
Expand All @@ -36,6 +38,15 @@ class SettingsStore extends VuexModule {
@Mutation
setPirateMode(value: boolean): void {
this.is_pirate_mode = value
if (!value) {
this.is_dev_mode_enabled = false
}
SettingsStore.save()
}

@Mutation
setDevMode(value: boolean): void {
this.is_dev_mode_enabled = value && this.is_pirate_mode
SettingsStore.save()
}

Expand All @@ -58,10 +69,9 @@ class SettingsStore extends VuexModule {
}

// Secret mode for developers that know our secret.
// It's enabled when the vehicle name is 'Sir Francis Drake', one the most famous pirates,
// and the pirate mode toggled to be enabled.
// Enabled by 10 clicks on the build date and when the pirate mode is enabled
get is_dev_mode(): boolean {
return beacon.vehicle_name === 'Sir Francis Drake' && this.is_pirate_mode
return this.is_pirate_mode && this.is_dev_mode_enabled
}

/**
Expand Down