fix(navbar): update graphql endpoint. remove sidebar

apps/typesync/client/src/Components/CmdPalette.tsx

@@ -169,13 +169,23 @@ export function CmdPalette() {
                 as="ul"
                 className="max-h-80 scroll-py-2 divide-y divide-gray-500/20 overflow-y-auto"
               >
-                <li className="p-2">
-                  <ul className="text-sm text-gray-400">
-                    {results.map((result) => (
-                      <Option key={result.id} result={result} />
-                    ))}
-                  </ul>
-                </li>
+                {query === '' && !isLoading && results.length === 0 ? (
+                  <div className="px-6 py-10 text-center text-sm sm:px-14 flex flex-col items-center gap-y-2">
+                    <p className="font-semibold text-gray-900">No apps created</p>
+                    <p className="text-gray-500">
+                      Get started by creating a new App, building the App schema, and generating the hypergraph schema
+                      code. Click the "Create new app" option below
+                    </p>
+                  </div>
+                ) : (
+                  <li className="p-2">
+                    <ul className="text-sm text-gray-400">
+                      {results.map((result) => (
+                        <Option key={result.id} result={result} />
+                      ))}
+                    </ul>
+                  </li>
+                )}
                 {query === '' && !isLoading ? (
                   <li className="p-2">
                     <h2 className="sr-only">Quick actions</h2>

apps/typesync/client/src/clients/graphql.ts

@@ -1,3 +1,3 @@
 import { GraphQLClient } from 'graphql-request';
 
-export const graphqlClient = new GraphQLClient('https://hypergraph-v2.up.railway.app/graphql');
+export const graphqlClient = new GraphQLClient('https://hypergraph-v2-testnet.up.railway.app/graphql');

apps/typesync/client/src/generated/gql.ts

@@ -1,7 +1,8 @@
 /* eslint-disable */
-import * as types from './graphql';
 import type { TypedDocumentNode as DocumentNode } from '@graphql-typed-document-node/core';
 
+import * as types from './graphql';
+
 /**
  * Map of all GraphQL operations in the project.
  *

apps/typesync/client/src/generated/graphql.ts

@@ -1,5 +1,6 @@
 /* eslint-disable */
 import type { TypedDocumentNode as DocumentNode } from '@graphql-typed-document-node/core';
+
 export type Maybe<T> = T | null;
 export type InputMaybe<T> = Maybe<T>;
 export type Exact<T extends { [key: string]: unknown }> = { [K in keyof T]: T[K] };
@@ -16,6 +17,19 @@ export type Scalars = {
   Float: { input: number; output: number; }
 };
 
+export type Account = {
+  __typename?: 'Account';
+  address: Scalars['String']['output'];
+  id: Scalars['ID']['output'];
+  spacesWhereEdtitor?: Maybe<Array<Maybe<Space>>>;
+  spacesWhereMember?: Maybe<Array<Maybe<Space>>>;
+};
+
+export type AddressFilter = {
+  in?: InputMaybe<Array<Scalars['String']['input']>>;
+  is?: InputMaybe<Scalars['String']['input']>;
+};
+
 export type Block = {
   __typename?: 'Block';
   dataSourceType?: Maybe<DataSourceType>;
@@ -50,6 +64,7 @@ export type DataType =
 
 export type Entity = {
   __typename?: 'Entity';
+  backlinks: Array<Maybe<Relation>>;
   blocks: Array<Maybe<Block>>;
   createdAt: Scalars['String']['output'];
   createdAtBlock: Scalars['String']['output'];
@@ -65,6 +80,12 @@ export type Entity = {
 };
 
 
+export type EntityBacklinksArgs = {
+  filter?: InputMaybe<RelationFilter>;
+  spaceId?: InputMaybe<Scalars['String']['input']>;
+};
+
+
 export type EntityRelationsArgs = {
   filter?: InputMaybe<RelationFilter>;
   spaceId?: InputMaybe<Scalars['String']['input']>;
@@ -77,26 +98,41 @@ export type EntityValuesArgs = {
 };
 
 export type EntityFilter = {
-  NOT?: InputMaybe<EntityFilter>;
-  OR?: InputMaybe<Array<EntityFilter>>;
-  fromRelation?: InputMaybe<RelationFilter>;
+  backlinks?: InputMaybe<RelationFilter>;
   id?: InputMaybe<IdFilter>;
-  toRelation?: InputMaybe<RelationFilter>;
+  not?: InputMaybe<EntityFilter>;
+  or?: InputMaybe<Array<EntityFilter>>;
+  relations?: InputMaybe<RelationFilter>;
+  types?: InputMaybe<IdFilter>;
   value?: InputMaybe<ValueFilter>;
 };
 
 export type IdFilter = {
   in?: InputMaybe<Array<Scalars['String']['input']>>;
 };
 
+export type Membership = {
+  __typename?: 'Membership';
+  address: Scalars['String']['output'];
+  id: Scalars['ID']['output'];
+  space?: Maybe<Space>;
+  spaceId: Scalars['String']['output'];
+};
+
+export type Meta = {
+  __typename?: 'Meta';
+  blockCursor?: Maybe<Scalars['String']['output']>;
+  blockNumber?: Maybe<Scalars['String']['output']>;
+};
+
 export type NumberFilter = {
-  NOT?: InputMaybe<NumberFilter>;
   exists?: InputMaybe<Scalars['Boolean']['input']>;
   greaterThan?: InputMaybe<Scalars['Float']['input']>;
   greaterThanOrEqual?: InputMaybe<Scalars['Float']['input']>;
   is?: InputMaybe<Scalars['Float']['input']>;
   lessThan?: InputMaybe<Scalars['Float']['input']>;
   lessThanOrEqual?: InputMaybe<Scalars['Float']['input']>;
+  not?: InputMaybe<NumberFilter>;
 };
 
 export type PointFilter = {
@@ -110,23 +146,36 @@ export type Property = {
   entity?: Maybe<Entity>;
   id: Scalars['ID']['output'];
   relationValueTypes?: Maybe<Array<Maybe<Type>>>;
-  renderableType?: Maybe<RenderableType>;
+  renderableType?: Maybe<Scalars['String']['output']>;
 };
 
 export type PropertyFilter = {
   dataType?: InputMaybe<DataType>;
+  id?: InputMaybe<IdFilter>;
 };
 
 export type Query = {
   __typename?: 'Query';
+  account?: Maybe<Account>;
   entities: Array<Maybe<Entity>>;
   entity?: Maybe<Entity>;
+  meta?: Maybe<Meta>;
   properties: Array<Maybe<Property>>;
+  property?: Maybe<Property>;
+  relation?: Maybe<Relation>;
+  relations: Array<Maybe<Relation>>;
   search: Array<Maybe<Entity>>;
+  space?: Maybe<Space>;
+  spaces: Array<Maybe<Space>>;
   types: Array<Maybe<Type>>;
 };
 
 
+export type QueryAccountArgs = {
+  address: Scalars['String']['input'];
+};
+
+
 export type QueryEntitiesArgs = {
   filter?: InputMaybe<EntityFilter>;
   limit?: InputMaybe<Scalars['Int']['input']>;
@@ -148,7 +197,26 @@ export type QueryPropertiesArgs = {
 };
 
 
+export type QueryPropertyArgs = {
+  id: Scalars['String']['input'];
+};
+
+
+export type QueryRelationArgs = {
+  id: Scalars['String']['input'];
+};
+
+
+export type QueryRelationsArgs = {
+  filter?: InputMaybe<RelationFilter>;
+  limit?: InputMaybe<Scalars['Int']['input']>;
+  offset?: InputMaybe<Scalars['Int']['input']>;
+  spaceId?: InputMaybe<Scalars['String']['input']>;
+};
+
+
 export type QuerySearchArgs = {
+  filter?: InputMaybe<SearchFilter>;
   limit?: InputMaybe<Scalars['Int']['input']>;
   offset?: InputMaybe<Scalars['Int']['input']>;
   query: Scalars['String']['input'];
@@ -157,6 +225,18 @@ export type QuerySearchArgs = {
 };
 
 
+export type QuerySpaceArgs = {
+  id: Scalars['String']['input'];
+};
+
+
+export type QuerySpacesArgs = {
+  filter?: InputMaybe<SpaceFilter>;
+  limit?: InputMaybe<Scalars['Int']['input']>;
+  offset?: InputMaybe<Scalars['Int']['input']>;
+};
+
+
 export type QueryTypesArgs = {
   limit?: InputMaybe<Scalars['Int']['input']>;
   offset?: InputMaybe<Scalars['Int']['input']>;
@@ -181,21 +261,52 @@ export type Relation = {
 };
 
 export type RelationFilter = {
+  fromEntity?: InputMaybe<EntityFilter>;
   fromEntityId?: InputMaybe<Scalars['String']['input']>;
+  relationEntity?: InputMaybe<EntityFilter>;
+  relationEntityId?: InputMaybe<Scalars['String']['input']>;
+  toEntity?: InputMaybe<EntityFilter>;
   toEntityId?: InputMaybe<Scalars['String']['input']>;
+  type?: InputMaybe<IdFilter>;
   typeId?: InputMaybe<Scalars['String']['input']>;
 };
 
-export type RenderableType =
-  | 'IMAGE'
-  | 'URL';
+export type SearchFilter = {
+  not?: InputMaybe<SearchFilter>;
+  or?: InputMaybe<Array<SearchFilter>>;
+  types?: InputMaybe<IdFilter>;
+};
+
+export type Space = {
+  __typename?: 'Space';
+  daoAddress: Scalars['String']['output'];
+  editors?: Maybe<Array<Membership>>;
+  entity?: Maybe<Entity>;
+  id: Scalars['ID']['output'];
+  mainVotingAddress?: Maybe<Scalars['String']['output']>;
+  members?: Maybe<Array<Membership>>;
+  membershipAddress?: Maybe<Scalars['String']['output']>;
+  personalAddress?: Maybe<Scalars['String']['output']>;
+  spaceAddress: Scalars['String']['output'];
+  type: SpaceType;
+};
+
+export type SpaceFilter = {
+  editor?: InputMaybe<AddressFilter>;
+  id?: InputMaybe<IdFilter>;
+  member?: InputMaybe<AddressFilter>;
+};
+
+export type SpaceType =
+  | 'PERSONAL'
+  | 'PUBLIC';
 
 export type TextFilter = {
-  NOT?: InputMaybe<TextFilter>;
   contains?: InputMaybe<Scalars['String']['input']>;
   endsWith?: InputMaybe<Scalars['String']['input']>;
   exists?: InputMaybe<Scalars['Boolean']['input']>;
   is?: InputMaybe<Scalars['String']['input']>;
+  not?: InputMaybe<TextFilter>;
   startsWith?: InputMaybe<Scalars['String']['input']>;
 };
 

apps/typesync/client/src/routes/__root.tsx

@@ -1,17 +1,16 @@
 'use client';
 
-import { MagnifyingGlassIcon } from '@heroicons/react/20/solid';
+import { RectangleGroupIcon } from '@heroicons/react/24/outline';
+import { MagnifyingGlassIcon, PlusIcon } from '@heroicons/react/24/solid';
 import { GithubLogoIcon } from '@phosphor-icons/react';
 import type { QueryClient } from '@tanstack/react-query';
 import { Link, Outlet, createRootRouteWithContext } from '@tanstack/react-router';
 import type { GraphQLClient } from 'graphql-request';
 import { useAtom } from 'jotai';
 
-import { AppSpacesNavbar, navbarExpandedAtom } from '../Components/AppsNavbar.js';
 import { CmdPalette, cmdPaletteOpenAtom } from '../Components/CmdPalette.js';
 import { appsQueryOptions } from '../hooks/useAppQuery.js';
 import { useOSQuery } from '../hooks/useOSQuery.js';
-import { classnames } from '../utils/classnames.js';
 
 export type RouterContext = Readonly<{
   queryClient: QueryClient;
@@ -28,28 +27,44 @@ export const Route = createRootRouteWithContext<RouterContext>()({
 
 function Layout() {
   const { data: os } = useOSQuery();
+
   const [, setCmdPaletteOpen] = useAtom(cmdPaletteOpenAtom);
-  const [navbarExpanded] = useAtom(navbarExpandedAtom);
 
   return (
     <div>
-      <div className="fixed inset-y-0 z-50 w-72 flex flex-col h-full">
-        <div className="flex grow flex-col overflow-y-auto h-full">
-          <Link
-            to="/"
-            className="flex h-16 shrink-0 items-center justify-center text-xl border-b border-gray-200 dark:border-slate-800 bg-white dark:bg-slate-950 cursor-pointer"
-          >
-            Hypergraph TypeSync
-          </Link>
-          <div className={classnames('bg-white dark:bg-slate-900 2xl:w-72 h-full', navbarExpanded ? 'w-72' : 'w-16')}>
-            <AppSpacesNavbar />
+      <div>
+        <div className="sticky top-0 z-40 flex h-16 shrink-0 items-center justify-between gap-x-4 border-b border-gray-200 dark:border-slate-800 bg-white dark:bg-slate-950 shadow-sm px-4">
+          <div className="flex w-fit items-center h-16">
+            <Link
+              to="/"
+              className="flex h-16 shrink-0 items-center justify-center text-xl border-b border-gray-200 dark:border-slate-800 bg-white dark:bg-slate-950 cursor-pointer"
+            >
+              Hypergraph TypeSync
+            </Link>
           </div>
-        </div>
-      </div>
-
-      <div className={classnames('2xl:pl-72', navbarExpanded ? 'pl-72' : 'pl-16')}>
-        <div className="sticky top-0 z-40 flex h-16 shrink-0 items-center justify-end gap-x-4 border-b border-gray-200 dark:border-slate-800 bg-white dark:bg-slate-950 shadow-sm px-4">
-          <div className="flex flex-1 items-center justify-end self-end w-fit gap-x-6 h-16">
+          <nav className="flex flex-1 items-center h-16 shrink-0 space-x-3 2xl:space-x-4">
+            <Link
+              to="/"
+              activeOptions={{ exact: true }}
+              activeProps={{ className: 'bg-indigo-500 text-white' }}
+              inactiveProps={{ className: 'bg-white dark:bg-slate-950 text-gray-950 dark:text-white' }}
+              className="hover:bg-gray-100 dark:hover:bg-slate-700 rounded-md px-3 py-2 text-sm font-medium inline-flex items-center justify-center gap-x-1"
+            >
+              <RectangleGroupIcon className="size-4 -mt-0.5" aria-hidden="true" />
+              Dashboard
+            </Link>
+            <Link
+              to="/apps/create"
+              activeOptions={{ exact: true }}
+              activeProps={{ className: 'bg-indigo-500 text-white' }}
+              inactiveProps={{ className: 'bg-white dark:bg-slate-950 text-gray-950 dark:text-white' }}
+              className="hover:bg-gray-100 dark:hover:bg-slate-700 rounded-md px-3 py-2 text-sm font-medium inline-flex items-center justify-center gap-x-1"
+            >
+              <PlusIcon className="size-4 -mt-0.5" aria-hidden="true" />
+              New App
+            </Link>
+          </nav>
+          <div className="flex items-center justify-end self-end w-fit gap-x-6 h-16">
             <button
               type="button"
               className="min-w-fit w-72 inline-flex items-center justify-between cursor-pointer rounded-4xl text-gray-900 dark:text-gray-300 shadow-sm gap-x-2 pl-2 pr-3 py-1 bg-gray-200 hover:bg-gray-300 dark:bg-slate-800 dark:hover:bg-slate-700"

apps/typesync/graphql.codegen.ts

@@ -14,7 +14,7 @@ const config = {
   overwrite: true,
   generates: {
     './client/src/generated/': {
-      schema: 'https://hypergraph-v2.up.railway.app/graphql',
+      schema: 'https://hypergraph-v2-testnet.up.railway.app/graphql',
       documents: ['./client/src/**/*.{ts,tsx}'],
       preset: 'client',
       config: pluginConfig,