Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
N
nexpie-grafana-theme
Overview
Overview
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Registry
Registry
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
Kornkitt Poolsup
nexpie-grafana-theme
Commits
f34cbae2
Commit
f34cbae2
authored
Oct 24, 2018
by
Peter Holmberg
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
cleaned up the flow
parent
ed99a543
Hide whitespace changes
Inline
Side-by-side
Showing
11 changed files
with
128 additions
and
65 deletions
+128
-65
public/app/core/actions/appNotification.ts
+2
-2
public/app/core/actions/index.ts
+2
-1
public/app/core/components/AppNotifications/AppNotificationItem.tsx
+38
-0
public/app/core/components/AppNotifications/AppNotificationList.tsx
+19
-53
public/app/core/copy/appNotification.ts
+46
-0
public/app/core/reducers/appNotification.test.ts
+4
-1
public/app/core/reducers/appNotification.ts
+1
-5
public/app/core/reducers/index.ts
+2
-0
public/app/store/configureStore.ts
+0
-2
public/app/types/appNotifications.ts
+7
-0
public/app/types/index.ts
+7
-1
No files found.
public/app/core/actions/appNotification.ts
View file @
f34cbae2
...
...
@@ -22,7 +22,7 @@ export const clearAppNotification = (appNotificationId: number) => ({
payload
:
appNotificationId
,
});
export
const
addAppNotification
=
(
alert
:
AppNotification
)
=>
({
export
const
notifyApp
=
(
appNotification
:
AppNotification
)
=>
({
type
:
ActionTypes
.
AddAppNotification
,
payload
:
a
lert
,
payload
:
a
ppNotification
,
});
public/app/core/actions/index.ts
View file @
f34cbae2
import
{
updateLocation
}
from
'./location'
;
import
{
updateNavIndex
,
UpdateNavIndexAction
}
from
'./navModel'
;
import
{
notifyApp
,
clearAppNotification
}
from
'./appNotification'
;
export
{
updateLocation
,
updateNavIndex
,
UpdateNavIndexAction
};
export
{
updateLocation
,
updateNavIndex
,
UpdateNavIndexAction
,
notifyApp
,
clearAppNotification
};
public/app/core/components/AppNotifications/AppNotificationItem.tsx
0 → 100644
View file @
f34cbae2
import
React
,
{
Component
}
from
'react'
;
import
{
AppNotification
}
from
'app/types'
;
interface
Props
{
appNotification
:
AppNotification
;
onClearNotification
:
(
id
)
=>
void
;
}
export
default
class
AppNotificationItem
extends
Component
<
Props
>
{
shouldComponentUpdate
(
nextProps
)
{
return
this
.
props
.
appNotification
.
id
!==
nextProps
.
appNotification
.
id
;
}
componentDidMount
()
{
const
{
appNotification
,
onClearNotification
}
=
this
.
props
;
setTimeout
(()
=>
{
onClearNotification
(
appNotification
.
id
);
},
appNotification
.
timeout
);
}
render
()
{
const
{
appNotification
,
onClearNotification
}
=
this
.
props
;
return
(
<
div
className=
{
`alert-${appNotification.severity} alert`
}
>
<
div
className=
"alert-icon"
>
<
i
className=
{
appNotification
.
icon
}
/>
</
div
>
<
div
className=
"alert-body"
>
<
div
className=
"alert-title"
>
{
appNotification
.
title
}
</
div
>
<
div
className=
"alert-text"
>
{
appNotification
.
text
}
</
div
>
</
div
>
<
button
type=
"button"
className=
"alert-close"
onClick=
{
()
=>
onClearNotification
(
appNotification
.
id
)
}
>
<
i
className=
"fa fa fa-remove"
/>
</
button
>
</
div
>
);
}
}
public/app/core/components/AppNotifications/AppNotificationList.tsx
View file @
f34cbae2
import
React
,
{
PureComponent
}
from
'react'
;
import
appEvents
from
'app/core/app_events'
;
import
{
addAppNotification
,
clearAppNotification
}
from
'../../actions/appNotification'
;
import
AppNotificationItem
from
'./AppNotificationItem'
;
import
{
notifyApp
,
clearAppNotification
}
from
'app/core/actions'
;
import
{
connectWithStore
}
from
'app/core/utils/connectWithReduxStore'
;
import
{
AppNotification
,
AppNotificationSeverity
,
StoreState
}
from
'app/types'
;
import
{
AppNotification
,
StoreState
}
from
'app/types'
;
import
{
createErrorNotification
,
createSuccessNotification
,
createWarningNotification
,
}
from
'../../copy/appNotification'
;
export
interface
Props
{
appNotifications
:
AppNotification
[];
addAppNotification
:
typeof
addAppNotification
;
notifyApp
:
typeof
notifyApp
;
clearAppNotification
:
typeof
clearAppNotification
;
}
export
class
AppNotificationList
extends
PureComponent
<
Props
>
{
componentDidMount
()
{
appEvents
.
on
(
'alert-warning'
,
options
=>
this
.
addAppNotification
(
options
[
0
],
options
[
1
],
'warning'
,
5000
));
appEvents
.
on
(
'alert-success'
,
options
=>
this
.
addAppNotification
(
options
[
0
],
options
[
1
],
'success'
,
3000
));
appEvents
.
on
(
'alert-error'
,
options
=>
this
.
addAppNotification
(
options
[
0
],
options
[
1
],
'error'
,
7000
));
}
addAppNotification
(
title
,
text
,
severity
,
timeout
)
{
const
id
=
Date
.
now
();
const
newAlert
=
{
id
:
id
,
title
:
title
||
''
,
text
:
text
||
''
,
severity
:
severity
||
AppNotificationSeverity
.
Info
,
icon
:
this
.
getIconForSeverity
(
severity
),
remove
:
this
.
clearAutomatically
(
id
,
timeout
),
};
this
.
props
.
addAppNotification
(
newAlert
);
}
const
{
notifyApp
}
=
this
.
props
;
getIconForSeverity
(
severity
)
{
switch
(
severity
)
{
case
AppNotificationSeverity
.
Success
:
return
'fa fa-check'
;
case
AppNotificationSeverity
.
Error
:
return
'fa fa-exclamation-triangle'
;
default
:
return
'fa fa-exclamation'
;
}
appEvents
.
on
(
'alert-warning'
,
options
=>
notifyApp
(
createWarningNotification
(
options
[
0
],
options
[
1
])));
appEvents
.
on
(
'alert-success'
,
options
=>
notifyApp
(
createSuccessNotification
(
options
[
0
],
options
[
1
])));
appEvents
.
on
(
'alert-error'
,
options
=>
notifyApp
(
createErrorNotification
(
options
[
0
],
options
[
1
])));
}
clearAutomatically
=
(
id
,
timeout
)
=>
{
setTimeout
(()
=>
{
this
.
props
.
clearAppNotification
(
id
);
},
timeout
);
};
onClearAppNotification
=
id
=>
{
this
.
props
.
clearAppNotification
(
id
);
};
...
...
@@ -59,22 +36,11 @@ export class AppNotificationList extends PureComponent<Props> {
<
div
>
{
appNotifications
.
map
((
appNotification
,
index
)
=>
{
return
(
<
div
key=
{
index
}
className=
{
`alert-${appNotification.severity} alert`
}
>
<
div
className=
"alert-icon"
>
<
i
className=
{
appNotification
.
icon
}
/>
</
div
>
<
div
className=
"alert-body"
>
<
div
className=
"alert-title"
>
{
appNotification
.
title
}
</
div
>
<
div
className=
"alert-text"
>
{
appNotification
.
text
}
</
div
>
</
div
>
<
button
type=
"button"
className=
"alert-close"
onClick=
{
()
=>
this
.
onClearAppNotification
(
appNotification
.
id
)
}
>
<
i
className=
"fa fa fa-remove"
/>
</
button
>
</
div
>
<
AppNotificationItem
key=
{
`${appNotification.id}-${index}`
}
appNotification=
{
appNotification
}
onClearNotification=
{
id
=>
this
.
onClearAppNotification
(
id
)
}
/>
);
})
}
</
div
>
...
...
@@ -87,7 +53,7 @@ const mapStateToProps = (state: StoreState) => ({
});
const
mapDispatchToProps
=
{
addAppNotification
,
notifyApp
,
clearAppNotification
,
};
...
...
public/app/core/copy/appNotification.ts
0 → 100644
View file @
f34cbae2
import
{
AppNotification
,
AppNotificationSeverity
,
AppNotificationTimeout
}
from
'app/types'
;
const
defaultSuccessNotification
:
AppNotification
=
{
title
:
''
,
text
:
''
,
severity
:
AppNotificationSeverity
.
Success
,
icon
:
'fa fa-check'
,
timeout
:
AppNotificationTimeout
.
Success
,
};
const
defaultWarningNotification
:
AppNotification
=
{
title
:
''
,
text
:
''
,
severity
:
AppNotificationSeverity
.
Warning
,
icon
:
'fa fa-exclamation'
,
timeout
:
AppNotificationTimeout
.
Warning
,
};
const
defaultErrorNotification
:
AppNotification
=
{
title
:
''
,
text
:
''
,
severity
:
AppNotificationSeverity
.
Error
,
icon
:
'fa fa-exclamation-triangle'
,
timeout
:
AppNotificationTimeout
.
Error
,
};
export
const
createSuccessNotification
=
(
title
:
string
,
text
?:
string
):
AppNotification
=>
({
...
defaultSuccessNotification
,
title
:
title
,
text
:
text
,
id
:
Date
.
now
(),
});
export
const
createErrorNotification
=
(
title
:
string
,
text
?:
string
):
AppNotification
=>
({
...
defaultErrorNotification
,
title
:
title
,
text
:
text
,
id
:
Date
.
now
(),
});
export
const
createWarningNotification
=
(
title
:
string
,
text
?:
string
):
AppNotification
=>
({
...
defaultWarningNotification
,
title
:
title
,
text
:
text
,
id
:
Date
.
now
(),
});
public/app/core/reducers/appNotification.test.ts
View file @
f34cbae2
import
{
appNotificationsReducer
}
from
'./appNotification'
;
import
{
ActionTypes
}
from
'../actions/appNotification'
;
import
{
AppNotificationSeverity
}
from
'app/types/index
'
;
import
{
AppNotificationSeverity
,
AppNotificationTimeout
}
from
'app/types/
'
;
describe
(
'clear alert'
,
()
=>
{
it
(
'should filter alert'
,
()
=>
{
...
...
@@ -15,6 +15,7 @@ describe('clear alert', () => {
icon
:
'success'
,
title
:
'test'
,
text
:
'test alert'
,
timeout
:
AppNotificationTimeout
.
Success
,
},
{
id
:
id2
,
...
...
@@ -22,6 +23,7 @@ describe('clear alert', () => {
icon
:
'warning'
,
title
:
'test2'
,
text
:
'test alert fail 2'
,
timeout
:
AppNotificationTimeout
.
Warning
,
},
],
};
...
...
@@ -39,6 +41,7 @@ describe('clear alert', () => {
icon
:
'success'
,
title
:
'test'
,
text
:
'test alert'
,
timeout
:
AppNotificationTimeout
.
Success
,
},
],
};
...
...
public/app/core/reducers/appNotification.ts
View file @
f34cbae2
import
{
AppNotification
,
AppNotificationsState
}
from
'app/types/
index
'
;
import
{
AppNotification
,
AppNotificationsState
}
from
'app/types/'
;
import
{
Action
,
ActionTypes
}
from
'../actions/appNotification'
;
export
const
initialState
:
AppNotificationsState
=
{
...
...
@@ -17,7 +17,3 @@ export const appNotificationsReducer = (state = initialState, action: Action): A
}
return
state
;
};
export
default
{
appNotifications
:
appNotificationsReducer
,
};
public/app/core/reducers/index.ts
View file @
f34cbae2
import
{
navIndexReducer
as
navIndex
}
from
'./navModel'
;
import
{
locationReducer
as
location
}
from
'./location'
;
import
{
appNotificationsReducer
as
appNotifications
}
from
'./appNotification'
;
export
default
{
navIndex
,
location
,
appNotifications
,
};
public/app/store/configureStore.ts
View file @
f34cbae2
...
...
@@ -10,7 +10,6 @@ import dashboardReducers from 'app/features/dashboard/state/reducers';
import
pluginReducers
from
'app/features/plugins/state/reducers'
;
import
dataSourcesReducers
from
'app/features/datasources/state/reducers'
;
import
usersReducers
from
'app/features/users/state/reducers'
;
import
appNotificationReducers
from
'app/core/reducers/appNotification'
;
const
rootReducers
=
{
...
sharedReducers
,
...
...
@@ -22,7 +21,6 @@ const rootReducers = {
...
pluginReducers
,
...
dataSourcesReducers
,
...
usersReducers
,
...
appNotificationReducers
,
};
export
let
store
;
...
...
public/app/types/appNotifications.ts
View file @
f34cbae2
...
...
@@ -4,6 +4,7 @@ export interface AppNotification {
icon
:
string
;
title
:
string
;
text
:
string
;
timeout
:
AppNotificationTimeout
;
}
export
enum
AppNotificationSeverity
{
...
...
@@ -13,6 +14,12 @@ export enum AppNotificationSeverity {
Info
=
'info'
,
}
export
enum
AppNotificationTimeout
{
Warning
=
5000
,
Success
=
3000
,
Error
=
7000
,
}
export
interface
AppNotificationsState
{
appNotifications
:
AppNotification
[];
}
public/app/types/index.ts
View file @
f34cbae2
...
...
@@ -9,7 +9,12 @@ import { ApiKey, ApiKeysState, NewApiKey } from './apiKeys';
import
{
Invitee
,
OrgUser
,
User
,
UsersState
}
from
'./user'
;
import
{
DataSource
,
DataSourcesState
}
from
'./datasources'
;
import
{
PluginDashboard
,
PluginMeta
,
Plugin
,
PluginsState
}
from
'./plugins'
;
import
{
AppNotification
,
AppNotificationSeverity
,
AppNotificationsState
}
from
'./appNotifications'
;
import
{
AppNotification
,
AppNotificationSeverity
,
AppNotificationsState
,
AppNotificationTimeout
,
}
from
'./appNotifications'
;
export
{
Team
,
...
...
@@ -50,6 +55,7 @@ export {
AppNotification
,
AppNotificationsState
,
AppNotificationSeverity
,
AppNotificationTimeout
,
};
export
interface
StoreState
{
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment