Fix parsedConfigurations type

Author: MichaelDeBoey

packages/app/src/app/overmind/namespaces/editor/state.ts

@@ -1,7 +1,10 @@
 import getTemplate from '@codesandbox/common/lib/templates';
 import { generateFileFromSandbox } from '@codesandbox/common/lib/templates/configuration/package-json';
 import { getPreviewTabs } from '@codesandbox/common/lib/templates/devtools';
-import { ViewConfig } from '@codesandbox/common/lib/templates/template';
+import {
+  ParsedConfigurationFiles,
+  ViewConfig,
+} from '@codesandbox/common/lib/templates/template';
 import {
   DevToolsTabPosition,
   DiffTab,
@@ -56,7 +59,7 @@ type State = {
   mainModule: Derive<State, Module>;
   currentPackageJSON: Derive<State, Module>;
   currentPackageJSONCode: Derive<State, string>;
-  parsedConfigurations: Derive<State, any>;
+  parsedConfigurations: Derive<State, ParsedConfigurationFiles> | null;
   currentTab: Derive<State, ModuleTab | DiffTab>;
   modulesByPath: SandboxFs;
   isAdvancedEditor: Derive<State, boolean>;

packages/app/src/app/pages/Sandbox/Editor/Workspace/Dependencies/index.tsx

@@ -32,26 +32,27 @@ export const Dependencies: FunctionComponent = () => {
     resource => !resource.includes('fonts.googleapis.com/css')
   );
 
-  if (!parsedConfigurations.package) {
+  if (!parsedConfigurations?.package) {
     return <ErrorMessage>Unable to find package.json</ErrorMessage>;
   }
 
-  const { parsed, error } = parsedConfigurations.package;
+  const { error, parsed } = parsedConfigurations.package;
   if (error) {
     return (
       <ErrorMessage>We weren{"'"}t able to parse the package.json</ErrorMessage>
     );
   }
 
+  const { dependencies = {} /* devDependencies = {} */ } = parsed;
   const { externalResourcesEnabled } = getTemplateDefinition(template);
   return (
     <div>
       <Margin bottom={0}>
-        {Object.keys(parsed.dependencies)
+        {Object.keys(dependencies)
           .sort()
           .map(dependency => (
             <VersionEntry
-              dependencies={parsed.dependencies}
+              dependencies={dependencies}
               dependency={dependency}
               key={dependency}
               onRefresh={(name, version) => addNpmDependency({ name, version })}

packages/common/src/templates/configuration/types.ts

@@ -18,12 +18,10 @@ export type ConfigurationFile = {
 };
 
 export type ParsedConfigurationFile<T> = {
-  parsed?: T;
   code: string;
   generated: boolean;
-  error?: Error;
   path: string;
-};
+} & ({ parsed: T } | { error: Error });
 
 export type ConfigurationUIProps = {
   file: string;