-
-
Notifications
You must be signed in to change notification settings - Fork 392
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: add Labs pane to preferences (#892)
* feat: add Labs pane to preferences * feat: use lab_features value for account switcher * feat: labs pane with experimental features * fix: use toggleExperimentalFeature from features service * fix: show premium modal if not entitled for experimental feature * fix: add isExperimental && isExperimentalEnabled to EditorMenuItem type * fix: hide experimental editor if not enabled * chore(deps): update features and snjs * fix: remove comment * fix: remove filtering from reloadExperimentalFeatures * fix: revert Footer.tsx * chore(deps): bump @standardnotes packages * fix: change experimental features layout Co-authored-by: Johnny Almonte <johnny243@users.noreply.github.com> Co-authored-by: Mo <mo@standardnotes.com>
- Loading branch information
3 people
committed
Mar 8, 2022
1 parent
6d64889
commit ab6e5ac
Showing
8 changed files
with
166 additions
and
41 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
102 changes: 102 additions & 0 deletions
102
app/assets/javascripts/preferences/panes/general-segments/Labs.tsx
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,102 @@ | ||
| import { FindNativeFeature } from '@standardnotes/features'; | ||
| import { Switch } from '@/components/Switch'; | ||
| import { | ||
| PreferencesGroup, | ||
| PreferencesSegment, | ||
| Subtitle, | ||
| Text, | ||
| Title, | ||
| } from '@/preferences/components'; | ||
| import { WebApplication } from '@/ui_models/application'; | ||
| import { FeatureIdentifier, FeatureStatus } from '@standardnotes/snjs'; | ||
| import { FunctionComponent } from 'preact'; | ||
| import { useCallback, useEffect, useState } from 'preact/hooks'; | ||
| import { usePremiumModal } from '@/components/Premium'; | ||
| import { HorizontalSeparator } from '@/components/shared/HorizontalSeparator'; | ||
|
|
||
| type Props = { | ||
| application: WebApplication; | ||
| }; | ||
|
|
||
| export const LabsPane: FunctionComponent<Props> = ({ application }) => { | ||
| const [experimentalFeatures, setExperimentalFeatures] = | ||
| useState<FeatureIdentifier[]>(); | ||
|
|
||
| const reloadExperimentalFeatures = useCallback(() => { | ||
| const experimentalFeatures = application.features.getExperimentalFeatures(); | ||
| setExperimentalFeatures(experimentalFeatures); | ||
| }, [application.features]); | ||
|
|
||
| useEffect(() => { | ||
| reloadExperimentalFeatures(); | ||
| }, [reloadExperimentalFeatures]); | ||
|
|
||
| const premiumModal = usePremiumModal(); | ||
|
|
||
| if (!experimentalFeatures) { | ||
| return ( | ||
| <div className="flex items-center justify-between"> | ||
| No experimental features available. | ||
| </div> | ||
| ); | ||
| } | ||
|
|
||
| return ( | ||
| <PreferencesGroup> | ||
| <PreferencesSegment> | ||
| <Title>Labs</Title> | ||
| <div> | ||
| {experimentalFeatures?.map( | ||
| (featureIdentifier: FeatureIdentifier, index: number) => { | ||
| const feature = FindNativeFeature(featureIdentifier); | ||
| const featureName = feature?.name ?? featureIdentifier; | ||
| const featureDescription = feature?.description ?? ''; | ||
|
|
||
| const isFeatureEnabled = | ||
| application.features.isExperimentalFeatureEnabled( | ||
| featureIdentifier | ||
| ); | ||
|
|
||
| const toggleFeature = () => { | ||
| const isEntitled = | ||
| application.features.getFeatureStatus(featureIdentifier) === | ||
| FeatureStatus.Entitled; | ||
| if (!isEntitled) { | ||
| premiumModal.activate(featureName); | ||
| return; | ||
| } | ||
|
|
||
| application.features.toggleExperimentalFeature( | ||
| featureIdentifier | ||
| ); | ||
| reloadExperimentalFeatures(); | ||
| }; | ||
|
|
||
| const showHorizontalSeparator = | ||
| experimentalFeatures.length > 1 && | ||
| index !== experimentalFeatures.length - 1; | ||
|
|
||
| return ( | ||
| <> | ||
| <div className="flex items-center justify-between"> | ||
| <div className="flex flex-col"> | ||
| <Subtitle>{featureName}</Subtitle> | ||
| <Text>{featureDescription}</Text> | ||
| </div> | ||
| <Switch | ||
| onChange={toggleFeature} | ||
| checked={isFeatureEnabled} | ||
| /> | ||
| </div> | ||
| {showHorizontalSeparator && ( | ||
| <HorizontalSeparator classes="mt-5 mb-3" /> | ||
| )} | ||
| </> | ||
| ); | ||
| } | ||
| )} | ||
| </div> | ||
| </PreferencesSegment> | ||
| </PreferencesGroup> | ||
| ); | ||
| }; |
1 change: 1 addition & 0 deletions
1
app/assets/javascripts/preferences/panes/general-segments/index.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,3 +1,4 @@ | ||
| export * from './ErrorReporting'; | ||
| export * from './Tools'; | ||
| export * from './Defaults'; | ||
| export * from './Labs'; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters