refactor: format and lint codebase (#971)

app/assets/javascripts/Components/Preferences/Panes/Account/SignOutView.tsx

@@ -0,0 +1,90 @@
+import { Button } from '@/Components/Button/Button'
+import { OtherSessionsSignOutContainer } from '@/Components/OtherSessionsSignOut'
+import {
+  PreferencesGroup,
+  PreferencesSegment,
+  Subtitle,
+  Text,
+  Title,
+} from '@/Components/Preferences/PreferencesComponents'
+import { WebApplication } from '@/UIModels/Application'
+import { AppState } from '@/UIModels/AppState'
+import { observer } from 'mobx-react-lite'
+import { FunctionComponent } from 'preact'
+
+const SignOutView: FunctionComponent<{
+  application: WebApplication
+  appState: AppState
+}> = observer(({ application, appState }) => {
+  return (
+    <>
+      <PreferencesGroup>
+        <PreferencesSegment>
+          <Title>Sign out</Title>
+          <Subtitle>Other devices</Subtitle>
+          <Text>Want to sign out on all devices except this one?</Text>
+          <div className="min-h-3" />
+          <div className="flex flex-row">
+            <Button
+              className="mr-3"
+              variant="normal"
+              label="Sign out other sessions"
+              onClick={() => {
+                appState.accountMenu.setOtherSessionsSignOut(true)
+              }}
+            />
+            <Button
+              variant="normal"
+              label="Manage sessions"
+              onClick={() => appState.openSessionsModal()}
+            />
+          </div>
+        </PreferencesSegment>
+        <PreferencesSegment>
+          <Subtitle>This workspace</Subtitle>
+          <Text>Remove all data related to the current workspace from the application.</Text>
+          <div className="min-h-3" />
+          <Button
+            dangerStyle={true}
+            label="Sign out workspace"
+            onClick={() => {
+              appState.accountMenu.setSigningOut(true)
+            }}
+          />
+        </PreferencesSegment>
+      </PreferencesGroup>
+      <OtherSessionsSignOutContainer appState={appState} application={application} />
+    </>
+  )
+})
+
+const ClearSessionDataView: FunctionComponent<{
+  appState: AppState
+}> = observer(({ appState }) => {
+  return (
+    <PreferencesGroup>
+      <PreferencesSegment>
+        <Title>Clear workspace</Title>
+        <Text>Remove all data related to the current workspace from the application.</Text>
+        <div className="min-h-3" />
+        <Button
+          dangerStyle={true}
+          label="Clear workspace"
+          onClick={() => {
+            appState.accountMenu.setSigningOut(true)
+          }}
+        />
+      </PreferencesSegment>
+    </PreferencesGroup>
+  )
+})
+
+export const SignOutWrapper: FunctionComponent<{
+  application: WebApplication
+  appState: AppState
+}> = observer(({ application, appState }) => {
+  if (!application.hasAccount()) {
+    return <ClearSessionDataView appState={appState} />
+  }
+  return <SignOutView appState={appState} application={application} />
+})