fix spaces available

Author: samuelcolvin

config-overrides.js

@@ -12,18 +12,18 @@ module.exports = function override (config, env) {
   // https://github.com/facebookincubator/create-react-app/issues/2498
   config.module.rules[1].oneOf.splice(0, 0,
     {
-        test: /\.(sass|scss|css)$/,
-        use: [
-          'style-loader',
-          'css-loader',
-          {
-            loader: 'sass-loader',
-            options: {
-              outputStyle: 'compressed',
-              includePaths: [path.resolve(__dirname, 'node_modules')],
-            }
+      test: /\.(sass|scss|css)$/,
+      use: [
+        'style-loader',
+        'css-loader',
+        {
+          loader: 'sass-loader',
+          options: {
+            outputStyle: 'compressed',
+            includePaths: [path.resolve(__dirname, 'node_modules')],
           }
-        ]
+        }
+      ]
     },
   )
   if (env === 'production') {

package.json

@@ -35,7 +35,6 @@
   },
   "dependencies": {
     "babel-polyfill": "^6.26.0",
-    "date-fns": "^1.29.0",
     "enzyme": "^3.3.0",
     "enzyme-adapter-react-16": "^1.1.1",
     "html-webpack-plugin": "^2.30.1",

src/components/appointments/Appointments.js

@@ -16,13 +16,12 @@ const group_appointments = apts => {
 }
 
 const Apt = ({apt, props, appointment_attendees}) => {
-  const full = apt.attendees_max === apt.attendees_count
   let status
-  const spaces_ctx = {spaces: apt.attendees_max - apt.attendees_count}
+  const spaces_ctx = {spaces: apt.attendees_max === null ? null : apt.attendees_max - apt.attendees_count}
   if (appointment_attendees && appointment_attendees[apt.id] !== undefined) {
-    status = props.config.get_text(full ? 'no_spaces_attending' : 'spaces_attending', spaces_ctx)
+    status = props.config.get_text('spaces_attending', spaces_ctx)
   } else {
-    status = props.config.get_text(full ? 'no_spaces' : 'spaces', spaces_ctx)
+    status = props.config.get_text('spaces', spaces_ctx)
   }
   return (
     <Link to={props.root.url(`appointment/${apt.link}`)} className="tcs-item">

src/components/appointments/AptModal.js

@@ -15,15 +15,15 @@ const AptDetails = ({apt, spaces_available, attending, props}) => {
       <div className="tcs-right tcs-timezone">
         {props.config.get_text('assuming_timezone', {timezone: props.config.timezone})}
       </div>
-      <div className={`tcs-apt-details ${spaces_available ? 'tcs-bookable' : ''}`}>
+      <div className={`tcs-apt-details ${spaces_available === 0 ? '' : 'tcs-bookable'}`}>
         <div>
           <CalendarIcon/>
         </div>
         <div className="tcs-price">
           {c.format_money(apt.price)}
         </div>
         <div>
-          {c.get_text(spaces_available === 0 ? 'no_spaces' : 'spaces', {spaces: spaces_available})}
+          {c.get_text('spaces', {spaces: spaces_available})}
         </div>
         <IfElse v={apt.start.substr(0, 10) === apt.finish.substr(0, 10)}>
           <div>
@@ -185,8 +185,10 @@ class AptModal extends Component {
       </span>
     )
     const students = this.get_students()
-    const spaces_available = apt.attendees_max - apt.attendees_count - this.state.extra_attendees
-    const booking_allowed = this.state.booking_allowed && spaces_available > 0
+    let spaces_available = (
+      apt.attendees_max === null ? null : apt.attendees_max - apt.attendees_count - this.state.extra_attendees
+    )
+    const booking_allowed = this.state.booking_allowed && spaces_available !== 0
     return (
       <Modal history={this.props.history} title={title} last_url={this.props.last_url} flex={false}>
         <AptDetails apt={apt}

src/formatting.js

@@ -4,6 +4,9 @@ export function get_text (name, replacements) {
     console.warn(`not translation found for "${name}"`)
     return name
   }
+  if (typeof(s) === 'function') {
+    return s(replacements)
+  }
   if (replacements) {
     for (let [k, v] of Object.entries(replacements)) {
       s = s.replace(`{${k}}`, v)

src/index.js

@@ -56,17 +56,34 @@ const STRINGS = {
   diff_1hour_minutes: '1 hour {minutes} mins',
   diff_hours: '{hours} hours',
   diff_hours_minutes: '{hours} hours {minutes} mins',
-  spaces: '{spaces} spaces available',
-  no_spaces: 'No spaces available',
-  spaces_attending: "You're already attending, {spaces} more spaces available",
-  no_spaces_attending: "You're already attending, no more spaces available",
+  spaces: ({ spaces }) => {
+    if (spaces === null) {
+      return 'Spaces available'
+    } else if (spaces === 0) {
+      return 'No spaces available'
+    } else if (spaces === 1) {
+      return '1 space available'
+    } else {
+      return `${spaces} spaces available`
+    }
+  },
+  spaces_attending: ({ spaces }) => {
+    if (spaces === null) {
+      return "You're already attending, more spaces available"
+    } else if (spaces === 0) {
+      return "You're already attending, no more spaces available"
+    } else if (spaces === 1) {
+      return "You're already attending, 1 more space available"
+    } else {
+      return `You're already attending, ${spaces} more spaces available`
+    }
+  },
   add_existing_students: 'Add your existing Students to the lesson',
   add_new_student: 'Add a new Student to the lesson',
   appointment_not_found: 'Appointment not Found',
   appointment_not_found_id: 'No Appointment found with id {apt_id}.',
   price: 'Price',
   job: 'Job',
-  spaces_available: 'Spaces Available',
   start: 'Start',
   finish: 'Finish',
   location: 'Location',