Enable org creation with "contact sales" info

Enable the New Org modal and add a note about contacting sales for
enabling private projects on the new org.

Also add a better empty state to the org page (which is now redirected
to after org creation).

Author: hojberg

elm-git.json

@@ -1,7 +1,7 @@
 {
     "git-dependencies": {
         "direct": {
-            "https://github.com/unisonweb/ui-core": "370a0dad78e156e5604b1d34c7acaadbb1016bff"
+            "https://github.com/unisonweb/ui-core": "2e050b11e00a332b8f7a41db78d1f61169e9898f"
         },
         "indirect": {}
     }

src/UnisonShare/AppHeader.elm

@@ -5,7 +5,6 @@ import Html.Attributes exposing (class, classList)
 import Lib.HttpApi exposing (HttpApi)
 import Lib.UserHandle as UserHandle exposing (UserHandle)
 import Time
-import UI
 import UI.ActionMenu as ActionMenu
 import UI.AnchoredOverlay as AnchoredOverlay
 import UI.AppHeader exposing (AppHeader, AppTitle(..))
@@ -270,14 +269,10 @@ view ctx appHeader_ =
                                         [ avatar, Icon.view chevron ]
 
                                 newOrgButton =
-                                    if account.isSuperAdmin then
-                                        Button.iconThenLabel ctx.showNewOrgModal Icon.largePlus "New Org"
-                                            |> Button.small
-                                            |> Button.positive
-                                            |> Button.view
-
-                                    else
-                                        UI.nothing
+                                    Button.iconThenLabel ctx.showNewOrgModal Icon.largePlus "New Org"
+                                        |> Button.small
+                                        |> Button.positive
+                                        |> Button.view
 
                                 accountMenu =
                                     ActionMenu.items

src/UnisonShare/Link.elm

@@ -35,6 +35,11 @@ link url =
     Click.externalHref url
 
 
+salesEmail : Click msg
+salesEmail =
+    Click.externalHref "mailto:hello@unison.cloud"
+
+
 unisonCloudWebsite : Click msg
 unisonCloudWebsite =
     Click.externalHref "https://unison.cloud"

src/UnisonShare/NewOrgModal.elm

@@ -1,6 +1,6 @@
 module UnisonShare.NewOrgModal exposing (..)
 
-import Html exposing (Html, div, form)
+import Html exposing (Html, br, div, form, span, strong, text)
 import Http
 import Json.Decode as Decode
 import Lib.HttpApi as HttpApi exposing (HttpResult)
@@ -9,7 +9,6 @@ import Lib.Util as Util
 import RemoteData exposing (RemoteData(..), WebData)
 import String.Normalize as StringN
 import UI.Button as Button
-import UI.Form.RadioField as RadioField
 import UI.Form.TextField as TextField
 import UI.Icon as Icon
 import UI.Modal as Modal
@@ -18,6 +17,7 @@ import UI.StatusIndicator as StatusIndicator
 import UnisonShare.Account exposing (AccountSummary)
 import UnisonShare.Api as ShareApi
 import UnisonShare.AppContext exposing (AppContext)
+import UnisonShare.Link as Link
 import UnisonShare.Org as Org exposing (OrgSummary)
 
 
@@ -221,7 +221,7 @@ update appContext account msg model =
         SaveFinished res ->
             case res of
                 Ok org ->
-                    ( { model | save = Success org }, Util.delayMsg 1500 CloseModal, NoOutMsg )
+                    ( { model | save = Success org }, Cmd.none, AddedOrg org )
 
                 Err e ->
                     ( { model | save = Failure e }, Cmd.none, NoOutMsg )
@@ -327,17 +327,20 @@ handleToString orgHandle =
 view : Model -> Html Msg
 view model =
     let
-        orgTypeOptions =
-            RadioField.options2
-                (RadioField.option "Public Org"
-                    "Only allows public projects."
-                    PublicOrg
-                )
-                (RadioField.option "Commercial Org"
-                    "Supports both public and private projects. Selecting this will open a support ticket to enable private projects."
-                    CommercialOrg
-                )
-
+        {-
+              orgTypeOptions =
+                  RadioField.options2
+                      (RadioField.option "Public Org"
+                          "Only allows public projects."
+                          PublicOrg
+                      )
+                      (RadioField.option "Commercial Org"
+                          "Supports both public and private projects. Selecting this will open a support ticket to enable private projects."
+                          CommercialOrg
+                      )
+                 |> RadioField.field "org-type" UpdateOrgType orgTypeOptions model.orgType |> RadioField.view
+           orgTypeOptions =
+        -}
         handleField =
             TextField.fieldWithoutLabel UpdateHandle "Handle, e.g. @unison" (handleToString model.potentialHandle)
                 |> TextField.withHelpText "The unique identifier of the organization and used in URLs and project references like @unison/base."
@@ -381,7 +384,11 @@ view model =
                         |> TextField.withAutofocus
                         |> TextField.view
                     , TextField.view handleField_
-                    , RadioField.field "org-type" UpdateOrgType orgTypeOptions model.orgType |> RadioField.view
+                    , StatusBanner.info_
+                        (span
+                            []
+                            [ strong [] [ text "Organizations by default only allow for public projects." ], br [] [], text "To enable private projects, please reach out to Unison sales (", Link.salesEmail |> Link.view "hello@unison.cloud", text " or on ", Link.discord |> Link.view "Discord", text ") after creating the Organization." ]
+                        )
                     ]
                 ]
 

