The model config is kind of long, and it distracts from the 
primary purpose of the main container, which is to describe
the view.

Therefore, we should refactor the component model into its own class, 
just like we did for the table.

Just before, that means creating a new `.mjs` file to hold the
new class, extending the corresponding class, copying and pasting
the config block, and adding whatever imports might be needed.

<pre class="runnable text readonly">
import Base from '../../../node_modules/neo.mjs/src/model/Component.mjs';
import Store from '../../../node_modules/neo.mjs/src/data/Store.mjs';

class MainViewModel extends Base {
    static config = {
        className: 'Earthquakes.view.MainViewModel',
        data: {},
        stores: {
            earthquakes: {
                module: Store,
                model: {
                    fields: [{
                        name: 'humanReadableLocation'
                    }, {
                        name: 'size',
                        ntype: 'data-field-float',
                    }, {
                        name: 'timestamp',
                        type: 'Date'
                    }, {
                        name: 'title',
                        calculate: (data, field, item) => item.humanReadableLocation
                    }, {
                        name: 'position',
                        calculate: (data, field, item) => ({ lat: item.latitude, lng: item.longitude })
                    }]
                },
                url: 'https://apis.is/earthquake/is',
                responseRoot: 'results',
                autoLoad: true
            }
        }
    }
}

Neo.setupClass(MainViewModel);
export default MainViewModel;
</pre>
