add back the settings button to the dashboard

src/content-scripts/content_script/global.ts

@@ -979,6 +979,7 @@ export async function main(
  requestSearcher: remoteFunction('search'),
  annotationsFunctions,
  onDemandDisplay,
+ bgScriptBG,
  })
  },
  }
@@ -1012,6 +1013,7 @@ export async function main(
  localStorage: browser.storage.local,
  services: createUIServices(),
  renderUpdateNotifBanner: () => null,
+ bgScriptBG,
  }
 
  if (

src/content-scripts/content_script/types.ts

@@ -13,6 +13,7 @@ import type { AnalyticsCoreInterface } from '@worldbrain/memex-common/lib/analyt
 import type { SyncSettingsStore } from 'src/sync-settings/util'
 import type { ErrorDisplayProps } from 'src/search-injection/error-display'
 import type { SearchDisplayProps } from 'src/search-injection/search-display'
+import { RemoteBGScriptInterface } from 'src/background-script/types'
 
 export interface ContentScriptRegistry {
  registerRibbonScript(main: RibbonScriptMain): Promise<void>
@@ -74,6 +75,7 @@ export interface InPageUIInjectionsDependencies {
  errorDisplayProps?: ErrorDisplayProps
  searchDisplayProps?: SearchDisplayProps
  }
+ bgScriptBG: RemoteBGScriptInterface
 }
 
 export type HighlightsScriptMain = (

src/dashboard-refactor/index.tsx

@@ -509,8 +509,9 @@ export class DashboardContainer extends StatefulUIElement<
  }}
  />
  </SearchSection>
- {!this.props.inPageMode && (
- <RightHeader>
+
+ <RightHeader>
+ {!this.props.inPageMode && (
  <ActionWrapper>
  <PrimaryAction
  onClick={() =>
@@ -532,21 +533,21 @@ export class DashboardContainer extends StatefulUIElement<
  innerRef={this.syncStatusButtonRef}
  />
  </ActionWrapper>
-  {!this.props.inPageMode && (
-  <>
-  <Icon
-  onClick={() =>
-  window.open(SETTINGS_URL, '_self')
- }
- heightAndWidth="22px"
-  padding={'6px'}
-  filePath={icons.settings}
-  />
-  {this.renderStatusMenu(syncStatusIconState)}
-  </>
- )}
- </RightHeader>
- )}
+ )}
+ <>
+ <Icon
+ onClick={() =>
+ this.props.inPageMode
+ ? this.props.openSettings()
+ : window.open(SETTINGS_URL, '_blank')
+ }
+ heightAndWidth="22px"
+ padding={'6px'}
+ filePath={icons.settings}
+ />
+ {this.renderStatusMenu(syncStatusIconState)}
+ </>
+ </RightHeader>
  </HeaderContainer>
  )
  }

src/dashboard-refactor/types.ts

@@ -48,6 +48,7 @@ import type {
 } from '@worldbrain/memex-common/lib/common-ui/styles/types'
 import { ImageSupportInterface } from 'src/image-support/background/types'
 import { RemoteCopyPasterInterface } from 'src/copy-paster/background/types'
+import { RemoteBGScriptInterface } from 'src/background-script/types'
 
 export interface RootState {
  loadState: TaskState
@@ -120,6 +121,8 @@ export type DashboardDependencies = {
  >
  imageSupportBG: ImageSupportInterface<'caller'>
  closeInPageMode?: () => void
+ openSettings?: () => void
+ bgScriptBG: RemoteBGScriptInterface
 } & (
  | {
  inPageMode: true

src/search-injection/search-display.tsx

@@ -10,9 +10,11 @@ import type { DashboardDependencies } from 'src/dashboard-refactor/types'
 import * as constants from './constants'
 import { DashboardContainer } from 'src/dashboard-refactor'
 import { InPageSearchModal } from '@worldbrain/memex-common/lib/common-ui/components/inPage-search-modal'
+import { RemoteBGScriptInterface } from 'src/background-script/types'
 
 type RootProps = Omit<DashboardDependencies, 'theme' | 'openSpaceInWebUI'> & {
  rootEl: HTMLElement
+ bgScriptBG: RemoteBGScriptInterface
 }
 
 interface RootState {
@@ -60,6 +62,9 @@ class Root extends React.PureComponent<RootProps, RootState> {
  getRootElement={() => rootEl}
  onResultSelect={(exportedResultText) => null}
  closeInPageMode={() => this.removeRoot(rootEl)}
+ openSettings={() => {
+ this.props.bgScriptBG.openOptionsTab('settings')
+ }}
  />
  </InPageSearchModal>
  </ThemeProvider>