Skip to content

Commit

Permalink
Merge pull request #38998 from code-dot-org/dtl_candidate_a511d294
Browse files Browse the repository at this point in the history
  • Loading branch information
deploy-code-org committed Feb 10, 2021
2 parents a944e9d + a511d29 commit 5a9b312
Show file tree
Hide file tree
Showing 71 changed files with 695 additions and 318 deletions.
10 changes: 5 additions & 5 deletions SETUP.md
Original file line number Diff line number Diff line change
Expand Up @@ -165,7 +165,7 @@ After setup, read about our [code styleguide](./STYLEGUIDE.md), our [test suites

1. [Download](https://www.google.com/chrome/) and install Google Chrome, if you have not already. This is needed in order to be able to run apps tests locally.

### Ubuntu 16.04 ([Download iso][ubuntu-iso-url])
### Ubuntu 18.04 ([Download iso][ubuntu-iso-url])

Note: Virtual Machine Users should check the [Alternative note](#alternative-use-an-ubuntu-vm) below before starting

Expand Down Expand Up @@ -217,7 +217,7 @@ It is worthwhile to make sure that you are using WSL 2. Attempting to use WSL 1
1. `wsl --set-default-version 2`
1. You may need to [update the WSL 2 Linux kernel](https://docs.microsoft.com/en-us/windows/wsl/wsl2-kernel)
1. [Install Ubuntu 20.04](https://www.microsoft.com/store/productId/9NBLGGH4MSV6) (Windows Store link)
* If you want to follow the Ubuntu setup exactly, Ubuntu 16.04 is available from the [Microsoft docs](https://docs.microsoft.com/en-us/windows/wsl/install-manual).
* If you want to follow the Ubuntu setup exactly, Ubuntu 18.04 is available from the [Microsoft docs](https://docs.microsoft.com/en-us/windows/wsl/install-manual).
1. Make sure virtualization is turned on your BIOS settings.
1. From the command line, run `wsl`, or from the Start menu, find and launch 'Ubuntu'. When this runs for the first time, WSL will complete installation in the resulting terminal window.

Expand All @@ -230,7 +230,7 @@ From here, you can follow the [Ubuntu procedure above](#ubuntu-1604-download-iso

### Alternative: Use an Ubuntu VM

* Option A: Use [VMWare Player](https://my.vmware.com/en/web/vmware/free#desktop_end_user_computing/vmware_workstation_player/12_0) or [Virtual Box](http://download.virtualbox.org/virtualbox/5.1.24/VirtualBox-5.1.24-117012-Win.exe) and an [Ubuntu 16.04 iso image][ubuntu-iso-url]
* Option A: Use [VMWare Player](https://my.vmware.com/en/web/vmware/free#desktop_end_user_computing/vmware_workstation_player/12_0) or [Virtual Box](http://download.virtualbox.org/virtualbox/5.1.24/VirtualBox-5.1.24-117012-Win.exe) and an [Ubuntu 18.04 iso image][ubuntu-iso-url]
1. Maximum Disk Size should be set to at least 35.0 GB (the default is 20 GB and it is too small)
2. Memory Settings for the VM should be 8 GB or higher (Right click the machine -> Settings -> "Memory for this virtual machine" )
* Option B: Use vagrant ([install](https://docs.vagrantup.com/v2/installation/)):
Expand All @@ -242,7 +242,7 @@ From here, you can follow the [Ubuntu procedure above](#ubuntu-1604-download-iso
* Option C: Use an Amazon EC2 instance:
1. Request AWS access from [accounts@code.org](mailto:accounts@code.org) if you haven't already done so.
1. From the [EC2 Homepage](https://console.aws.amazon.com/ec2), click on "Launch Instance" and follow the wizard:
* **Step 1: Choose AMI**: Select Ubuntu Server 16.04
* **Step 1: Choose AMI**: Select Ubuntu Server 18.04
* **Step 2: Choose instance type**: Choose at least 8GiB memory (e.g. `t2.large`)
* **Step 3: Configure Instance**: Set IAM Role to `DeveloperEC2`
* **Step 4: Storage**: Increase storage to 100GiB
Expand Down Expand Up @@ -434,4 +434,4 @@ While it's possible to run the server locally without these, we've found the fol
- Storage: The repository takes up 20GB


[ubuntu-iso-url]: http://releases.ubuntu.com/16.04/ubuntu-16.04.3-desktop-amd64.iso
[ubuntu-iso-url]: http://releases.ubuntu.com/bionic/ubuntu-18.04.5-desktop-amd64.iso
18 changes: 10 additions & 8 deletions apps/src/templates/lessonOverview/LessonOverview.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -113,14 +113,16 @@ class LessonOverview extends Component {
const {lesson, announcements, isSignedIn, viewAs} = this.props;
return (
<div>
<div style={styles.header}>
<a
href={this.linkWithQueryParams(lesson.unit.link)}
style={styles.navLink}
>
{`< ${lesson.unit.displayName}`}
</a>
<LessonNavigationDropdown lesson={lesson} />
<div className="lesson-overview-header">
<div style={styles.header}>
<a
href={this.linkWithQueryParams(lesson.unit.link)}
style={styles.navLink}
>
{`< ${lesson.unit.displayName}`}
</a>
<LessonNavigationDropdown lesson={lesson} />
</div>
</div>
{isSignedIn && (
<Announcements
Expand Down
7 changes: 4 additions & 3 deletions apps/src/templates/lessonOverview/activities/LessonTip.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,12 +8,13 @@ import Radium from 'radium';

const styles = {
tab: {
// borders everywhere except the bottom
borderStyle: 'solid solid none solid',
borderTopLeftRadius: 10,
borderTopRightRadius: 10,
borderWidth: 1,
padding: '5px 10px',
width: 200,
borderStyle: 'solid',
borderWidth: 1
width: 200
},
box: {
borderStyle: 'solid',
Expand Down
19 changes: 13 additions & 6 deletions apps/src/templates/progress/progressStyles.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import color from '@cdo/apps/util/color';
import {LevelStatus, LevelKind} from '@cdo/apps/util/sharedConstants';
import progressTableStyles from '@cdo/apps/templates/sectionProgress/progressTables/progressTableStyles.scss';

export const DOT_SIZE = 30;
export const DIAMOND_DOT_SIZE = 22;
Expand All @@ -12,14 +13,10 @@ export const BUBBLE_BORDER_WIDTH = 2;
// Two pixels on each side for margin, plus 2 x border width
export const BUBBLE_CONTAINER_WIDTH = DOT_SIZE + 4 + 2 * BUBBLE_BORDER_WIDTH;

export const LETTER_BUBBLE_SIZE = 12;
export const LETTER_BUBBLE_SIZE = 16;
export const LETTER_BUBBLE_MARGIN = 3;
export const LETTER_BUBBLE_PAD = 1;
export const LETTER_BUBBLE_CONTAINER_WIDTH =
LETTER_BUBBLE_SIZE +
2 * LETTER_BUBBLE_MARGIN +
LETTER_BUBBLE_PAD +
2 * BUBBLE_BORDER_WIDTH;
LETTER_BUBBLE_SIZE + 2 * LETTER_BUBBLE_MARGIN + 2 * BUBBLE_BORDER_WIDTH;

export const flex = {
display: 'flex',
Expand All @@ -45,6 +42,16 @@ export const cellContent = {
padding: `0px ${CELL_PADDING}px`
};

export const studentListContent = {
height: parseInt(progressTableStyles.ROW_HEIGHT),
boxSizing: 'border-box',
padding: 10,
fontSize: 14,
textOverflow: 'ellipsis',
whiteSpace: 'nowrap',
overflow: 'hidden'
};

// Style used when hovering
export const hoverStyle = {
':hover': {
Expand Down
6 changes: 3 additions & 3 deletions apps/src/templates/progress/progressTypes.js
Original file line number Diff line number Diff line change
Expand Up @@ -25,15 +25,15 @@ export const PUZZLE_PAGE_NONE = -1;
*/
const levelWithoutStatusShape = {
id: PropTypes.string.isRequired,
levelNumber: PropTypes.number,
bubbleText: PropTypes.string,
kind: PropTypes.string,
url: PropTypes.string,
name: PropTypes.string,
bubbleText: PropTypes.string,
icon: PropTypes.string,
isUnplugged: PropTypes.bool,
levelNumber: PropTypes.number,
isCurrentLevel: PropTypes.bool,
isConceptLevel: PropTypes.bool,
kind: PropTypes.string,
pageNumber: PropTypes.number
/** sublevels: PropTypes.array */ // See below
};
Expand Down
Original file line number Diff line number Diff line change
@@ -1,75 +1,15 @@
import React from 'react';
import ProgressTableDetailView from '@cdo/apps/templates/sectionProgress/progressTables/ProgressTableDetailView';
import {Provider} from 'react-redux';
import {createStore, wrapTable} from '../sectionProgressTestHelpers';
import {detailTableStories} from '@cdo/apps/templates/sectionProgress/progressTables/sectionProgressTableStoryBuilder';

/**
* Stories for the SummaryView and DetailView are identical other than the
* actual component to render, so we build them using common code in
* `sectionProgressTableStoryBuilder`.
*
* Note: there is a flag in that file to enable additional stories that is
* disabled by default to prevent slowing down our test pipeline.
*/
export default storybook => {
storybook.storiesOf('SectionProgress/DetailView', module).addStoryTable([
{
name: 'Tiny section, small script',
story: () => {
const store = createStore(3, 10);
return wrapTable(
<Provider store={store}>
<ProgressTableDetailView />
</Provider>
);
}
},
{
name: 'Tiny section, large script',
story: () => {
const store = createStore(3, 30);
return wrapTable(
<Provider store={store}>
<ProgressTableDetailView />
</Provider>
);
}
},
{
name: 'Small section, small script',
story: () => {
const store = createStore(30, 10);
return wrapTable(
<Provider store={store}>
<ProgressTableDetailView />
</Provider>
);
}
},
{
name: 'Small section, large script',
story: () => {
const store = createStore(30, 30);
return wrapTable(
<Provider store={store}>
<ProgressTableDetailView />
</Provider>
);
}
},
{
name: 'Large section, small script',
story: () => {
const store = createStore(200, 10);
return wrapTable(
<Provider store={store}>
<ProgressTableDetailView />
</Provider>
);
}
},
{
name: 'Large section, large script',
story: () => {
const store = createStore(200, 30);
return wrapTable(
<Provider store={store}>
<ProgressTableDetailView />
</Provider>
);
}
}
]);
storybook
.storiesOf('SectionProgress/DetailView', module)
.addStoryTable(detailTableStories);
};
Original file line number Diff line number Diff line change
Expand Up @@ -36,17 +36,13 @@ const styles = {
margin: '6px 0px'
},
smallCircle: {
...progressStyles.inlineBlock,
...progressStyles.flex,
width: progressStyles.LETTER_BUBBLE_SIZE,
height: progressStyles.LETTER_BUBBLE_SIZE,
borderRadius: progressStyles.LETTER_BUBBLE_SIZE,
lineHeight: '12px',
fontSize: 12,
margin: progressStyles.LETTER_BUBBLE_MARGIN,
paddingRight: progressStyles.LETTER_BUBBLE_PAD,
paddingBottom: progressStyles.LETTER_BUBBLE_PAD,
textAlign: 'center',
verticalAlign: 'middle'
margin: progressStyles.LETTER_BUBBLE_MARGIN
},
contents: {
whiteSpace: 'nowrap',
Expand Down Expand Up @@ -117,10 +113,8 @@ function UnpluggedBubble(props) {

function SmallCircle(props) {
return (
<div>
<div style={{...mainStyle(props), ...styles.smallCircle}}>
<Content {...props} />
</div>
<div style={{...mainStyle(props), ...styles.smallCircle}}>
<Content {...props} />
</div>
);
}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,6 @@ export default class ProgressTableLevelIcon extends React.Component {
return (
<span
style={{
...progressStyles.inlineBlock,
width: sublevelCount * progressStyles.LETTER_BUBBLE_CONTAINER_WIDTH
}}
/>
Expand All @@ -57,7 +56,10 @@ export default class ProgressTableLevelIcon extends React.Component {
return (
<span style={styles.container}>
{this.props.levels.map(level => (
<span key={`${level.id}_${level.levelNumber}`}>
<span
key={`${level.id}_${level.levelNumber}`}
style={progressStyles.flexBetween}
>
<LevelIcon icon={getIconForLevel(level, true)} />
{level.sublevels &&
this.renderSublevelSpace(level.sublevels.length)}
Expand Down
Original file line number Diff line number Diff line change
@@ -1,75 +1,15 @@
import React from 'react';
import ProgressTableSummaryView from '@cdo/apps/templates/sectionProgress/progressTables/ProgressTableSummaryView';
import {Provider} from 'react-redux';
import {createStore, wrapTable} from '../sectionProgressTestHelpers';
import {summaryTableStories} from '@cdo/apps/templates/sectionProgress/progressTables/sectionProgressTableStoryBuilder';

/**
* Stories for the SummaryView and DetailView are identical other than the
* actual component to render, so we build them using common code in
* `sectionProgressTableStoryBuilder`.
*
* Note: there is a flag in that file to enable additional stories that is
* disabled by default to prevent slowing down our test pipeline.
*/
export default storybook => {
storybook.storiesOf('SectionProgress/SummaryView', module).addStoryTable([
{
name: 'Tiny section, small script',
story: () => {
const store = createStore(3, 10);
return wrapTable(
<Provider store={store}>
<ProgressTableSummaryView />
</Provider>
);
}
},
{
name: 'Tiny section, large script',
story: () => {
const store = createStore(3, 30);
return wrapTable(
<Provider store={store}>
<ProgressTableSummaryView />
</Provider>
);
}
},
{
name: 'Small section, small script',
story: () => {
const store = createStore(30, 10);
return wrapTable(
<Provider store={store}>
<ProgressTableSummaryView />
</Provider>
);
}
},
{
name: 'Small section, large script',
story: () => {
const store = createStore(30, 30);
return wrapTable(
<Provider store={store}>
<ProgressTableSummaryView />
</Provider>
);
}
},
{
name: 'Large section, small script',
story: () => {
const store = createStore(200, 10);
return wrapTable(
<Provider store={store}>
<ProgressTableSummaryView />
</Provider>
);
}
},
{
name: 'Large section, large script',
story: () => {
const store = createStore(200, 30);
return wrapTable(
<Provider store={store}>
<ProgressTableSummaryView />
</Provider>
);
}
}
]);
storybook
.storiesOf('SectionProgress/SummaryView', module)
.addStoryTable(summaryTableStories);
};
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ $content-view-width: $content-width - $student-list-width;
background-color: $table-header;
border-width: 0px 1px 2px 0px;
border-color: $border-gray;
height: 100%;
height: inherit;
}
th,
td {
Expand Down

0 comments on commit 5a9b312

Please sign in to comment.