interface: update settings callsites

pkg/interface/src/logic/state/settings.ts

@@ -45,7 +45,7 @@ export interface SettingsState {
   keyboard: ShortcutMapping;
   remoteContentPolicy: RemoteContentPolicy;
   getAll: () => Promise<void>;
-  putEntry: (bucket: string, key: string, value: Value) => void;
+  putEntry: (bucket: string, key: string, value: Value) => Promise<void>;
   leap: {
     categories: LeapCategories[];
   };
@@ -108,7 +108,7 @@ const useSettingsState = createState<SettingsState>(
         }
       });
     },
-    putEntry: (bucket: string, entry: string, value: Value) => {
+    putEntry: async (bucket: string, entry: string, value: Value) => {
       const poke = putEntry((window as any).desk, bucket, entry, value);
       pokeOptimisticallyN(useSettingsState, poke, reduceUpdate);
     }

pkg/interface/src/views/apps/launch/App.tsx

@@ -32,7 +32,6 @@ import Tiles from './components/tiles';
 import Tile from './components/tiles/tile';
 import './css/custom.css';
 import { join } from '@urbit/api/groups';
-import { putEntry } from '@urbit/api/settings';
 import { joinGraph } from '@urbit/api/graph';
 import airlock from '~/logic/api';
 
@@ -103,15 +102,17 @@ export const LaunchApp = (props: LaunchAppProps): ReactElement | null => {
     maxWidth: '350px',
     modal: function modal(dismiss) {
       const onDismiss = (e) => {
+        const { putEntry } = useSettingsState.getState();
         e.stopPropagation();
-        airlock.poke(putEntry('tutorial', 'seen', true));
+        putEntry('tutorial', 'seen', true);
         dismiss();
       };
       const onContinue = async (e) => {
+        const { putEntry } = useSettingsState.getState();
         e.stopPropagation();
         if (!hasTutorialGroup({ associations })) {
           await airlock.poke(join(TUTORIAL_HOST, TUTORIAL_GROUP));
-          await airlock.poke(putEntry('tutorial', 'joined', Date.now()));
+          await putEntry('tutorial', 'joined', Date.now());
           await waiter(hasTutorialGroup);
           await Promise.all(
             [TUTORIAL_BOOK, TUTORIAL_CHAT, TUTORIAL_LINKS].map(graph => airlock.thread(joinGraph(TUTORIAL_HOST, graph))));

pkg/interface/src/views/apps/settings/components/lib/LeapSettings.tsx

@@ -4,7 +4,6 @@ import {
     ManagedCheckboxField, Text
 } from '@tlon/indigo-react';
 import { Form, useFormikContext } from 'formik';
-import { putEntry } from '@urbit/api/settings';
 import _ from 'lodash';
 import React from 'react';
 import useSettingsState, { selectSettingsState } from '~/logic/state/settings';
@@ -15,7 +14,6 @@ import {
 import { FormikOnBlur } from '~/views/components/FormikOnBlur';
 import { ShuffleFields } from '~/views/components/ShuffleFields';
 import { BackButton } from './BackButton';
-import airlock from '~/logic/api';
 
 const labels: Record<LeapCategories, string> = {
   mychannel: 'My Channels',
@@ -60,11 +58,12 @@ export function LeapSettings() {
   };
 
   const onSubmit = async (values: FormSchema) => {
+    const { putEntry } = useSettingsState.getState();
     const result = values.categories.reduce(
       (acc, { display, category }) => (display ? [...acc, category] : acc),
       [] as LeapCategories[]
     );
-    await airlock.poke(putEntry('leap', 'categories', result));
+    await putEntry('leap', 'categories', result);
   };
 
   return (

pkg/interface/src/views/apps/settings/components/lib/ShortcutSettings.tsx

@@ -3,7 +3,6 @@ import _ from 'lodash';
 
 import { Box, Col, Text } from '@tlon/indigo-react';
 import { Formik, Form, useField } from 'formik';
-import { putEntry } from '@urbit/api/settings';
 
 import { getChord } from '~/logic/lib/util';
 import useSettingsState, {
@@ -12,7 +11,6 @@ import useSettingsState, {
 } from '~/logic/state/settings';
 import { AsyncButton } from '~/views/components/AsyncButton';
 import { BackButton } from './BackButton';
-import airlock from '~/logic/api';
 
 const settingsSel = selectSettingsState(['keyboard']);
 
@@ -69,9 +67,10 @@ export default function ShortcutSettings() {
       initialValues={keyboard}
       onSubmit={async (values: ShortcutMapping, actions) => {
         const promises = _.map(values, (value, key) => {
+          const { putEntry } = useSettingsState.getState();
           return keyboard[key] !== value
-            ? airlock.poke(putEntry('keyboard', key, value))
-            : Promise.resolve(0);
+            ? putEntry('keyboard', key, value)
+            : Promise.resolve();
         });
         await Promise.all(promises);
         actions.setStatus({ success: null });

pkg/interface/src/views/landscape/components/JoinGroup.tsx

@@ -4,7 +4,7 @@ import {
     ManagedTextInputField as Input, Row,
     Text
 } from '@tlon/indigo-react';
-import { join, MetadataUpdatePreview, putEntry } from '@urbit/api';
+import { join, MetadataUpdatePreview } from '@urbit/api';
 import { Form, Formik, FormikHelpers, useFormikContext } from 'formik';
 import _ from 'lodash';
 import React, { ReactElement, useCallback, useEffect, useState } from 'react';
@@ -22,6 +22,7 @@ import { FormError } from '~/views/components/FormError';
 import { StatelessAsyncButton } from '~/views/components/StatelessAsyncButton';
 import { GroupSummary } from './GroupSummary';
 import airlock from '~/logic/api';
+import useSettingsState from '~/logic/state/settings';
 
 const formSchema = Yup.object({
   group: Yup.string()
@@ -73,8 +74,9 @@ export function JoinGroup(props: JoinGroupProps): ReactElement {
 
   const onConfirm = useCallback(async (group: string) => {
     const [,,ship,name] = group.split('/');
+    const { putEntry } = useSettingsState.getState();
     if(group === TUTORIAL_GROUP_RESOURCE) {
-      await airlock.poke(putEntry('tutorial', 'joined', Date.now()));
+      await putEntry('tutorial', 'joined', Date.now());
     }
     if (group in groups) {
       return history.push(`/~landscape${group}`);

pkg/interface/src/views/landscape/components/TutorialModal.tsx

@@ -1,5 +1,5 @@
 import { Box, Button, Col, Icon, Row, Text } from '@tlon/indigo-react';
-import { leaveGroup, putEntry } from '@urbit/api';
+import { leaveGroup } from '@urbit/api';
 import _ from 'lodash';
 import React, { useCallback, useEffect, useState } from 'react';
 import { useHistory } from 'react-router-dom';
@@ -16,6 +16,7 @@ import { Portal } from '~/views/components/Portal';
 import { StatelessAsyncButton } from '~/views/components/StatelessAsyncButton';
 import { Triangle } from '~/views/components/Triangle';
 import airlock from '~/logic/api';
+import useSettingsState from '~/logic/state/settings';
 
 const localSelector = selectLocalState([
   'tutorialProgress',
@@ -94,7 +95,8 @@ export function TutorialModal() {
   const dismiss = useCallback(async () => {
     setPaused(false);
     hideTutorial();
-    await airlock.poke(putEntry('tutorial', 'seen', true));
+    const { putEntry } = useSettingsState.getState();
+    await putEntry('tutorial', 'seen', true);
   }, [hideTutorial]);
 
   const bailExit = useCallback(() => {