src/UnisonShare/Page/OrgProfilePage.elm

@@ -1,6 +1,6 @@
 module UnisonShare.Page.OrgProfilePage exposing (..)
 
-import Html exposing (Html, div, text)
+import Html exposing (Html, div, h2, text)
 import Html.Attributes exposing (class)
 import Http
 import Json.Decode as Decode
@@ -12,15 +12,19 @@ import Set
 import UI
 import UI.Card as Card
 import UI.Divider as Divider
+import UI.EmptyState as EmptyState
+import UI.EmptyStateCard as EmptyStateCard
+import UI.Icon as Icon
 import UI.PageContent as PageContent exposing (PageContent)
 import UI.PageLayout as PageLayout
 import UI.PageTitle as PageTitle
+import UI.Placeholder as Placeholder
 import UI.ProfileSnippet as ProfileSnippet
 import UI.Tag as Tag
 import UnisonShare.Api as ShareApi
 import UnisonShare.AppContext exposing (AppContext)
 import UnisonShare.Link as Link
-import UnisonShare.Org exposing (OrgDetails)
+import UnisonShare.Org as Org exposing (OrgDetails)
 import UnisonShare.PageFooter as PageFooter
 import UnisonShare.Project as Project exposing (ProjectSummary)
 import UnisonShare.Project.ProjectListing as ProjectListing
@@ -99,11 +103,13 @@ fetchProjects appContext handle =
 -- VIEW
 
 
-viewProjects : List ProjectSummary -> Html msg
-viewProjects projects_ =
+viewProjects : OrgDetails -> List ProjectSummary -> Html msg
+viewProjects org projects_ =
     case projects_ of
         [] ->
-            UI.nothing
+            EmptyState.iconCloud (EmptyState.IconCenterPiece Icon.pencilRuler)
+                |> EmptyState.withContent [ h2 [] [ text (Org.name org ++ " doesn't have any projects yet.") ] ]
+                |> EmptyStateCard.view
 
         projects ->
             let
@@ -147,7 +153,7 @@ view_ org projects =
     let
         pageContent =
             [ projects
-                |> RemoteData.map viewProjects
+                |> RemoteData.map (viewProjects org)
                 |> RemoteData.withDefault UI.nothing
             ]
 
@@ -168,10 +174,9 @@ viewLoadingPage =
     let
         content =
             PageContent.oneColumn
-                [ div [ class "org-profile-page_page-content" ]
-                    [ div [ class "org-profile_main-content" ]
-                        [ text "" ]
-                    ]
+                [ Card.card (Placeholder.texts5 |> List.map Placeholder.view)
+                    |> Card.asContainedWithFade
+                    |> Card.view
                 ]
     in
     PageLayout.centeredNarrowLayout content PageFooter.pageFooter

src/css/unison-share/page/org-profile-page.css

@@ -3,12 +3,8 @@
   flex-direction: column;
 }
 
-.org-profile-page .org-profile_main-content {
-  display: flex;
-  flex-direction: column;
-  gap: 1.5rem;
-  flex: 1;
-  flex-grow: 1;
+.org-profile-page .avatar.avatar_blank {
+  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1);
 }
 
 .org-profile-page .projects {

src/css/unison-share/page/user-profile-page.css

@@ -33,6 +33,10 @@
   flex-grow: 1;
 }
 
+.user-profile-page .avatar.avatar_blank {
+  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1);
+}
+
 .user-profile-empty-state_instructions-banner {
   display: flex;
   flex-direction: column;