interface: reorganized groups directory structure to have like-kind components together

pkg/interface/src/views/App.js

@@ -14,7 +14,7 @@ import './css/fonts.css';
 import light from './themes/light';
 import dark from './themes/old-dark';
 
-import { Content } from './components/Content';
+import { Content } from './landscape/components/Content';
 import StatusBar from './components/StatusBar';
 import Omnibox from './components/leap/Omnibox';
 import ErrorBoundary from '~/views/components/ErrorBoundary';

pkg/interface/src/views/apps/profile/profile.tsx

@@ -8,7 +8,7 @@ import { Sigil } from "~/logic/lib/sigil";
 import { uxToHex, MOBILE_BROWSER_REGEX } from "~/logic/lib/util";
 
 import Settings from "./components/settings";
-import { ContactCard } from "../groups/components/ContactCard";
+import { ContactCard } from "~/views/landscape/components/ContactCard";
 
 const SidebarItem = ({ children, view, current }) => {
   const selected = current === view;

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

@@ -1,5 +1,5 @@
 import React, { useEffect } from "react";
-import { AsyncButton } from "../../../components/AsyncButton";
+import { AsyncButton } from "~/views/components/AsyncButton";
 import * as Yup from "yup";
 import {
   Box,

pkg/interface/src/views/landscape/components/Content.js

@@ -2,11 +2,11 @@ import React, { Component } from 'react';
 import { Route, Switch } from 'react-router-dom';
 import styled from 'styled-components';
 
-import LaunchApp from '../apps/launch/app';
-import DojoApp from '../apps/dojo/app';
-import GroupsApp from '../apps/groups/app';
-import Profile from '../apps/profile/profile';
-import ErrorComponent from './Error';
+import LaunchApp from '~/views/apps/launch/app';
+import DojoApp from '~/views/apps/dojo/app';
+import Landscape from '~/views/landscape/index';
+import Profile from '~/views/apps/profile/profile';
+import ErrorComponent from '~/views/components/Error';
 
 
 export const Container = styled.div`
@@ -42,7 +42,7 @@ export const Content = (props) => {
         <Route
           path='/~groups'
           render={p => (
-            <GroupsApp
+            <Landscape
               history={p.history}
               location={p.location}
               match={p.match}

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

@@ -1,5 +1,5 @@
 import React, { useEffect } from "react";
-import { AsyncButton } from "../../../components/AsyncButton";
+import { AsyncButton } from "~/views/components/AsyncButton";
 import * as Yup from "yup";
 import {
   Box,

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

@@ -8,9 +8,11 @@ import {
 import { Center, Box } from "@tlon/indigo-react";
 import _ from "lodash";
 
-import { Resource } from "~/views/components/Resource";
-import { PopoverRoutes } from "~/views/apps/groups/components/PopoverRoutes";
-import { Skeleton } from "~/views/components/Skeleton";
+import { Resource } from "./Resource";
+import { PopoverRoutes } from "./PopoverRoutes";
+import { Skeleton } from "./Skeleton";
+import { InvitePopover } from "./InvitePopover";
+import { NewChannel } from "./NewChannel";
 
 import { Resource as IResource, Groups } from "~/types/group-update";
 import { Associations } from "~/types/metadata-update";
@@ -19,11 +21,9 @@ import { AppName } from "~/types/noun";
 import { Contacts, Rolodex } from "~/types/contact-update";
 import GlobalApi from "~/logic/api/global";
 import { StoreState } from "~/logic/store/type";
-import { UnjoinedResource } from "./UnjoinedResource";
-import { InvitePopover } from "../apps/groups/components/InvitePopover";
+import { UnjoinedResource } from "~/views/components/UnjoinedResource";
 import { useLocalStorageState } from "~/logic/lib/useLocalStorageState";
-import { NewChannel } from "../apps/groups/components/NewChannel";
-import { Loading } from './Loading';
+import { Loading } from '~/views/components/Loading';
 
 import "~/views/apps/links/css/custom.css";
 import "~/views/apps/publish/css/custom.css";

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

@@ -11,8 +11,8 @@ import { Association } from "~/types/metadata-update";
 import { StoreState } from "~/logic/store/type";
 import GlobalApi from "~/logic/api/global";
 import { RouteComponentProps, Route, Switch } from "react-router-dom";
-import { ChannelSettings } from "../apps/groups/components/ChannelSettings";
-import { ResourceSkeleton } from "../apps/groups/components/ResourceSkeleton";
+import { ChannelSettings } from "./ChannelSettings";
+import { ResourceSkeleton } from "./ResourceSkeleton";
 
 const TruncatedBox = styled(Box)`
   white-space: nowrap;

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

@@ -17,7 +17,7 @@ import { SidebarInvite } from "./SidebarInvite";
 import GlobalApi from "~/logic/api/global";
 import { AppName } from "~/types/noun";
 import { alphabeticalOrder } from "~/logic/lib/util";
-import { GroupSwitcher } from "~/views/apps/groups/components/GroupSwitcher";
+import { GroupSwitcher } from "../GroupSwitcher";
 import {
   AppInvites,
   Associations,

pkg/interface/src/views/landscape/components/Sidebar/SidebarItem.tsx

@@ -6,7 +6,7 @@ import { Icon, Row, Box, Text } from "@tlon/indigo-react";
 import { Association } from "~/types/metadata-update";
 
 import { SidebarAppConfigs, SidebarItemStatus } from "./Sidebar";
-import { HoverBoxLink } from "../HoverBox";
+import { HoverBoxLink } from "~/views/components/HoverBox";
 import { Groups } from "~/types";
 
 function SidebarItemIndicator(props: { status?: SidebarItemStatus }) {

pkg/interface/src/views/landscape/components/Sidebar/SidebarListHeader.tsx

@@ -9,8 +9,8 @@ import {
   Col,
   Text,
 } from "@tlon/indigo-react";
-import { FormikOnBlur } from "../FormikOnBlur";
-import { Dropdown } from "../Dropdown";
+import { FormikOnBlur } from "~/views/components/FormikOnBlur";
+import { Dropdown } from "~/views/components/Dropdown";
 import { FormikHelpers } from "formik";
 import { SidebarListConfig } from "./types";
 

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

@@ -14,7 +14,7 @@ import styled from "styled-components";
 import GlobalSubscription from "~/logic/subscription/global";
 import { Workspace, Groups, Graphs } from "~/types";
 import { useChat, usePublish, useLinks } from "./Sidebar/Apps";
-import { Body } from "./Body";
+import { Body } from "~/views/components/Body";
 
 interface SkeletonProps {
   children: ReactNode;

pkg/interface/src/views/landscape/index.tsx

@@ -4,28 +4,26 @@ import { Box, Center } from '@tlon/indigo-react';
 
 import './css/custom.css';
 
-import { Skeleton as NewSkeleton } from '~/views/components/Skeleton';
-
 import { PatpNoSig, AppName } from '~/types/noun';
 import GlobalApi from '~/logic/api/global';
 import { StoreState } from '~/logic/store/type';
 import GlobalSubscription from '~/logic/subscription/global';
-import {Resource} from '~/views/components/Resource';
-import {PopoverRoutes} from './components/PopoverRoutes';
-import {UnjoinedResource} from '~/views/components/UnjoinedResource';
-import {GroupsPane} from '~/views/components/GroupsPane';
-import {Workspace} from '~/types';
+import { Resource } from '~/views/components/Resource';
+import { PopoverRoutes } from './components/PopoverRoutes';
+import { UnjoinedResource } from '~/views/components/UnjoinedResource';
+import { GroupsPane } from './components/GroupsPane';
+import { Workspace } from '~/types';
 
 
-type GroupsAppProps = StoreState & {
+type LandscapeProps = StoreState & {
   ship: PatpNoSig;
   api: GlobalApi;
   subscription: GlobalSubscription;
 }
 
-export default class GroupsApp extends Component<GroupsAppProps, {}> {
+export default class Landscape extends Component<LandscapeProps, {}> {
   componentDidMount() {
-    document.title = 'OS1 - Groups';
+    document.title = 'OS1 - Landscape';
     // preload spinner asset
     new Image().src = '/~landscape/img/Spinner.png';