🚧 Progress Commit

🚧 Progress Commit

Author: Saeris

packages/app/scripts/start.js

@@ -20,7 +20,7 @@ const { staticAssets } = require('../config/build');
 
 // Tools like Cloud9 rely on this.
 var DEFAULT_PORT = process.env.PORT || 3000;
-const PROXY_DOMAIN = 'https://codesandbox.io';
+const PROXY_DOMAIN = 'https://codesandbox.stream';
 var compiler;
 var handleCompile;
 var compileStart;

packages/app/src/app/overmind/effects/api/index.ts

@@ -349,7 +349,16 @@ export default {
       },
     });
   },
-  getProfile(username: string): Promise<Profile> {
+  getProfile(
+    username: string
+  ): Promise<
+    Profile & {
+      avatarUrl: Profile['avatar'];
+      showcasedSandboxShortid: Profile['featuredSandbox'];
+      featuredSandboxes: Profile['pinnedSandboxes'];
+      subscriptionSince: string | null;
+    }
+  > {
     return api.get(`/users/${username}`);
   },
   getUserSandboxes(

packages/app/src/app/overmind/namespaces/profile/actions.ts

@@ -1,30 +1,52 @@
 import { Sandbox } from '@codesandbox/common/lib/types';
 import { Action, AsyncAction } from 'app/overmind';
 import { withLoadApp } from 'app/overmind/factories';
+import { Profile } from '@codesandbox/common/lib/types';
 
 export const profileMounted: AsyncAction<{
   username: string;
 }> = withLoadApp(async ({ state, effects }, { username }) => {
   state.profile.isLoadingProfile = true;
   state.profile.notFound = false;
 
-  const profile = await effects.api.getProfile(username);
-
-  state.profile.profiles[profile.id] = profile;
+  const { avatarUrl: avatar, featuredSandboxes: pinnedSandboxes, showcasedSandboxShortid: featuredSandbox, ...profile } = await effects.api.getProfile(username);
+
+  state.profile.profiles[profile.id] = {
+    ...profile,
+    avatar,
+    isContributor: state.contributors[profile.username],
+    isPro: !!profile.subscriptionSince,
+    // TODO: This needs to be replaced once Team Profiles can be supported!
+    associations: [],
+    pinnedSandboxes,
+    featuredSandbox,
+    // TODO: These properties are likely going to be supplied by Algolia
+    sandboxes: [],
+    templates: [],
+    likes: [],
+  };
   state.profile.currentProfileId = profile.id;
 
   if (
-    profile.showcasedSandboxShortid &&
-    !state.editor.sandboxes[profile.showcasedSandboxShortid]
+    featuredSandbox &&
+    !state.editor.sandboxes[featuredSandbox]
   ) {
     state.editor.sandboxes[
-      profile.showcasedSandboxShortid
-    ] = await effects.api.getSandbox(profile.showcasedSandboxShortid);
+      featuredSandbox
+    ] = await effects.api.getSandbox(featuredSandbox);
   }
 
   state.profile.isLoadingProfile = false;
 });
 
+export const editProfile: AsyncAction<Profile> = async ({ state, effects }, changes) => {
+  state.profile.isLoadingSandboxes = true;
+
+  state.profile.profiles[changes.id] = changes
+
+  state.profile.isLoadingProfile = false;
+}
+
 export const sandboxesPageChanged: AsyncAction<{
   page: number;
   force?: boolean;
@@ -73,16 +95,6 @@ export const likedSandboxesPageChanged: AsyncAction<{
   state.profile.isLoadingSandboxes = false;
 };
 
-export const selectSandboxClicked: AsyncAction = async ({ state, effects }) => {
-  state.currentModal = 'selectSandbox';
-
-  if (!state.profile.userSandboxes.length) {
-    state.profile.isLoadingSandboxes = true;
-    state.profile.userSandboxes = await effects.api.getSandboxes();
-    state.profile.isLoadingSandboxes = false;
-  }
-};
-
 export const newSandboxShowcaseSelected: AsyncAction<string> = async (
   { state, effects },
   id
@@ -106,7 +118,7 @@ export const newSandboxShowcaseSelected: AsyncAction<string> = async (
 };
 
 export const deleteSandboxClicked: Action<{
-  id;
+  id: string;
 }> = ({ state }, { id }) => {
   state.profile.sandboxToDeleteId = id;
   state.currentModal = 'deleteProfileSandbox';

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

@@ -2,9 +2,17 @@ import { Sandbox, UserSandbox, Profile } from '@codesandbox/common/lib/types';
 import { Derive } from 'app/overmind';
 
 type State = {
+  /**
+   * A hash of all previously loaded profiles
+   */
   profiles: {
     [profileId: string]: Profile;
   };
+  /**
+   * Used to retrieve a previously loaded profile, is
+   * automatically set to the last profile which was loaded
+   * upon navigating to the profiles route
+   */
   currentProfileId: string;
   notFound: boolean;
   isLoadingProfile: boolean;
@@ -44,17 +52,13 @@ export const state: State = {
   currentLikedSandboxesPage: 1,
   isLoadingSandboxes: false,
   sandboxToDeleteId: null,
-  isProfileCurrentUser: (currentState, rootState) =>
-    rootState.user && rootState.user.id === currentState.currentProfileId,
-  current: currentState => currentState.profiles[currentState.currentProfileId],
-  showcasedSandbox: (currentState, rootState) =>
-    currentState.current &&
-    currentState.current.showcasedSandboxShortid &&
-    rootState.editor.sandboxes[currentState.current.showcasedSandboxShortid],
-  currentLikedSandboxes: currentState =>
-    currentState.current &&
-    currentState.likedSandboxes[currentState.current.username],
-  currentSandboxes: currentState =>
-    currentState.current &&
-    currentState.sandboxes[currentState.current.username],
+  isProfileCurrentUser: ({ currentProfileId }, { user }) =>
+    user?.id === currentProfileId,
+  current: ({ profiles, currentProfileId }) => profiles[currentProfileId],
+  showcasedSandbox: ({ current }, { editor }) =>
+    current?.featuredSandbox && editor.sandboxes[current.featuredSandbox],
+  currentLikedSandboxes: ({ current, likedSandboxes }) =>
+    current && likedSandboxes[current.username],
+  currentSandboxes: ({ current, sandboxes }) =>
+    current && sandboxes[current.username],
 };

packages/app/src/app/pages/Profile/DELETEME.ts

@@ -3,18 +3,18 @@ import React from 'react';
 import { Container, HeroImage } from './elements';
 
 interface IFeaturedSandboxProps {
-  heroImage: string;
+  id: string;
 }
 
 export const FeaturedSandbox: React.FC<IFeaturedSandboxProps> = ({
-  heroImage,
+  id,
 }) => {
   // eslint-disable-line
   // TODO:
   // - Make Hero Image a Live Sandbox Preview?
   return (
     <Container>
-      <HeroImage src={heroImage} />
+      <HeroImage src={`/api/v1/sandboxes/${id}/screenshot.png`} />
     </Container>
   );
 };