3 files changed, 9 insertions, 3 deletions
diff --git a/app/client/modules/biggan/biggan.actions.js b/app/client/modules/biggan/biggan.actions.js
index 10fd68a..e39c22c 100644
--- a/app/client/modules/biggan/biggan.actions.js
+++ b/app/client/modules/biggan/biggan.actions.js
@@ -201,8 +201,10 @@ export const load_encodings = () => dispatch => {
     // loading function
   }).then(res => {
     const [folders, files] = res
+    console.log('encodings: ', folders.length, 'folders, ', files.length, 'files')
     const folder_name_lookup = {}
     const encodings = {}
+    const encoding_order = []
     folders.forEach(folder => {
       folder_name_lookup[folder.id] = folder.name
       encodings[folder.name] = []
@@ -214,11 +216,14 @@ export const load_encodings = () => dispatch => {
     folders.forEach(folder => {
       if (!encodings[folder.name].length) {
         delete encodings[folder.name]
+      } else {
+        encoding_order.push(folder.name)
       }
     })
     dispatch({
       type: types.biggan.load_encodings,
-      encodings
+      encodings,
+      encoding_order,
     })
   })
 }
diff --git a/app/client/modules/biggan/biggan.reducer.js b/app/client/modules/biggan/biggan.reducer.js
index d5b331c..a8be247 100644
--- a/app/client/modules/biggan/biggan.reducer.js
+++ b/app/client/modules/biggan/biggan.reducer.js
@@ -31,6 +31,7 @@ const bigganReducer = (state = bigganInitialState, action) => {
       return {
         ...state,
         encodings: action.encodings,
+        encoding_order: action.encoding_order,
       }
     case types.file.destroy:
       console.log('file destroy', state.results)
diff --git a/app/client/modules/biggan/views/biggan.encodingList.js b/app/client/modules/biggan/views/biggan.encodingList.js
index f11d4b2..242be88 100644
--- a/app/client/modules/biggan/views/biggan.encodingList.js
+++ b/app/client/modules/biggan/views/biggan.encodingList.js
@@ -25,7 +25,7 @@ class BigGANEncodingList extends Component {
   render() {
     const { file_id } = this.state
     const { opt, frame } = this.props
-    const { encodings } = this.props.biggan
+    const { encodings, encoding_order } = this.props.biggan
     if (!encodings) {
       return <div>Loading encodings...</div>
     }
@@ -94,7 +94,7 @@ class BigGANEncodingList extends Component {
           />
         </Group>
         <div className="categories encodings" ref={ref => this.categoryRef = ref}>
-          {Object.keys(encodings).sort().map(name => {
+          {encoding_order.map(name => {
             return (
               <div key={name}>
                 <h3>{name}</h3>