mirror of
https://github.com/Foundry376/Mailspring.git
synced 2024-09-22 08:16:09 +08:00
70 lines
2 KiB
CoffeeScript
70 lines
2 KiB
CoffeeScript
React = require 'react'
|
|
_ = require "underscore"
|
|
PackageSet = require './package-set'
|
|
PackagesStore = require './packages-store'
|
|
PluginsActions = require './plugins-actions'
|
|
{Spinner, EventedIFrame, Flexbox} = require 'nylas-component-kit'
|
|
classNames = require 'classnames'
|
|
|
|
class TabExplore extends React.Component
|
|
@displayName: 'TabExplore'
|
|
|
|
constructor: (@props) ->
|
|
@state = @_getStateFromStores()
|
|
|
|
render: =>
|
|
if @state.search.length
|
|
collectionPrefix = "Matching "
|
|
if @state.searchResults
|
|
collection = @state.searchResults
|
|
emptyText = "No results found."
|
|
else
|
|
collection = {packages: [], themes: []}
|
|
emptyText = "Loading results..."
|
|
else
|
|
collection = @state.featured
|
|
collectionPrefix = "Featured "
|
|
emptyText = null
|
|
|
|
<div className="explore">
|
|
<div className="inner">
|
|
<input
|
|
type="search"
|
|
value={@state.search}
|
|
onChange={@_onSearchChange }
|
|
placeholder="Search Packages and Themes"/>
|
|
<PackageSet
|
|
title="#{collectionPrefix} Themes"
|
|
emptyText={emptyText ? "There are no featured themes yet."}
|
|
packages={collection.themes} />
|
|
<PackageSet
|
|
title="#{collectionPrefix} Packages"
|
|
emptyText={emptyText ? "There are no featured packages yet."}
|
|
packages={collection.packages} />
|
|
</div>
|
|
</div>
|
|
|
|
componentDidMount: =>
|
|
@_unsubscribers = []
|
|
@_unsubscribers.push PackagesStore.listen(@_onChange)
|
|
|
|
# Trigger a refresh of the featured packages
|
|
PluginsActions.refreshFeaturedPackages()
|
|
|
|
componentWillUnmount: =>
|
|
unsubscribe() for unsubscribe in @_unsubscribers
|
|
|
|
_getStateFromStores: =>
|
|
featured: PackagesStore.featured()
|
|
search: PackagesStore.globalSearchValue()
|
|
searchResults: PackagesStore.searchResults()
|
|
|
|
_onChange: =>
|
|
@setState(@_getStateFromStores())
|
|
|
|
_onSearchChange: (event) =>
|
|
PluginsActions.setGlobalSearchValue(event.target.value)
|
|
|
|
|
|
module.exports = TabExplore
|