mirror of
https://github.com/pawelmalak/flame.git
synced 2025-07-24 05:39:35 +02:00
Sorting settings. Sort apps on change/add/update
This commit is contained in:
parent
8974fb3b49
commit
754dc3a7b9
9 changed files with 124 additions and 27 deletions
|
@ -2,7 +2,7 @@ import { useState, useEffect, ChangeEvent, FormEvent } from 'react';
|
|||
|
||||
// Redux
|
||||
import { connect } from 'react-redux';
|
||||
import { createNotification, updateConfig } from '../../../store/actions';
|
||||
import { createNotification, updateConfig, sortApps } from '../../../store/actions';
|
||||
|
||||
// Typescript
|
||||
import { GlobalState, NewNotification, SettingsForm } from '../../../interfaces';
|
||||
|
@ -17,6 +17,7 @@ import { searchConfig } from '../../../utility';
|
|||
interface ComponentProps {
|
||||
createNotification: (notification: NewNotification) => void;
|
||||
updateConfig: (formData: SettingsForm) => void;
|
||||
sortApps: () => void;
|
||||
loading: boolean;
|
||||
}
|
||||
|
||||
|
@ -26,7 +27,8 @@ const OtherSettings = (props: ComponentProps): JSX.Element => {
|
|||
customTitle: document.title,
|
||||
pinAppsByDefault: 1,
|
||||
pinCategoriesByDefault: 1,
|
||||
hideHeader: 0
|
||||
hideHeader: 0,
|
||||
useOrdering: 'createdAt'
|
||||
})
|
||||
|
||||
// Get config
|
||||
|
@ -35,7 +37,8 @@ const OtherSettings = (props: ComponentProps): JSX.Element => {
|
|||
customTitle: searchConfig('customTitle', 'Flame'),
|
||||
pinAppsByDefault: searchConfig('pinAppsByDefault', 1),
|
||||
pinCategoriesByDefault: searchConfig('pinCategoriesByDefault', 1),
|
||||
hideHeader: searchConfig('hideHeader', 0)
|
||||
hideHeader: searchConfig('hideHeader', 0),
|
||||
useOrdering: searchConfig('useOrdering', 'createdAt')
|
||||
})
|
||||
}, [props.loading]);
|
||||
|
||||
|
@ -46,8 +49,11 @@ const OtherSettings = (props: ComponentProps): JSX.Element => {
|
|||
// Save settings
|
||||
await props.updateConfig(formData);
|
||||
|
||||
// update local page title
|
||||
// Update local page title
|
||||
document.title = formData.customTitle;
|
||||
|
||||
// Get sorted apps
|
||||
props.sortApps();
|
||||
}
|
||||
|
||||
// Input handler
|
||||
|
@ -113,6 +119,19 @@ const OtherSettings = (props: ComponentProps): JSX.Element => {
|
|||
<option value={0}>False</option>
|
||||
</select>
|
||||
</InputGroup>
|
||||
<InputGroup>
|
||||
<label htmlFor='useOrdering'>Sorting type</label>
|
||||
<select
|
||||
id='useOrdering'
|
||||
name='useOrdering'
|
||||
value={formData.useOrdering}
|
||||
onChange={(e) => inputChangeHandler(e)}
|
||||
>
|
||||
<option value='createdAt'>By creation date</option>
|
||||
<option value='name'>Alphabetical order</option>
|
||||
<option value='orderId'>Custom order</option>
|
||||
</select>
|
||||
</InputGroup>
|
||||
<Button>Save changes</Button>
|
||||
</form>
|
||||
)
|
||||
|
@ -124,4 +143,4 @@ const mapStateToProps = (state: GlobalState) => {
|
|||
}
|
||||
}
|
||||
|
||||
export default connect(mapStateToProps, { createNotification, updateConfig })(OtherSettings);
|
||||
export default connect(mapStateToProps, { createNotification, updateConfig, sortApps })(OtherSettings);
|
Loading…
Add table
Add a link
Reference in a new issue