Pass in correct "singleColumn" prop value when auto-columns is not used.

2 files changed, 22 insertions, 4 deletions

diff --git a/app/javascript/mastodon/features/ui/index.js b/app/javascript/mastodon/features/ui/index.js
index f3a8bebe9..a372deac5 100644
--- a/app/javascript/mastodon/features/ui/index.js
+++ b/app/javascript/mastodon/features/ui/index.js
@@ -74,6 +74,15 @@ class WrappedRoute extends React.Component {
 
 }
 
+function columnClass(columns) {
+  switch (columns) {
+    case "auto": return "auto-columns";
+    case "single": return "single-column";
+    case "multiple": return "multi-columns";
+    default: return "auto-columns";
+  }
+}
+
 @connect()
 export default class UI extends React.PureComponent {
 
@@ -178,10 +187,12 @@ export default class UI extends React.PureComponent {
     const { width, draggingOver } = this.state;
     const { children } = this.props;
 
+    const columns = "auto";
+
     return (
-      <div className='ui auto-columns' ref={this.setRef}>
+      <div className={'ui ' + columnClass(columns)} ref={this.setRef}>
         <TabsBar />
-        <ColumnsAreaContainer singleColumn={isMobile(width)}>
+        <ColumnsAreaContainer singleColumn={isMobile(width, columns)}>
           <WrappedSwitch>
             <Redirect from='/' to='/getting-started' exact />
             <WrappedRoute path='/getting-started' component={GettingStarted} content={children} />
diff --git a/app/javascript/mastodon/is_mobile.js b/app/javascript/mastodon/is_mobile.js
index 992e63727..8689dbe23 100644
--- a/app/javascript/mastodon/is_mobile.js
+++ b/app/javascript/mastodon/is_mobile.js
@@ -1,7 +1,14 @@
 const LAYOUT_BREAKPOINT = 1024;
 
-export function isMobile(width) {
-  return width <= LAYOUT_BREAKPOINT;
+export function isMobile(width, columns) {
+  switch (columns) {
+  case "multiple":
+    return false;
+  case "single":
+    return true;
+  default:
+    return width <= LAYOUT_BREAKPOINT;
+  }
 };
 
 const iOS = /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;