22 * This file is part of CoCalc: Copyright © 2020 Sagemath, Inc.
33 * License: MS-RSL – see LICENSE.md for details
44 */
5-
65import { UsergroupAddOutlined } from "@ant-design/icons" ;
76import { Button , Card , Popconfirm } from "antd" ;
7+ import { FormattedMessage , useIntl } from "react-intl" ;
8+
89import { AppRedux , useActions } from "@cocalc/frontend/app-framework" ;
9- import { Icon } from "@cocalc/frontend/components" ;
10+ import { Icon , Paragraph } from "@cocalc/frontend/components" ;
11+ import { course } from "@cocalc/frontend/i18n" ;
1012import { CancelText } from "@cocalc/frontend/i18n/components" ;
1113import { CourseActions } from "../actions" ;
1214import { CourseSettingsRecord } from "../store" ;
@@ -25,47 +27,68 @@ export function SharedProjectPanel({
2527 name,
2628 close,
2729} : SharedProjectPanelProps ) {
30+ const intl = useIntl ( ) ;
31+
2832 const actions = useActions < CourseActions > ( { name } ) ;
2933
34+ const haveSharedProject = ! ! settings . get ( "shared_project_id" ) ;
35+
3036 function panel_header_text ( ) : string {
31- if ( settings . get ( "shared_project_id" ) ) {
32- return "Shared project that everybody can fully use" ;
33- } else {
34- return "Optionally create a shared project for everybody" ;
35- }
37+ return intl . formatMessage (
38+ {
39+ id : "course.shared-project-panel.header" ,
40+ defaultMessage : `{haveSharedProject, select,
41+ true {Shared project that everybody can fully use}
42+ other {Optionally create a shared project for everybody}}` ,
43+ } ,
44+ { haveSharedProject } ,
45+ ) ;
3646 }
3747
3848 function render_content ( ) {
39- if ( settings . get ( "shared_project_id" ) ) {
49+ if ( haveSharedProject ) {
4050 return render_has_shared_project ( ) ;
4151 } else {
4252 return render_no_shared_project ( ) ;
4353 }
4454 }
4555
56+ const icuVals = {
57+ b : ( c ) => < b > { c } </ b > ,
58+ i : ( c ) => < i > { c } </ i > ,
59+ p : ( c ) => < Paragraph > { c } </ Paragraph > ,
60+ secondary : ( c ) => < Paragraph type = "secondary" > { c } </ Paragraph > ,
61+ } ;
62+
4663 function render_has_shared_project ( ) {
4764 return (
48- < div >
49- < div style = { { color : "#444" } } >
50- < p >
51- You created a common shared project, which everybody -- students and
52- all collaborators on this project (your TAs and other instructors)
53- -- have < b > write</ b > access to. Use this project for collaborative
54- in-class labs, course-wide chat rooms, and making miscellaneous
55- materials available for students to experiment with together.
56- </ p >
57- < p >
58- When you created the shared project, everybody who has already
59- created an account is added as a collaborator to the project.
60- Whenever you re-open this course, any students or collaborators on
61- the project that contains this course will be added to the shared
62- project.
63- </ p >
64- </ div >
65+ < >
66+ < FormattedMessage
67+ id = "course.shared-project-panel.have_project.message"
68+ defaultMessage = { `
69+ <p>
70+ You created a common shared project, which everybody – students and
71+ all collaborators on this project (your TAs and other instructors)
72+ – have <b>write</b> access to. Use this project for collaborative
73+ in-class labs, course-wide chat rooms, and making miscellaneous
74+ materials available for students to experiment with together.
75+ </p>
76+ <secondary>
77+ When you created the shared project, everybody who has already
78+ created an account is added as a collaborator to the project.
79+ Whenever you re-open this course, any students or collaborators on
80+ the project that contains this course will be added to the shared
81+ project.
82+ </secondary>` }
83+ values = { icuVals }
84+ />
6585 < br />
6686 < div style = { { textAlign : "center" } } >
6787 < Button onClick = { open_project } size = { "large" } type = { "primary" } >
68- Open shared project
88+ < FormattedMessage
89+ id = "course.shared-project-panel.have_project.button"
90+ defaultMessage = { "Open shared project" }
91+ />
6992 </ Button >
7093 </ div >
7194 < hr />
@@ -74,7 +97,7 @@ export function SharedProjectPanel({
7497 actions = { actions }
7598 close = { close }
7699 />
77- </ div >
100+ </ >
78101 ) ;
79102 }
80103
@@ -88,34 +111,38 @@ export function SharedProjectPanel({
88111 function render_no_shared_project ( ) {
89112 return (
90113 < div >
91- < div style = { { color : "#444" } } >
92- < p >
93- < i > Optionally</ i > create a single common shared project, which
94- everybody -- students and all collaborators on this project (your
95- TAs and other instructors) -- will have < b > write</ b > access to. This
96- can be useful for collaborative in-class labs, course-wide chat
97- rooms, and making miscellanous materials available for students to
98- experiment with together.
99- </ p >
100- < p >
101- When you create the shared project, everybody who has already
102- created an account is added as a collaborator to the project.
103- Whenever you re-open this course, any students or collaborators on
104- the project that contains this course will be added to the shared
105- project.
106- </ p >
107- < p >
108- After you create the shared project, you should move the shared
109- project to a members only server or upgrade it in other ways if you
110- want it to be more stable.
111- </ p >
112- </ div >
114+ < FormattedMessage
115+ id = "course.shared-project-panel.create_project.message"
116+ defaultMessage = { `
117+ <p>
118+ <i>Optionally</i> create a single common shared project, which
119+ everybody – students and all collaborators on this project (your
120+ TAs and other instructors) – will have <b>write</b> access to. This
121+ can be useful for collaborative in-class labs, course-wide chat
122+ rooms, and making miscellanous materials available for students to
123+ experiment with together.
124+ </p>
125+ <secondary>
126+ When you create the shared project, everybody who has already
127+ created an account is added as a collaborator to the project.
128+ Whenever you re-open this course, any students or collaborators on
129+ the project that contains this course will be added to the shared
130+ project.
131+ </secondary>
132+ <secondary>
133+ After you create the shared project, you should upgrade that project via a license as well.
134+ </secondary>` }
135+ values = { icuVals }
136+ />
113137 < br />
114138 < Popconfirm
115139 title = {
116140 < div style = { { maxWidth : "400px" } } >
117- Are you sure you want to create a shared project and add all
118- students in this course as collaborators?
141+ < FormattedMessage
142+ id = "course.shared-project-panel.create_project.confirmation"
143+ defaultMessage = { `Are you sure you want to create a shared project
144+ and add all students in this course as collaborators?` }
145+ />
119146 </ div >
120147 }
121148 onConfirm = { ( ) => {
@@ -125,11 +152,11 @@ export function SharedProjectPanel({
125152 close ?.( ) ;
126153 }
127154 } }
128- okText = "Create Shared Project"
155+ okText = { intl . formatMessage ( course . create_shared_project ) }
129156 cancelText = { < CancelText /> }
130157 >
131158 < Button size = { "large" } icon = { < UsergroupAddOutlined /> } >
132- Create shared project ...
159+ { intl . formatMessage ( course . create_shared_project ) } ...
133160 </ Button >
134161 </ Popconfirm >
135162 </ div >
0 commit comments