15 | {props.source.iconurl ? : null}
16 |
17 | {props.source.name}
18 | {props.showCreator && props.item.creator && (
19 | {props.item.creator}
20 | )}
21 |
22 | {props.item.starred ? (
23 |
24 | ) : null}
25 | {props.item.hasRead ? null : }
26 | {props.hideTime ? null : }
27 |
dispatch(closeContextMenu())}>
18 |
25 | )
26 |
27 | const getLocale = (state: RootState) => ({ locale: state.app.locale })
28 | export default connect(getLocale)(Root)
29 |
--------------------------------------------------------------------------------
/src/index.tsx:
--------------------------------------------------------------------------------
1 | import * as React from "react"
2 | import * as ReactDOM from "react-dom"
3 | import { Provider } from "react-redux"
4 | import { createStore, applyMiddleware } from "redux"
5 | import thunkMiddleware from "redux-thunk"
6 | import { initializeIcons } from "@fluentui/react/lib/Icons"
7 | import { rootReducer, RootState } from "./scripts/reducer"
8 | import Root from "./components/root"
9 | import { AppDispatch } from "./scripts/utils"
10 | import { applyThemeSettings } from "./scripts/settings"
11 | import { initApp, openTextMenu } from "./scripts/models/app"
12 |
13 | window.settings.setProxy()
14 |
15 | applyThemeSettings()
16 | initializeIcons("icons/")
17 |
18 | const store = createStore(
19 | rootReducer,
20 | applyMiddleware
19 |
34 | )
35 |
36 | export default CompactCard
37 |
--------------------------------------------------------------------------------
/src/components/utils/time.tsx:
--------------------------------------------------------------------------------
1 | import * as React from "react"
2 | import intl from "react-intl-universal"
3 |
4 | interface TimeProps {
5 | date: Date
6 | }
7 |
8 | class Time extends React.Component
21 |
22 |
32 |
33 |
19 | {props.item.thumb ? (
20 | 
21 | ) : null}
22 |
23 | {props.item.thumb ? (
24 |
25 | ) : null}
26 |
28 |
30 |
34 | )
35 |
36 | export default DefaultCard
37 |
--------------------------------------------------------------------------------
/src/containers/page-container.tsx:
--------------------------------------------------------------------------------
1 | import { connect } from "react-redux"
2 | import { createSelector } from "reselect"
3 | import { RootState } from "../scripts/reducer"
4 | import Page from "../components/page"
5 | import { AppDispatch } from "../scripts/utils"
6 | import { dismissItem, showOffsetItem } from "../scripts/models/page"
7 | import { ContextMenuType } from "../scripts/models/app"
8 |
9 | const getPage = (state: RootState) => state.page
10 | const getSettings = (state: RootState) => state.app.settings.display
11 | const getMenu = (state: RootState) => state.app.menu
12 | const getContext = (state: RootState) =>
13 | state.app.contextMenu.type != ContextMenuType.Hidden
14 |
15 | const mapStateToProps = createSelector(
16 | [getPage, getSettings, getMenu, getContext],
17 | (page, settingsOn, menuOn, contextOn) => ({
18 | feeds: [page.feedId],
19 | settingsOn: settingsOn,
20 | menuOn: menuOn,
21 | contextOn: contextOn,
22 | itemId: page.itemId,
23 | itemFromFeed: page.itemFromFeed,
24 | viewType: page.viewType,
25 | })
26 | )
27 |
28 | const mapDispatchToProps = (dispatch: AppDispatch) => ({
29 | dismissItem: () => dispatch(dismissItem()),
30 | offsetItem: (offset: number) => dispatch(showOffsetItem(offset)),
31 | })
32 |
33 | const PageContainer = connect(mapStateToProps, mapDispatchToProps)(Page)
34 | export default PageContainer
35 |
--------------------------------------------------------------------------------
/dist/styles/dark.css:
--------------------------------------------------------------------------------
1 | @media (prefers-color-scheme: dark) {
2 | .ms-Button--commandBar.active .ms-Button-icon {
3 | color: #c7e0f4;
4 | }
5 | .btn-group .btn:hover,
6 | .ms-Nav-compositeLink:hover {
7 | background-color: #fff1;
8 | }
9 | .btn-group .btn:active,
10 | .ms-Nav-compositeLink:active {
11 | background-color: #fff2;
12 | }
13 | .settings .loading {
14 | background-color: #000a;
15 | }
16 | .default-card {
17 | box-shadow: #0006 0px 5px 20px;
18 | }
19 | .default-card:hover,
20 | .ms-Fabric--isFocusVisible .default-card:focus {
21 | box-shadow: #0008 0px 5px 40px;
22 | }
23 | .default-card div.bg {
24 | background-color: #000b;
25 | }
26 | .list-card:hover,
27 | .ms-Fabric--isFocusVisible .list-card:focus {
28 | box-shadow: #0006 0px 5px 15px;
29 | }
30 | .list-card:active {
31 | box-shadow: #0000 0px 5px 15px, inset #0006 0px 0px 15px;
32 | }
33 | .magazine-card:hover,
34 | .ms-Fabric--isFocusVisible .magazine-card:focus {
35 | box-shadow: #0006 0px 5px 20px;
36 | }
37 | .magazine-card:active {
38 | box-shadow: #0000 0px 5px 20px;
39 | }
40 | .compact-card:hover,
41 | .ms-Fabric--isFocusVisible .compact-card:focus {
42 | box-shadow: #0008 0 0 10px;
43 | }
44 | .compact-card:active {
45 | box-shadow: #0000 0 0 10px;
46 | }
47 | }
48 |
--------------------------------------------------------------------------------
/src/containers/nav-container.tsx:
--------------------------------------------------------------------------------
1 | import intl from "react-intl-universal"
2 | import { connect } from "react-redux"
3 | import { createSelector } from "reselect"
4 | import { RootState } from "../scripts/reducer"
5 | import { fetchItems, markAllRead } from "../scripts/models/item"
6 | import {
7 | toggleMenu,
8 | toggleLogMenu,
9 | toggleSettings,
10 | openViewMenu,
11 | openMarkAllMenu,
12 | } from "../scripts/models/app"
13 | import { toggleSearch } from "../scripts/models/page"
14 | import { ViewType } from "../schema-types"
15 | import Nav from "../components/nav"
16 |
17 | const getState = (state: RootState) => state.app
18 | const getItemShown = (state: RootState) =>
19 | state.page.itemId && state.page.viewType !== ViewType.List
20 |
21 | const mapStateToProps = createSelector(
22 | [getState, getItemShown],
23 | (state, itemShown) => ({
24 | state: state,
25 | itemShown: itemShown,
26 | })
27 | )
28 |
29 | const mapDispatchToProps = dispatch => ({
30 | fetch: () => dispatch(fetchItems()),
31 | menu: () => dispatch(toggleMenu()),
32 | logs: () => dispatch(toggleLogMenu()),
33 | views: () => dispatch(openViewMenu()),
34 | settings: () => dispatch(toggleSettings()),
35 | search: () => dispatch(toggleSearch()),
36 | markAllRead: () => dispatch(openMarkAllMenu()),
37 | })
38 |
39 | const NavContainer = connect(mapStateToProps, mapDispatchToProps)(Nav)
40 | export default NavContainer
41 |
--------------------------------------------------------------------------------
/.github/workflows/release-linux.yml:
--------------------------------------------------------------------------------
1 | name: CI/CD Release Linux
2 |
3 | on:
4 | release:
5 | types:
6 | - published
7 |
8 | jobs:
9 | release-linux:
10 | runs-on: ubuntu-latest
11 |
12 | steps:
13 | - uses: actions/checkout@v2
14 |
15 | - name: Build and package the app
16 | run: |
17 | sudo npm install --unsafe-perm=true --allow-root
18 | npm run build
19 | sudo npm run package-linux
20 |
21 | - name: Get app version
22 | id: package-version
23 | uses: martinbeentjes/npm-get-version-action@master
24 |
25 | - name: Get release
26 | id: get_release
27 | uses: bruceadams/get-release@v1.2.0
28 | env:
29 | GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
30 |
31 | - name: Upload AppImage to release assets
32 | uses: actions/upload-release-asset@v1
33 | env:
34 | GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
35 | with:
36 | upload_url: ${{ steps.get_release.outputs.upload_url }}
37 | asset_path: ./bin/linux/x64/Fluent Reader-${{ steps.package-version.outputs.current-version }}.AppImage
38 | asset_name: Fluent.Reader.${{ steps.package-version.outputs.current-version }}.AppImage
39 | asset_content_type: application/octet-stream
40 |
--------------------------------------------------------------------------------
/electron-builder.yml:
--------------------------------------------------------------------------------
1 | appId: me.hyliu.fluentreader
2 | productName: Fluent Reader
3 | copyright: Copyright © 2020 Haoyuan Liu
4 | files:
5 | - "./dist/**/*"
6 | - "!./dist/fontlist"
7 | - "!**/*.js.map"
8 | directories:
9 | output: "./bin/${platform}/${arch}/"
10 | mac:
11 | darkModeSupport: true
12 | target:
13 | - dmg
14 | category: public.app-category.news
15 | electronLanguages:
16 | - zh_CN
17 | - zh_TW
18 | - en
19 | - fr
20 | - es
21 | - de
22 | - tr
23 | - ja
24 | - sv
25 | - uk
26 | - it
27 | - nl
28 | - ko
29 | win:
30 | target:
31 | - nsis
32 | - zip
33 | appx:
34 | applicationId: FluentReader
35 | identityName: 25286HaoyuanLiu.FluentReader
36 | publisher: CN=FD70E7FA-E5AC-41C4-B9C4-6E8708A6616A
37 | backgroundColor: transparent
38 | languages:
39 | - zh-CN
40 | - zh-TW
41 | - en-US
42 | - fr-FR
43 | - es
44 | - de
45 | - tr
46 | - ja
47 | - sv
48 | - uk
49 | - it
50 | - nl
51 | - ko
52 | showNameOnTiles: true
53 | setBuildNumber: true
54 | nsis:
55 | oneClick: false
56 | perMachine: true
57 | allowToChangeInstallationDirectory: true
58 | deleteAppDataOnUninstall: true
59 | linux:
60 | target:
61 | - AppImage
62 | icon: build/icons
63 | category: Utility
64 | desktop:
65 | StartupWMClass: fluent-reader
66 |
--------------------------------------------------------------------------------
/src/containers/settings/app-container.tsx:
--------------------------------------------------------------------------------
1 | import { connect } from "react-redux"
2 | import {
3 | initIntl,
4 | saveSettings,
5 | setupAutoFetch,
6 | } from "../../scripts/models/app"
7 | import * as db from "../../scripts/db"
8 | import AppTab from "../../components/settings/app"
9 | import { importAll } from "../../scripts/settings"
10 | import { updateUnreadCounts } from "../../scripts/models/source"
11 | import { AppDispatch } from "../../scripts/utils"
12 |
13 | const mapDispatchToProps = (dispatch: AppDispatch) => ({
14 | setLanguage: (option: string) => {
15 | window.settings.setLocaleSettings(option)
16 | dispatch(initIntl())
17 | },
18 | setFetchInterval: (interval: number) => {
19 | window.settings.setFetchInterval(interval)
20 | dispatch(setupAutoFetch())
21 | },
22 | deleteArticles: async (days: number) => {
23 | dispatch(saveSettings())
24 | let date = new Date()
25 | date.setTime(date.getTime() - days * 86400000)
26 | await db.itemsDB
27 | .delete()
28 | .from(db.items)
29 | .where(db.items.date.lt(date))
30 | .exec()
31 | await dispatch(updateUnreadCounts())
32 | dispatch(saveSettings())
33 | },
34 | importAll: async () => {
35 | dispatch(saveSettings())
36 | let cancelled = await importAll()
37 | if (cancelled) dispatch(saveSettings())
38 | },
39 | })
40 |
41 | const AppTabContainer = connect(null, mapDispatchToProps)(AppTab)
42 | export default AppTabContainer
43 |
--------------------------------------------------------------------------------
/src/components/cards/magazine-card.tsx:
--------------------------------------------------------------------------------
1 | import * as React from "react"
2 | import { Card } from "./card"
3 | import CardInfo from "./info"
4 | import Highlights from "./highlights"
5 |
6 | const className = (props: Card.Props) => {
7 | let cn = ["card", "magazine-card"]
8 | if (props.item.hasRead) cn.push("read")
9 | if (props.item.hidden) cn.push("hidden")
10 | return cn.join(" ")
11 | }
12 |
13 | const MagazineCard: React.FunctionComponent
28 |
30 |
31 |
19 | {props.item.thumb ? (
20 |
43 | )
44 |
45 | export default MagazineCard
46 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | BSD 3-Clause License
2 |
3 | Copyright (c) 2020, Haoyuan Liu
4 | All rights reserved.
5 |
6 | Redistribution and use in source and binary forms, with or without
7 | modification, are permitted provided that the following conditions are met:
8 |
9 | 1. Redistributions of source code must retain the above copyright notice, this
10 | list of conditions and the following disclaimer.
11 |
12 | 2. Redistributions in binary form must reproduce the above copyright notice,
13 | this list of conditions and the following disclaimer in the documentation
14 | and/or other materials provided with the distribution.
15 |
16 | 3. Neither the name of the copyright holder nor the names of its
17 | contributors may be used to endorse or promote products derived from
18 | this software without specific prior written permission.
19 |
20 | THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
21 | AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
22 | IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
23 | DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
24 | FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
25 | DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
26 | SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
27 | CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
28 | OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
29 | OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
30 |
--------------------------------------------------------------------------------
/src/components/utils/danger-button.tsx:
--------------------------------------------------------------------------------
1 | import * as React from "react"
2 | import intl from "react-intl-universal"
3 | import { PrimaryButton } from "@fluentui/react"
4 |
5 | class DangerButton extends PrimaryButton {
6 | timerID: NodeJS.Timeout
7 |
8 | state = {
9 | confirming: false,
10 | }
11 |
12 | clear = () => {
13 | this.timerID = null
14 | this.setState({ confirming: false })
15 | }
16 |
17 | onClick = (event: React.MouseEvent
21 |
22 |
23 | ) : null}
24 |
25 |
42 |
26 |
27 |
33 |
40 |
27 |
33 |
34 |
22 | {props.item.thumb && props.viewConfigs & ViewConfigs.ShowCover ? (
23 |
46 | )
47 |
48 | export default ListCard
49 |
--------------------------------------------------------------------------------
/src/containers/settings/service-container.tsx:
--------------------------------------------------------------------------------
1 | import { connect } from "react-redux"
2 | import { createSelector } from "reselect"
3 | import { RootState } from "../../scripts/reducer"
4 | import { ServiceTab } from "../../components/settings/service"
5 | import { AppDispatch } from "../../scripts/utils"
6 | import { ServiceConfigs } from "../../schema-types"
7 | import {
8 | saveServiceConfigs,
9 | getServiceHooksFromType,
10 | removeService,
11 | syncWithService,
12 | } from "../../scripts/models/service"
13 | import { saveSettings } from "../../scripts/models/app"
14 |
15 | const getService = (state: RootState) => state.service
16 |
17 | const mapStateToProps = createSelector([getService], service => ({
18 | configs: service,
19 | }))
20 |
21 | const mapDispatchToProps = (dispatch: AppDispatch) => ({
22 | save: (configs: ServiceConfigs) => dispatch(saveServiceConfigs(configs)),
23 | remove: () => dispatch(removeService()),
24 | blockActions: () => dispatch(saveSettings()),
25 | sync: () => dispatch(syncWithService()),
26 | authenticate: async (configs: ServiceConfigs) => {
27 | const hooks = getServiceHooksFromType(configs.type)
28 | if (hooks.authenticate) return await hooks.authenticate(configs)
29 | else return true
30 | },
31 | reauthenticate: async (configs: ServiceConfigs) => {
32 | const hooks = getServiceHooksFromType(configs.type)
33 | try {
34 | if (hooks.reauthenticate) return await hooks.reauthenticate(configs)
35 | } catch (err) {
36 | console.log(err)
37 | return configs
38 | }
39 | },
40 | })
41 |
42 | const ServiceTabContainer = connect(
43 | mapStateToProps,
44 | mapDispatchToProps
45 | )(ServiceTab)
46 | export default ServiceTabContainer
47 |
--------------------------------------------------------------------------------
/dist/icons/logo-outline.svg:
--------------------------------------------------------------------------------
1 |
61 |
--------------------------------------------------------------------------------
/dist/icons/logo-outline-dark.svg:
--------------------------------------------------------------------------------
1 |
61 |
--------------------------------------------------------------------------------
/src/containers/settings/groups-container.tsx:
--------------------------------------------------------------------------------
1 | import { connect } from "react-redux"
2 | import { createSelector } from "reselect"
3 | import { RootState } from "../../scripts/reducer"
4 | import GroupsTab from "../../components/settings/groups"
5 | import {
6 | createSourceGroup,
7 | updateSourceGroup,
8 | addSourceToGroup,
9 | deleteSourceGroup,
10 | removeSourceFromGroup,
11 | reorderSourceGroups,
12 | } from "../../scripts/models/group"
13 | import { SourceGroup, SyncService } from "../../schema-types"
14 | import { importGroups } from "../../scripts/models/service"
15 | import { AppDispatch } from "../../scripts/utils"
16 |
17 | const getSources = (state: RootState) => state.sources
18 | const getGroups = (state: RootState) => state.groups
19 | const getServiceOn = (state: RootState) =>
20 | state.service.type !== SyncService.None
21 |
22 | const mapStateToProps = createSelector(
23 | [getSources, getGroups, getServiceOn],
24 | (sources, groups, serviceOn) => ({
25 | sources: sources,
26 | groups: groups.map((g, i) => ({ ...g, index: i })),
27 | serviceOn: serviceOn,
28 | key: groups.length,
29 | })
30 | )
31 |
32 | const mapDispatchToProps = (dispatch: AppDispatch) => ({
33 | createGroup: (name: string) => dispatch(createSourceGroup(name)),
34 | updateGroup: (group: SourceGroup) => dispatch(updateSourceGroup(group)),
35 | addToGroup: (groupIndex: number, sid: number) =>
36 | dispatch(addSourceToGroup(groupIndex, sid)),
37 | deleteGroup: (groupIndex: number) =>
38 | dispatch(deleteSourceGroup(groupIndex)),
39 | removeFromGroup: (groupIndex: number, sids: number[]) =>
40 | dispatch(removeSourceFromGroup(groupIndex, sids)),
41 | reorderGroups: (groups: SourceGroup[]) =>
42 | dispatch(reorderSourceGroups(groups)),
43 | importGroups: () => dispatch(importGroups()),
44 | })
45 |
46 | const GroupsTabContainer = connect(
47 | mapStateToProps,
48 | mapDispatchToProps
49 | )(GroupsTab)
50 | export default GroupsTabContainer
51 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "fluent-reader",
3 | "version": "1.1.0",
4 | "description": "Modern desktop RSS reader",
5 | "main": "./dist/electron.js",
6 | "scripts": {
7 | "build": "webpack --config ./webpack.config.js",
8 | "electron": "electron ./dist/electron.js",
9 | "start": "npm run build && npm run electron",
10 | "format": "prettier --write .",
11 | "package-win": "electron-builder -w appx:x64 && electron-builder -w appx:ia32 && electron-builder -w appx:arm64",
12 | "package-win-ci": "electron-builder -w --x64 -p never && electron-builder -w --ia32 -p never",
13 | "package-mac": "electron-builder --mac --x64",
14 | "package-mas": "bash build/resignAndPackage.sh",
15 | "package-linux": "electron-builder --linux -p never"
16 | },
17 | "keywords": [],
18 | "author": "Haoyuan Liu",
19 | "license": "BSD-3-Clause",
20 | "repository": "github:yang991178/fluent-reader",
21 | "devDependencies": {
22 | "@fluentui/react": "^7.126.2",
23 | "@types/lovefield": "^2.1.3",
24 | "@types/nedb": "^1.8.9",
25 | "@types/react": "^16.9.35",
26 | "@types/react-dom": "^16.9.8",
27 | "@types/react-redux": "^7.1.9",
28 | "@yang991178/rss-parser": "^3.8.1",
29 | "electron": "^16.0.2",
30 | "electron-builder": "^22.11.3",
31 | "electron-react-devtools": "^0.5.3",
32 | "electron-store": "^5.2.0",
33 | "electron-window-state": "^5.0.3",
34 | "font-list": "^1.4.2",
35 | "hard-source-webpack-plugin": "^0.13.1",
36 | "html-webpack-plugin": "^4.3.0",
37 | "js-md5": "^0.7.3",
38 | "lovefield": "^2.1.12",
39 | "nedb": "^1.8.0",
40 | "prettier": "2.3.2",
41 | "qrcode.react": "^1.0.0",
42 | "react": "^16.13.1",
43 | "react-dom": "^16.13.1",
44 | "react-intl-universal": "^2.2.5",
45 | "react-redux": "^7.2.0",
46 | "redux": "^4.0.5",
47 | "redux-devtools": "^3.5.0",
48 | "redux-thunk": "^2.3.0",
49 | "reselect": "^4.0.0",
50 | "ts-loader": "^7.0.4",
51 | "typescript": "^4.3.5",
52 | "webpack": "^4.43.0",
53 | "webpack-cli": "^3.3.11"
54 | }
55 | }
56 |
--------------------------------------------------------------------------------
/src/components/utils/article-search.tsx:
--------------------------------------------------------------------------------
1 | import * as React from "react"
2 | import intl from "react-intl-universal"
3 | import { connect } from "react-redux"
4 | import { RootState } from "../../scripts/reducer"
5 | import { SearchBox, ISearchBox, Async } from "@fluentui/react"
6 | import { AppDispatch, validateRegex } from "../../scripts/utils"
7 | import { performSearch } from "../../scripts/models/page"
8 |
9 | type SearchProps = {
10 | searchOn: boolean
11 | initQuery: string
12 | dispatch: AppDispatch
13 | }
14 |
15 | type SearchState = {
16 | query: string
17 | }
18 |
19 | class ArticleSearch extends React.Component
24 |
25 |
26 | ) : null}
27 |
28 |
30 |
36 | {Boolean(props.viewConfigs & ViewConfigs.ShowSnippet) && (
37 |
45 |
30 |
36 | {Boolean(props.viewConfigs & ViewConfigs.ShowSnippet) && (
37 |
38 |
8 |
9 | 
10 |
21 |
22 |
24 | window.utils.openExternal(
25 | "https://github.com/yang991178/fluent-reader/wiki/Support#keyboard-shortcuts"
26 | )
27 | }>
28 | {intl.get("settings.shortcuts")}
29 |
30 |
31 |
32 |
34 | window.utils.openExternal(
35 | "https://github.com/yang991178/fluent-reader"
36 | )
37 | }>
38 | {intl.get("settings.openSource")}
39 |
40 |
41 |
42 |
44 | window.utils.openExternal(
45 | "https://github.com/yang991178/fluent-reader/issues"
46 | )
47 | }>
48 | {intl.get("settings.feedback")}
49 |
50 |
51 |
52 |
53 |
54 | )
55 | }
56 |
57 | export default AboutTab
58 |
--------------------------------------------------------------------------------
/src/components/cards/highlights.tsx:
--------------------------------------------------------------------------------
1 | import * as React from "react"
2 | import { validateRegex } from "../../scripts/utils"
3 | import { FeedFilter, FilterType } from "../../scripts/models/feed"
4 |
5 | type HighlightsProps = {
6 | text: string
7 | filter: FeedFilter
8 | title?: boolean
9 | }
10 |
11 | const Highlights: React.FunctionComponent
10 | Fluent Reader
11 | 12 | {intl.get("settings.version")} {window.utils.getVersion()} 13 | 14 |15 | Copyright © 2020 Haoyuan Liu. All rights reserved. 16 |
17 |68 | {intl.get("log.empty")} 69 |
70 | ) : ( 71 | this.activityItems().map(item => ( 72 |
2 | 
3 |
Fluent Reader
5 |A modern desktop RSS reader
6 |
7 | 
10 |
12 | 13 | ## Download 14 | 15 | For Windows 10 users, the recommended way of installation is through [Microsoft Store](https://www.microsoft.com/store/apps/9P71FC94LRH8?cid=github). 16 | This enables auto-update and experimental ARM64 support. 17 | macOS users can also get Fluent Reader from the [Mac App Store](https://apps.apple.com/app/id1520907427). 18 | 19 | If you are using Linux or an older version of Windows, you can [get Fluent Reader from GitHub releases](https://github.com/yang991178/fluent-reader/releases). 20 | 21 | ### Mobile App 22 | 23 | The repo of the mobile version of this app [can be found here](https://github.com/yang991178/fluent-reader-lite). 24 | 25 | ## Features 26 | 27 |
28 | 
29 |
92 |
97 | this.props.loadMore(this.props.feed)
98 | }
99 | />
100 |
101 | ) : null}
102 | {this.props.items.length === 0 && (
103 | {intl.get("article.empty")}
104 | )}
105 |
11 | 
12 | Fluent Reader
13 |
14 |
12 |
15 | 
16 |
22 | Modern desktop RSS reader. Open-source.
17 |18 | Fluent Reader is a local, cross-platform news aggregator with a fresh look. 19 | Bring all your favorite sources with you and read distraction-free. 20 |
21 |
23 |
24 | 
33 |
34 |
35 | 
43 |
44 |
45 | 
53 |
54 |
55 |
64 |
69 |
70 | Open & Organized.
25 |26 | Stay in sync with Inoreader, Feedbin, or services compatible with 27 | Fever or Google Reader API. Alternatively, import your sources from 28 | an OPML file and read locally. 29 | Easily organize sources with groups. Move between computers with full 30 | data backups. 31 |
32 |
33 | Read fluently.
36 |37 | Enjoy your contents like never before with the built-in article view 38 | for RSS full text tailored to maximize focus. Source only comes with 39 | snippets? Configure to load full content with Mercury Parser, load 40 | webpage in the app, or open externally by default. 41 |
42 |
43 | Search. Filter.
46 |47 | Find anything you want with the power of regular expressions. Search in 48 | both titles and full contents of articles. Mark articles as starred, 49 | hidden, or unread and filter as they arrive with custom rules based 50 | on regular expressions. 51 |
52 |
53 | Privacy first.
56 |All your data stays with you.
57 |All cookies cleared upon exit.
58 |XSS blocked in an isolated context.
59 |No personal information collected, ever.
60 |Behavior tracking limited.
61 |Strict Content Security Policy enforced.
62 |Proxy support with PAC.
63 |64 |
■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■
65 |■ ■ ■ ■ ■ ■
66 |■ ■ ■ ■ ■ ■ ■ ■ ■
67 |■ ■ ■ ■ ■ ■ ■
68 |
71 | 
72 |
75 | Oh, it also comes in black.
73 |Full system-level dark mode support for both UI and reading.
74 |
76 |
87 |
88 |
--------------------------------------------------------------------------------
/src/bridges/settings.ts:
--------------------------------------------------------------------------------
1 | import {
2 | SourceGroup,
3 | ViewType,
4 | ThemeSettings,
5 | SearchEngines,
6 | ServiceConfigs,
7 | ViewConfigs,
8 | } from "../schema-types"
9 | import { ipcRenderer } from "electron"
10 |
11 | const settingsBridge = {
12 | saveGroups: (groups: SourceGroup[]) => {
13 | ipcRenderer.invoke("set-groups", groups)
14 | },
15 | loadGroups: (): SourceGroup[] => {
16 | return ipcRenderer.sendSync("get-groups")
17 | },
18 |
19 | getDefaultMenu: (): boolean => {
20 | return ipcRenderer.sendSync("get-menu")
21 | },
22 | setDefaultMenu: (state: boolean) => {
23 | ipcRenderer.invoke("set-menu", state)
24 | },
25 |
26 | getProxyStatus: (): boolean => {
27 | return ipcRenderer.sendSync("get-proxy-status")
28 | },
29 | toggleProxyStatus: () => {
30 | ipcRenderer.send("toggle-proxy-status")
31 | },
32 | getProxy: (): string => {
33 | return ipcRenderer.sendSync("get-proxy")
34 | },
35 | setProxy: (address: string = null) => {
36 | ipcRenderer.invoke("set-proxy", address)
37 | },
38 |
39 | getDefaultView: (): ViewType => {
40 | return ipcRenderer.sendSync("get-view")
41 | },
42 | setDefaultView: (viewType: ViewType) => {
43 | ipcRenderer.invoke("set-view", viewType)
44 | },
45 |
46 | getThemeSettings: (): ThemeSettings => {
47 | return ipcRenderer.sendSync("get-theme")
48 | },
49 | setThemeSettings: (theme: ThemeSettings) => {
50 | ipcRenderer.invoke("set-theme", theme)
51 | },
52 | shouldUseDarkColors: (): boolean => {
53 | return ipcRenderer.sendSync("get-theme-dark-color")
54 | },
55 | addThemeUpdateListener: (callback: (shouldDark: boolean) => any) => {
56 | ipcRenderer.on("theme-updated", (_, shouldDark) => {
57 | callback(shouldDark)
58 | })
59 | },
60 |
61 | setLocaleSettings: (option: string) => {
62 | ipcRenderer.invoke("set-locale", option)
63 | },
64 | getLocaleSettings: (): string => {
65 | return ipcRenderer.sendSync("get-locale-settings")
66 | },
67 | getCurrentLocale: (): string => {
68 | return ipcRenderer.sendSync("get-locale")
69 | },
70 |
71 | getFontSize: (): number => {
72 | return ipcRenderer.sendSync("get-font-size")
73 | },
74 | setFontSize: (size: number) => {
75 | ipcRenderer.invoke("set-font-size", size)
76 | },
77 |
78 | getFont: (): string => {
79 | return ipcRenderer.sendSync("get-font")
80 | },
81 | setFont: (font: string) => {
82 | ipcRenderer.invoke("set-font", font)
83 | },
84 |
85 | getFetchInterval: (): number => {
86 | return ipcRenderer.sendSync("get-fetch-interval")
87 | },
88 | setFetchInterval: (interval: number) => {
89 | ipcRenderer.invoke("set-fetch-interval", interval)
90 | },
91 |
92 | getSearchEngine: (): SearchEngines => {
93 | return ipcRenderer.sendSync("get-search-engine")
94 | },
95 | setSearchEngine: (engine: SearchEngines) => {
96 | ipcRenderer.invoke("set-search-engine", engine)
97 | },
98 |
99 | getServiceConfigs: (): ServiceConfigs => {
100 | return ipcRenderer.sendSync("get-service-configs")
101 | },
102 | setServiceConfigs: (configs: ServiceConfigs) => {
103 | ipcRenderer.invoke("set-service-configs", configs)
104 | },
105 |
106 | getFilterType: (): number => {
107 | return ipcRenderer.sendSync("get-filter-type")
108 | },
109 | setFilterType: (filterType: number) => {
110 | ipcRenderer.invoke("set-filter-type", filterType)
111 | },
112 |
113 | getViewConfigs: (view: ViewType): ViewConfigs => {
114 | return ipcRenderer.sendSync("get-view-configs", view)
115 | },
116 | setViewConfigs: (view: ViewType, configs: ViewConfigs) => {
117 | ipcRenderer.invoke("set-view-configs", view, configs)
118 | },
119 |
120 | getNeDBStatus: (): boolean => {
121 | return ipcRenderer.sendSync("get-nedb-status")
122 | },
123 | setNeDBStatus: (flag: boolean) => {
124 | ipcRenderer.invoke("set-nedb-status", flag)
125 | },
126 |
127 | getAll: () => {
128 | return ipcRenderer.sendSync("get-all-settings") as Object
129 | },
130 |
131 | setAll: configs => {
132 | ipcRenderer.invoke("import-all-settings", configs)
133 | },
134 | }
135 |
136 | declare global {
137 | interface Window {
138 | settings: typeof settingsBridge
139 | }
140 | }
141 |
142 | export default settingsBridge
143 |
--------------------------------------------------------------------------------
/src/components/feeds/cards-feed.tsx:
--------------------------------------------------------------------------------
1 | import * as React from "react"
2 | import intl from "react-intl-universal"
3 | import { FeedProps } from "./feed"
4 | import DefaultCard from "../cards/default-card"
5 | import { PrimaryButton, FocusZone } from "office-ui-fabric-react"
6 | import { RSSItem } from "../../scripts/models/item"
7 | import { List, AnimationClassNames } from "@fluentui/react"
8 |
9 | class CardsFeed extends React.Component
77 | 
78 | 
79 |
80 |
81 |
86 |
78 |
79 |
99 |
104 | this.props.loadMore(this.props.feed)
105 | }
106 | />
107 |
108 | ) : null}
109 | {this.props.items.length === 0 && (
110 | {intl.get("article.empty")}
111 | )}
112 |
46 |
107 | )
108 | }
109 |
110 | export default Settings
111 |
--------------------------------------------------------------------------------
/src/components/settings/service.tsx:
--------------------------------------------------------------------------------
1 | import * as React from "react"
2 | import intl from "react-intl-universal"
3 | import { ServiceConfigs, SyncService } from "../../schema-types"
4 | import { Stack, Icon, Link, Dropdown, IDropdownOption } from "@fluentui/react"
5 | import FeverConfigsTab from "./services/fever"
6 | import FeedbinConfigsTab from "./services/feedbin"
7 | import GReaderConfigsTab from "./services/greader"
8 | import InoreaderConfigsTab from "./services/inoreader"
9 |
10 | type ServiceTabProps = {
11 | configs: ServiceConfigs
12 | save: (configs: ServiceConfigs) => void
13 | sync: () => Promise
53 |
59 |
62 |
63 | {this.props.blocked && (
64 |
67 |
72 | )}
73 |
74 |
77 |
79 |
82 |
84 |
87 |
89 |
92 |
94 |
97 |
99 |
102 |
104 |
105 |
106 |
98 | {this.state.type === SyncService.None ? (
99 |
100 |
104 |
108 |
109 | {intl.get("service.intro")}
110 |
112 | window.utils.openExternal(
113 | "https://github.com/yang991178/fluent-reader/wiki/Support#services"
114 | )
115 | }
116 | style={{ marginLeft: 6 }}>
117 | {intl.get("rules.help")}
118 |
119 |
120 |
128 | ) : (
129 | this.getConfigsTab()
130 | )}
131 |
132 | )
133 | }
134 |
--------------------------------------------------------------------------------
/docs/styles.css:
--------------------------------------------------------------------------------
1 | html,
2 | body {
3 | background-color: #f3f2f1;
4 | font-family: "Segoe UI", "Microsoft YaHei", sans-serif;
5 | margin: 0;
6 | line-height: 1.5;
7 | width: 100%;
8 | }
9 | html {
10 | overflow-x: hidden;
11 | }
12 |
13 | a {
14 | color: #0078d4;
15 | text-decoration: none;
16 | }
17 | a:hover,
18 | a:active {
19 | color: #004578;
20 | text-decoration: underline;
21 | }
22 |
23 | .elevate {
24 | box-shadow: 0 6.4px 14.4px 0 rgba(0, 0, 0, 0.132),
25 | 0 1.2px 3.6px 0 rgba(0, 0, 0, 0.108);
26 | }
27 |
28 | .logo-container {
29 | height: 100vh;
30 | width: 100%;
31 | min-height: 540px;
32 | position: relative;
33 | }
34 | .logo-container img {
35 | height: 180px;
36 | width: 180px;
37 | position: fixed;
38 | left: calc(50% - 90px);
39 | top: calc(50% - 230px);
40 | }
41 | .logo-container header {
42 | text-align: center;
43 | display: block;
44 | width: 100%;
45 | font-size: 1.75em;
46 | font-weight: 500;
47 | position: fixed;
48 | left: 0;
49 | top: calc(50% - 40px);
50 | }
51 |
52 | .screenshot {
53 | display: block;
54 | margin: 0 auto;
55 | width: 90%;
56 | max-width: 1464px;
57 | overflow: hidden;
58 | }
59 | .screenshot > img {
60 | width: 100%;
61 | }
62 |
63 | .light-container {
64 | padding-bottom: 48px;
65 | background-color: #fff;
66 | position: relative;
67 | }
68 | .light-container .screenshot {
69 | margin: 0 auto -280px;
70 | position: relative;
71 | top: -280px;
72 | }
73 | .light-container h1,
74 | .dark-container h1 {
75 | width: 95%;
76 | max-width: 800px;
77 | margin: 48px auto 24px;
78 | font-weight: 500;
79 | text-align: center;
80 | }
81 | .light-container p,
82 | .dark-container p {
83 | width: 85%;
84 | max-width: 750px;
85 | margin: 24px auto;
86 | text-align: center;
87 | font-size: 1.375em;
88 | color: #323130;
89 | }
90 |
91 | .features-container {
92 | padding: 48px 0;
93 | margin: 0 auto;
94 | width: 95%;
95 | max-width: 950px;
96 | display: flex;
97 | flex-wrap: wrap;
98 | justify-content: space-around;
99 | position: relative;
100 | background-color: #f3f2f1;
101 | }
102 | .features-container > section {
103 | display: block;
104 | width: 45%;
105 | height: 560px;
106 | padding: 18px 36px;
107 | background-color: #fff;
108 | margin: 24px 0;
109 | overflow: hidden;
110 | position: relative;
111 | box-sizing: border-box;
112 | }
113 | .features-container > section > h3 {
114 | font-weight: 500;
115 | color: #605e5c;
116 | margin: 0 0 0.5em;
117 | }
118 | .features-container > section > h3 > span {
119 | color: #d2d0ce;
120 | background-color: #d2d0ce;
121 | user-select: none;
122 | }
123 | .features-container > section > img {
124 | position: absolute;
125 | right: 0;
126 | bottom: 0;
127 | max-width: 90%;
128 | }
129 | .features-container > section > img.center {
130 | left: auto;
131 | right: auto;
132 | }
133 |
134 | .dark-container {
135 | position: relative;
136 | background-color: #1f1f1f;
137 | color: #fff;
138 | padding: 72px 0;
139 | overflow: hidden;
140 | }
141 | .dark-container p {
142 | color: #d2d0ce;
143 | }
144 |
145 | .get-container {
146 | height: 100vh;
147 | width: 100%;
148 | min-height: 540px;
149 | display: flex;
150 | align-items: center;
151 | justify-content: flex-end;
152 | flex-direction: column;
153 | position: relative;
154 | }
155 | .stores {
156 | display: flex;
157 | flex-direction: row;
158 | justify-content: center;
159 | align-items: center;
160 | }
161 | .stores > a {
162 | display: inline-block;
163 | margin: 0 16px 16px;
164 | }
165 | .ms-get {
166 | width: 142px;
167 | height: 52px;
168 | }
169 | .mac-get {
170 | height: 52px;
171 | }
172 | .links {
173 | display: flex;
174 | flex-direction: row;
175 | justify-content: center;
176 | margin: calc(50vh - 210px) 0 48px;
177 | }
178 | .links > a {
179 | display: inline-block;
180 | margin: 0 8px;
181 | }
182 |
183 | @media (max-width: 780px) {
184 | html,
185 | body {
186 | font-size: 14px;
187 | }
188 | .logo-container img {
189 | height: 140px;
190 | width: 140px;
191 | left: calc(50% - 70px);
192 | top: calc(50% - 190px);
193 | }
194 | .screenshot {
195 | margin-left: 5vw;
196 | }
197 | .light-container .screenshot {
198 | width: 95vw;
199 | margin: 0 0 -25vw 5vw;
200 | position: relative;
201 | top: -25vw;
202 | }
203 | .screenshot > img {
204 | width: 150%;
205 | }
206 | .features-container > section {
207 | width: 95%;
208 | height: auto;
209 | padding-bottom: 80%;
210 | }
211 | .features-container > section:last-of-type {
212 | padding-bottom: 36px;
213 | }
214 | .stores {
215 | flex-direction: column;
216 | }
217 | .links {
218 | margin-top: calc(50vh - 270px);
219 | }
220 | }
221 |
--------------------------------------------------------------------------------
/src/components/page.tsx:
--------------------------------------------------------------------------------
1 | import * as React from "react"
2 | import { FeedContainer } from "../containers/feed-container"
3 | import { AnimationClassNames, Icon, FocusTrapZone } from "@fluentui/react"
4 | import ArticleContainer from "../containers/article-container"
5 | import { ViewType } from "../schema-types"
6 | import ArticleSearch from "./utils/article-search"
7 |
8 | type PageProps = {
9 | menuOn: boolean
10 | contextOn: boolean
11 | settingsOn: boolean
12 | feeds: string[]
13 | itemId: number
14 | itemFromFeed: boolean
15 | viewType: ViewType
16 | dismissItem: () => void
17 | offsetItem: (offset: number) => void
18 | }
19 |
20 | class Page extends React.Component
37 |
46 | )}
47 | {this.props.itemId && (
48 | e.stopPropagation()}>
57 |
59 | {this.props.itemFromFeed && (
60 | <>
61 |
62 |
63 |
66 |
67 |
68 |
71 |
72 | )}
73 |
84 |
111 | )}
112 |
113 | )
114 | }
115 |
116 | export default Page
117 |
--------------------------------------------------------------------------------
/src/scripts/db.ts:
--------------------------------------------------------------------------------
1 | import intl from "react-intl-universal"
2 | import Datastore from "nedb"
3 | import lf from "lovefield"
4 | import { RSSSource } from "./models/source"
5 | import { RSSItem } from "./models/item"
6 |
7 | const sdbSchema = lf.schema.create("sourcesDB", 2)
8 | sdbSchema
9 | .createTable("sources")
10 | .addColumn("sid", lf.Type.INTEGER)
11 | .addPrimaryKey(["sid"], false)
12 | .addColumn("url", lf.Type.STRING)
13 | .addColumn("iconurl", lf.Type.STRING)
14 | .addColumn("name", lf.Type.STRING)
15 | .addColumn("openTarget", lf.Type.NUMBER)
16 | .addColumn("lastFetched", lf.Type.DATE_TIME)
17 | .addColumn("serviceRef", lf.Type.STRING)
18 | .addColumn("fetchFrequency", lf.Type.NUMBER)
19 | .addColumn("rules", lf.Type.OBJECT)
20 | .addColumn("textDir", lf.Type.NUMBER)
21 | .addNullable(["iconurl", "serviceRef", "rules"])
22 | .addIndex("idxURL", ["url"], true)
23 |
24 | const idbSchema = lf.schema.create("itemsDB", 1)
25 | idbSchema
26 | .createTable("items")
27 | .addColumn("_id", lf.Type.INTEGER)
28 | .addPrimaryKey(["_id"], true)
29 | .addColumn("source", lf.Type.INTEGER)
30 | .addColumn("title", lf.Type.STRING)
31 | .addColumn("link", lf.Type.STRING)
32 | .addColumn("date", lf.Type.DATE_TIME)
33 | .addColumn("fetchedDate", lf.Type.DATE_TIME)
34 | .addColumn("thumb", lf.Type.STRING)
35 | .addColumn("content", lf.Type.STRING)
36 | .addColumn("snippet", lf.Type.STRING)
37 | .addColumn("creator", lf.Type.STRING)
38 | .addColumn("hasRead", lf.Type.BOOLEAN)
39 | .addColumn("starred", lf.Type.BOOLEAN)
40 | .addColumn("hidden", lf.Type.BOOLEAN)
41 | .addColumn("notify", lf.Type.BOOLEAN)
42 | .addColumn("serviceRef", lf.Type.STRING)
43 | .addNullable(["thumb", "creator", "serviceRef"])
44 | .addIndex("idxDate", ["date"], false, lf.Order.DESC)
45 | .addIndex("idxService", ["serviceRef"], false)
46 |
47 | export let sourcesDB: lf.Database
48 | export let sources: lf.schema.Table
49 | export let itemsDB: lf.Database
50 | export let items: lf.schema.Table
51 |
52 | async function onUpgradeSourceDB(rawDb: lf.raw.BackStore) {
53 | const version = rawDb.getVersion()
54 | if (version < 2) {
55 | await rawDb.addTableColumn("sources", "textDir", 0)
56 | }
57 | }
58 |
59 | export async function init() {
60 | sourcesDB = await sdbSchema.connect({ onUpgrade: onUpgradeSourceDB })
61 | sources = sourcesDB.getSchema().table("sources")
62 | itemsDB = await idbSchema.connect()
63 | items = itemsDB.getSchema().table("items")
64 | if (window.settings.getNeDBStatus()) {
65 | await migrateNeDB()
66 | }
67 | }
68 |
69 | async function migrateNeDB() {
70 | try {
71 | const sdb = new Datastore
86 | {this.props.feeds.map(fid => (
87 |
94 | {this.props.itemId ? (
95 |
96 |
98 | ) : (
99 |
100 | 
104 | 
108 |
109 | )}
110 |
104 |
108 |