Update graph data when Emacs node changes + minor improvements

11 files changed, 0 insertions, 653 deletions

diff --git a/app_expo/screens/demo/demo-list-screen.tsx b/app_expo/screens/demo/demo-list-screen.tsx
deleted file mode 100644
index 9164ccb..0000000
--- a/app_expo/screens/demo/demo-list-screen.tsx
+++ /dev/null
@@ -1,86 +0,0 @@
-import React, { useEffect } from 'react'
-import { FlatList, TextStyle, View, ViewStyle, ImageStyle } from 'react-native'
-import { useNavigation } from '@react-navigation/native'
-import { observer } from 'mobx-react-lite'
-import { Header, Screen, Text, Wallpaper, AutoImage as Image } from '../../components'
-import { color, spacing } from '../../theme'
-import { useStores } from '../../models'
-
-const FULL: ViewStyle = {
-  flex: 1,
-}
-const CONTAINER: ViewStyle = {
-  backgroundColor: color.transparent,
-}
-const HEADER: TextStyle = {
-  paddingBottom: spacing[5] - 1,
-  paddingHorizontal: spacing[4],
-  paddingTop: spacing[3],
-}
-const HEADER_TITLE: TextStyle = {
-  fontSize: 12,
-  fontWeight: 'bold',
-  letterSpacing: 1.5,
-  lineHeight: 15,
-  textAlign: 'center',
-}
-const LIST_CONTAINER: ViewStyle = {
-  alignItems: 'center',
-  flexDirection: 'row',
-  padding: 10,
-}
-const IMAGE: ImageStyle = {
-  borderRadius: 35,
-  height: 65,
-  width: 65,
-}
-const LIST_TEXT: TextStyle = {
-  marginLeft: 10,
-}
-const FLAT_LIST: ViewStyle = {
-  paddingHorizontal: spacing[4],
-}
-
-export const DemoListScreen = observer(function DemoListScreen() {
-  const navigation = useNavigation()
-  const goBack = () => navigation.goBack()
-
-  const { characterStore } = useStores()
-  const { characters } = characterStore
-
-  useEffect(() => {
-    async function fetchData() {
-      await characterStore.getCharacters()
-    }
-
-    fetchData()
-  }, [])
-
-  return (
-    <View testID="DemoListScreen" style={FULL}>
-      <Wallpaper />
-      <Screen style={CONTAINER} preset="fixed" backgroundColor={color.transparent}>
-        <Header
-          headerTx="demoListScreen.title"
-          leftIcon="back"
-          onLeftPress={goBack}
-          style={HEADER}
-          titleStyle={HEADER_TITLE}
-        />
-        <FlatList
-          contentContainerStyle={FLAT_LIST}
-          data={[...characters]}
-          keyExtractor={(item) => String(item.id)}
-          renderItem={({ item }) => (
-            <View style={LIST_CONTAINER}>
-              <Image source={{ uri: item.image }} style={IMAGE} />
-              <Text style={LIST_TEXT}>
-                {item.name} ({item.status})
-              </Text>
-            </View>
-          )}
-        />
-      </Screen>
-    </View>
-  )
-})
diff --git a/app_expo/screens/demo/demo-screen.tsx b/app_expo/screens/demo/demo-screen.tsx
deleted file mode 100644
index a387c01..0000000
--- a/app_expo/screens/demo/demo-screen.tsx
+++ /dev/null
@@ -1,180 +0,0 @@
-import React from 'react'
-import { ImageStyle, Platform, TextStyle, View, ViewStyle } from 'react-native'
-import { useNavigation } from '@react-navigation/native'
-import { observer } from 'mobx-react-lite'
-import {
-  BulletItem,
-  Button,
-  Header,
-  Text,
-  Screen,
-  Wallpaper,
-  AutoImage as Image,
-} from '../../components'
-import { color, spacing } from '../../theme'
-import { Api } from '../../services/api'
-import { save } from '../../utils/storage'
-export const logoIgnite = require('./logo-ignite.png')
-export const heart = require('./heart.png')
-
-const FULL: ViewStyle = { flex: 1 }
-const CONTAINER: ViewStyle = {
-  backgroundColor: color.transparent,
-  paddingHorizontal: spacing[4],
-}
-const DEMO: ViewStyle = {
-  paddingVertical: spacing[4],
-  paddingHorizontal: spacing[4],
-  backgroundColor: color.palette.deepPurple,
-}
-const BOLD: TextStyle = { fontWeight: 'bold' }
-const DEMO_TEXT: TextStyle = {
-  ...BOLD,
-  fontSize: 13,
-  letterSpacing: 2,
-}
-const HEADER: TextStyle = {
-  paddingTop: spacing[3],
-  paddingBottom: spacing[5] - 1,
-  paddingHorizontal: 0,
-}
-const HEADER_TITLE: TextStyle = {
-  ...BOLD,
-  fontSize: 12,
-  lineHeight: 15,
-  textAlign: 'center',
-  letterSpacing: 1.5,
-}
-const TITLE: TextStyle = {
-  ...BOLD,
-  fontSize: 28,
-  lineHeight: 38,
-  textAlign: 'center',
-  marginBottom: spacing[5],
-}
-const TAGLINE: TextStyle = {
-  color: '#BAB6C8',
-  fontSize: 15,
-  lineHeight: 22,
-  marginBottom: spacing[4] + spacing[1],
-}
-const IGNITE: ImageStyle = {
-  marginVertical: spacing[6],
-  alignSelf: 'center',
-  width: 180,
-  height: 100,
-}
-const LOVE_WRAPPER: ViewStyle = {
-  flexDirection: 'row',
-  alignItems: 'center',
-  alignSelf: 'center',
-}
-const LOVE: TextStyle = {
-  color: '#BAB6C8',
-  fontSize: 15,
-  lineHeight: 22,
-}
-const HEART: ImageStyle = {
-  marginHorizontal: spacing[2],
-  width: 10,
-  height: 10,
-  resizeMode: 'contain',
-}
-const HINT: TextStyle = {
-  color: '#BAB6C8',
-  fontSize: 12,
-  lineHeight: 15,
-  marginVertical: spacing[2],
-}
-
-const platformCommand = Platform.select({
-  ios: 'Cmd + D',
-  android: 'Cmd/Ctrl + M',
-})
-
-export const DemoScreen = observer(function DemoScreen() {
-  const navigation = useNavigation()
-  const goBack = () => navigation.goBack()
-
-  const demoReactotron = React.useMemo(
-    () => async () => {
-      console.tron.log('Your Friendly tron log message')
-      console.tron.logImportant('I am important')
-      console.tron.display({
-        name: 'DISPLAY',
-        value: {
-          numbers: 1,
-          strings: 'strings',
-          booleans: true,
-          arrays: [1, 2, 3],
-          objects: {
-            deeper: {
-              deeper: {
-                yay: '👾',
-              },
-            },
-          },
-          functionNames: function hello() {
-            /* dummy function */
-          },
-        },
-        preview: 'More control with display()',
-        important: true,
-        image: {
-          uri: 'https://avatars2.githubusercontent.com/u/3902527?s=200&u=a0d16b13ed719f35d95ca0f4440f5d07c32c349a&v=4',
-        },
-      })
-      // make an API call for the demo
-      // Don't do API like this, use store's API
-      const demo = new Api()
-      demo.setup()
-      demo.getUser('1')
-      // Let's do some async storage stuff
-      await save('Cool Name', 'Boaty McBoatface')
-    },
-    [],
-  )
-
-  return (
-    <View testID="DemoScreen" style={FULL}>
-      <Wallpaper />
-      <Screen style={CONTAINER} preset="scroll" backgroundColor={color.transparent}>
-        <Header
-          headerTx="demoScreen.howTo"
-          leftIcon="back"
-          onLeftPress={goBack}
-          style={HEADER}
-          titleStyle={HEADER_TITLE}
-        />
-        <Text style={TITLE} preset="header" tx="demoScreen.title" />
-        <Text style={TAGLINE} tx="demoScreen.tagLine" />
-        <BulletItem text="Integrated here, Navigation with State, TypeScript, Storybook, Solidarity, and i18n." />
-        <BulletItem
-          text={`To run Storybook, press ${platformCommand} or shake the device to show the developer menu, then select "Toggle Storybook"`}
-        />
-        <BulletItem text="Load up Reactotron!  You can inspect your app, view the events, interact, and so much more!" />
-        <View>
-          <Button
-            style={DEMO}
-            textStyle={DEMO_TEXT}
-            tx="demoScreen.reactotron"
-            onPress={demoReactotron}
-          />
-          <Text style={HINT} tx={`demoScreen.${Platform.OS}ReactotronHint` as const} />
-        </View>
-        <Button
-          style={DEMO}
-          textStyle={DEMO_TEXT}
-          tx="demoScreen.demoList"
-          onPress={() => navigation.navigate('demoList')}
-        />
-        <Image source={logoIgnite} style={IGNITE} />
-        <View style={LOVE_WRAPPER}>
-          <Text style={LOVE} text="Made with" />
-          <Image source={heart} style={HEART} />
-          <Text style={LOVE} text="by Infinite Red" />
-        </View>
-      </Screen>
-    </View>
-  )
-})
diff --git a/app_expo/screens/demo/heart.png b/app_expo/screens/demo/heart.png
deleted file mode 100644
index 9890998..0000000
--- a/app_expo/screens/demo/heart.png
+++ /dev/null
diff --git a/app_expo/screens/demo/[email protected] b/app_expo/screens/demo/[email protected]
deleted file mode 100644
index e8b70d9..0000000
--- a/app_expo/screens/demo/[email protected]
+++ /dev/null
diff --git a/app_expo/screens/demo/logo-ignite.png b/app_expo/screens/demo/logo-ignite.png
deleted file mode 100644
index 36af16d..0000000
--- a/app_expo/screens/demo/logo-ignite.png
+++ /dev/null
diff --git a/app_expo/screens/demo/[email protected] b/app_expo/screens/demo/[email protected]
deleted file mode 100644
index fdbfad8..0000000
--- a/app_expo/screens/demo/[email protected]
+++ /dev/null
diff --git a/app_expo/screens/graph/graph-screen.tsx b/app_expo/screens/graph/graph-screen.tsx
deleted file mode 100644
index 8c35590..0000000
--- a/app_expo/screens/graph/graph-screen.tsx
+++ /dev/null
@@ -1,264 +0,0 @@
-import React, { useEffect, useState } from 'react'
-import { observer } from 'mobx-react-lite'
-import { TouchableOpacity, View, ViewStyle } from 'react-native'
-import { Screen, Text } from '../../components'
-// import { useNavigation } from "@react-navigation/native"
-// import { useStores } from "../../models"
-import { color } from '../../theme'
-
-import { Graph } from '../../components'
-import { Tweaks } from '../../components'
-
-import genRandomTree from '../../data/randomdata'
-
-import AsyncStorage from '@react-native-async-storage/async-storage'
-
-import axios from 'axios'
-
-import rando from '../../data/rando.json'
-
-const ROOT: ViewStyle = {
-  backgroundColor: color.palette.black,
-  flex: 1,
-}
-
-import { LocalButton } from '../../components/'
-import { GraphUi } from '../../components/graph-ui/graph-ui'
-import { Switch } from 'react-native-elements'
-export const GraphScreen = observer(function GraphScreen() {
-  // Pull in one of our MST stores
-  // const { someStore, anotherStore } = useStores()
-
-  // Pull in navigation via hook
-  // const navigation = useNavigation()
-
-  const [physics, setPhysics] = useState({})
-  const [graphData, setGraphData] = useState()
-  const [nodeIds, setNodeIds] = useState([])
-  //  { "nodes": [{ "id": 1 }, { "id": 2 }], "links": [{ "target": 1, "source": 2 }] });
-  const physicsInit = {
-    charge: -350,
-    collision: true,
-    linkStrength: 0.1,
-    linkIts: 1,
-    particles: 2,
-    linkOpacity: 0.4,
-    linkWidth: 1,
-    particleWidth: 4,
-    nodeRel: 4,
-    labels: true,
-    labelScale: 1.5,
-    alphaDecay: 0.16,
-    alphaTarget: 0,
-    velocityDecay: 0.25,
-    gravity: 0.5,
-    gravityOn: true,
-    hover: true,
-    colorful: true,
-    galaxy: true,
-    rootId: 0,
-  }
-
-  const getData = async () => {
-    try {
-      const value: string = await AsyncStorage.getItem('@physics')
-      if (value !== null) {
-        const valueJson = JSON.parse(value)
-        if (Object.keys(valueJson).length === Object.keys(physicsInit).length) {
-          valueJson.local = false
-          return valueJson
-        } else {
-          return physicsInit
-        }
-      } else {
-        return physicsInit
-      }
-    } catch (e) {
-      console.log(e)
-    }
-  }
-  const storeData = async (value) => {
-    try {
-      let jsonVal = JSON.stringify(value)
-      console.log(jsonVal + ' ' + value)
-      await AsyncStorage.setItem('@physics', jsonVal)
-    } catch (e) {
-      console.log(e)
-    }
-  }
-
-  // hook to save the current configuration of the physics tweaks
-  // after it is updated
-  useEffect(() => {
-    if (timer) {
-      clearTimeout(timer)
-    }
-    // set timer so the thing doesn't run every single slider tick
-    const timer = setTimeout(() => {
-      storeData(physics)
-    }, 1000)
-    return () => clearTimeout(timer)
-  }, [physics])
-
-  //"ComponentOnMount"
-  // Get previous settings and the data from the org-roam-server
-  const sanitizeGraph = (data) => {
-    const cleanLinks = []
-    data.links.forEach((link, j) => {
-      let target
-      let source
-      for (let i = 0; i < data.nodes.length; i++) {
-        let a = data.nodes[i]
-        !a.neighbors && (a.neighbors = [])
-        !a.links && (a.links = [])
-        // the first time around,
-        // index the node as not a part of the local graph
-        !j && (a.local = false)
-        if (link.target === data.nodes[i].id) {
-          a.links.push(link)
-          target = [a, i]
-          link.target === link.source ? null : cleanLinks.push(link)
-        } else if (link.source === data.nodes[i].id) {
-          a.links.push(link)
-          source = [a, i]
-        }
-      }
-      if (target && source) {
-        data.nodes[target[1]].neighbors.push(source[0])
-        data.nodes[source[1]].neighbors.push(target[0])
-        link.sourceIndex = source[1]
-        link.targetIndex = target[1]
-        link.index = [j]
-        link.local = false
-      }
-    })
-    data.links = cleanLinks
-    return data
-  }
-
-  const [theme, setTheme] = useState({
-    base1: '#1c1f24',
-    base2: '#21272d',
-    base3: '#23272e',
-    base4: '#484854',
-    base5: '#62686E',
-    base6: '#757B80',
-    base7: '#9ca0a4',
-    base8: '#DFDFDF',
-    bg: '#242730',
-    'bg-alt': '#2a2e38',
-    blue: '#51afef',
-    cyan: '#5cEfFF',
-    'dark-blue': '#1f5582',
-    'dark-cyan': '#6A8FBF',
-    fg: '#bbc2cf',
-    'fg-alt': '#5D656B',
-    green: '#7bc275',
-    grey: '#484854',
-    magenta: '#C57BDB',
-    orange: '#e69055',
-    red: '#ff665c',
-    teal: '#4db5bd',
-    violet: '#a991f1',
-    yellow: '#FCCE7B',
-  })
-
-  useEffect(() => {
-    getData().then((data) => setPhysics(data))
-    axios
-      .get('http://localhost:35901/theme')
-      .then((theme) => {
-        setTheme(theme.data)
-        console.log(theme.data)
-      })
-      .catch((e) => {
-        console.log('No theme found')
-      })
-    axios
-      .get('http://localhost:35901/graph')
-      .then((dataa) => {
-        let cleanData = sanitizeGraph(dataa.data)
-        console.log(cleanData)
-        setGraphData(cleanData)
-      })
-      .catch((e) => {
-        console.log(e)
-        console.log("Couldn't get data.")
-        //setGraphData(rando);
-      })
-  }, [])
-
-  const [threeDim, setThreeDim] = useState(false)
-  const [local, setLocal] = useState(false)
-
-  if (!graphData) {
-    return null
-  } else {
-    return (
-      <Screen style={ROOT} preset="fixed">
-        <View
-          style={{
-            display: 'flex',
-            flexDirection: 'row',
-            height: '100%',
-            width: '100%',
-            position: 'absolute',
-            zIndex: 150,
-          }}
-        >
-          <Tweaks physics={physics} setPhysics={setPhysics} />
-          <View
-            style={{
-              marginLeft: 'auto',
-              marginRight: '2%',
-              marginTop: '2%',
-              zIndex: 5,
-              position: 'relative',
-              height: '15%',
-            }}
-          >
-            <LocalButton local={local} setLocal={setLocal} />
-            <View
-              style={{
-                display: 'flex',
-                flexDirection: 'row',
-                alignItems: 'center',
-                justifyContent: 'center',
-                paddingTop: '2%',
-              }}
-            >
-              <Text preset="header" text="3D" style={{ marginLeft: 10 }} />
-              <Switch
-                color="#a991f1"
-                trackColor={{
-                  false: '#62686E',
-                  true: '#a991f1',
-                }}
-                style={{
-                  height: 25,
-                  marginVertical: 10,
-                  marginLeft: 20,
-                }}
-                value={threeDim}
-                onValueChange={() => {
-                  setThreeDim(!threeDim)
-                }}
-              />
-            </View>
-          </View>
-          <Graph
-            style={{ position: 'absolute' }}
-            setPhysics={setPhysics}
-            physics={physics}
-            gData={graphData}
-            nodeIds={nodeIds}
-            threeDim={threeDim}
-            setThreeDim={setThreeDim}
-            local={local}
-            setLocal={setLocal}
-          />
-        </View>
-      </Screen>
-    )
-  }
-})
diff --git a/app_expo/screens/index.ts b/app_expo/screens/index.ts
deleted file mode 100644
index 1ba716f..0000000
--- a/app_expo/screens/index.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-export * from './welcome/welcome-screen'
-export * from './demo/demo-screen'
-export * from './demo/demo-list-screen'
-// export other screens here
-export * from './graph/graph-screen'
diff --git a/app_expo/screens/welcome/bowser.png b/app_expo/screens/welcome/bowser.png
deleted file mode 100644
index 2b0bdbc..0000000
--- a/app_expo/screens/welcome/bowser.png
+++ /dev/null
diff --git a/app_expo/screens/welcome/[email protected] b/app_expo/screens/welcome/[email protected]
deleted file mode 100644
index 85cc693..0000000
--- a/app_expo/screens/welcome/[email protected]
+++ /dev/null
diff --git a/app_expo/screens/welcome/welcome-screen.tsx b/app_expo/screens/welcome/welcome-screen.tsx
deleted file mode 100644
index 49a6777..0000000
--- a/app_expo/screens/welcome/welcome-screen.tsx
+++ /dev/null
@@ -1,118 +0,0 @@
-import React from 'react'
-import { View, ViewStyle, TextStyle, ImageStyle, SafeAreaView } from 'react-native'
-import { useNavigation } from '@react-navigation/native'
-import { observer } from 'mobx-react-lite'
-import { Button, Header, Screen, Text, Wallpaper, AutoImage as Image } from '../../components'
-import { color, spacing, typography } from '../../theme'
-const bowserLogo = require('./bowser.png')
-
-const FULL: ViewStyle = { flex: 1 }
-const CONTAINER: ViewStyle = {
-  backgroundColor: color.transparent,
-  paddingHorizontal: spacing[4],
-}
-const TEXT: TextStyle = {
-  color: color.palette.white,
-  fontFamily: typography.primary,
-}
-const BOLD: TextStyle = { fontWeight: 'bold' }
-const HEADER: TextStyle = {
-  paddingTop: spacing[3],
-  paddingBottom: spacing[4] + spacing[1],
-  paddingHorizontal: 0,
-}
-const HEADER_TITLE: TextStyle = {
-  ...TEXT,
-  ...BOLD,
-  fontSize: 12,
-  lineHeight: 15,
-  textAlign: 'center',
-  letterSpacing: 1.5,
-}
-const TITLE_WRAPPER: TextStyle = {
-  ...TEXT,
-  textAlign: 'center',
-}
-const TITLE: TextStyle = {
-  ...TEXT,
-  ...BOLD,
-  fontSize: 28,
-  lineHeight: 38,
-  textAlign: 'center',
-}
-const ALMOST: TextStyle = {
-  ...TEXT,
-  ...BOLD,
-  fontSize: 26,
-  fontStyle: 'italic',
-}
-const BOWSER: ImageStyle = {
-  alignSelf: 'center',
-  marginVertical: spacing[5],
-  maxWidth: '100%',
-  width: 343,
-  height: 230,
-}
-const CONTENT: TextStyle = {
-  ...TEXT,
-  color: '#BAB6C8',
-  fontSize: 15,
-  lineHeight: 22,
-  marginBottom: spacing[5],
-}
-const CONTINUE: ViewStyle = {
-  paddingVertical: spacing[4],
-  paddingHorizontal: spacing[4],
-  backgroundColor: color.palette.deepPurple,
-}
-const CONTINUE_TEXT: TextStyle = {
-  ...TEXT,
-  ...BOLD,
-  fontSize: 13,
-  letterSpacing: 2,
-}
-const FOOTER: ViewStyle = { backgroundColor: '#20162D' }
-const FOOTER_CONTENT: ViewStyle = {
-  paddingVertical: spacing[4],
-  paddingHorizontal: spacing[4],
-}
-
-export const WelcomeScreen = observer(function WelcomeScreen() {
-  const navigation = useNavigation()
-  const nextScreen = () => navigation.navigate('demo')
-
-  return (
-    <View testID="WelcomeScreen" style={FULL}>
-      <Wallpaper />
-      <Screen style={CONTAINER} preset="scroll" backgroundColor={color.transparent}>
-        <Header headerTx="welcomeScreen.poweredBy" style={HEADER} titleStyle={HEADER_TITLE} />
-        <Text style={TITLE_WRAPPER}>
-          <Text style={TITLE} text="Your new app, " />
-          <Text style={ALMOST} text="almost" />
-          <Text style={TITLE} text="!" />
-        </Text>
-        <Text style={TITLE} preset="header" tx="welcomeScreen.readyForLaunch" />
-        <Image source={bowserLogo} style={BOWSER} />
-        <Text style={CONTENT}>
-          This probably isn't what your app is going to look like. Unless your designer handed you
-          this screen and, in that case, congrats! You're ready to ship.
-        </Text>
-        <Text style={CONTENT}>
-          For everyone else, this is where you'll see a live preview of your fully functioning app
-          using Ignite.
-        </Text>
-      </Screen>
-      <SafeAreaView style={FOOTER}>
-        <View style={FOOTER_CONTENT}>
-          <Button
-            testID="next-screen-button"
-            style={CONTINUE}
-            textStyle={CONTINUE_TEXT}
-            tx="welcomeScreen.continue"
-            onPress={nextScreen}
-          />
-        </View>
-      </SafeAreaView>
-    </View>
-  )
-})