ssh tunnel - alternative modes

packages/web/src/utility/forms.js

@@ -15,6 +15,13 @@ import axios from './axios';
 import useTheme from '../theme/useTheme';
 import { useForm, useFormFieldTemplate } from './FormProvider';
 import { FontIcon } from '../icons';
+import getElectron from './getElectron';
+import InlineButton from '../widgets/InlineButton';
+import styled from 'styled-components';
+
+const FlexContainer = styled.div`
+  display: flex;
+`;
 
 export function FormFieldTemplate({ label, children, type }) {
   const FieldTemplate = useFormFieldTemplate();
@@ -321,3 +328,32 @@ export function FormArchiveFolderSelect({ name, additionalFolders = [], ...other
     />
   );
 }
+
+export function FormElectronFileSelectorRaw({ name }) {
+  const { values, setFieldValue } = useForm();
+  const handleBrowse = () => {
+    const electron = getElectron();
+    if (!electron) return;
+    const filePaths = electron.remote.dialog.showOpenDialogSync(electron.remote.getCurrentWindow(), {
+      defaultPath: values[name],
+      properties: ['showHiddenFiles'],
+    });
+    const filePath = filePaths && filePaths[0];
+    if (filePath) setFieldValue(name, filePath);
+  };
+  return (
+    <FlexContainer>
+      <TextField value={values[name]} onClick={handleBrowse} readOnly />
+      <InlineButton onClick={handleBrowse}>Browse</InlineButton>
+    </FlexContainer>
+  );
+}
+
+export function FormElectronFileSelector({ label, name, ...other }) {
+  const FieldTemplate = useFormFieldTemplate();
+  return (
+    <FieldTemplate label={label} type="select">
+      <FormElectronFileSelectorRaw name={name} {...other} />
+    </FieldTemplate>
+  );
+}

packages/web/src/utility/metadataLoaders.js

@@ -46,6 +46,12 @@ const configLoader = () => ({
   reloadTrigger: 'config-changed',
 });
 
+const platformInfoLoader = () => ({
+  url: 'config/platform-info',
+  params: {},
+  reloadTrigger: 'platform-info-changed',
+});
+
 const favoritesLoader = () => ({
   url: 'files/favorites',
   params: {},
@@ -253,6 +259,13 @@ export function useConfig() {
   return useCore(configLoader, {}) || {};
 }
 
+export function getPlatformInfo() {
+  return getCore(platformInfoLoader, {}) || {};
+}
+export function usePlatformInfo() {
+  return useCore(platformInfoLoader, {}) || {};
+}
+
 export function getArchiveFiles(args) {
   return getCore(archiveFilesLoader, args);
 }