prehistoric-systems/FilterLists
1
0
Fork 0
mirror of https://github.com/collinbarrett/FilterLists.git synced 2026-03-11 09:04:27 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

organizing react proj

Browse source
This commit is contained in:
Collin Barrett 2018-09-16 17:51:03 -05:00
parent 2245ea1307
commit eb4de758dc
12 changed files with 78 additions and 41 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/FilterLists.Web/ClientApp/Boot.tsx
View file

@ -18,7 +18,7 @@ function renderApp() {
renderApp();
if (module.hot) {
module.hot.accept("./routes",
module.hot.accept("./Routes",
() => {
routes = require<typeof RoutesModule>("./Routes").Routes;
renderApp();

4
src/FilterLists.Web/ClientApp/Layout.tsx
View file

@ -2,11 +2,11 @@ import * as React from "react";
import "bootstrap";
import "./site.css";
interface ILayoutProps {
interface IProps {
children?: React.ReactNode;
}
export const Layout = (props: ILayoutProps) => {
export const Layout = (props: IProps) => {
return <div className="container">
<Header/>
<div className="row">

12
src/FilterLists.Web/ClientApp/modules/home/Home.tsx
View file

@ -10,10 +10,10 @@ const columnVisibilityDefaults = [
];
interface IProps {
languages: ILanguageDto[];
lists: IListDto[];
ruleCount: number;
software: ISoftwareDto[];
languages: ILanguageDto[];
}
interface IState {
@ -22,7 +22,7 @@ interface IState {
}
export class Home extends React.Component<IProps, IState> {
constructor(props: any) {
constructor(props: IProps) {
super(props);
this.state = {
columnVisibility: columnVisibilityDefaults,
@ -38,10 +38,8 @@ export class Home extends React.Component<IProps, IState> {
render() {
return this.props.lists
? <div>
<Tagline {...this.props} listCount={this.props.lists.length}/>
<ListsTable {...this.props}
pageSize={this.state.pageSize}
columnVisibility={this.state.columnVisibility}/>
<Tagline listCount={this.props.lists.length} ruleCount={this.props.ruleCount}/>
<ListsTable {...this.props} {...this.state}/>
{this.renderColumnVisibilityCheckboxes()}
</div>
: null;
@ -81,7 +79,7 @@ export class Home extends React.Component<IProps, IState> {
this.forceUpdate();
}
private findWithAttr(array: any, attr: any, value: any) {
private findWithAttr(array: any, attr: string, value: string) {
for (let i = 0; i < array.length; i += 1) {
if (array[i][attr] === value) {
return i;

8
src/FilterLists.Web/ClientApp/modules/home/HomeContainer.tsx
View file

@ -1,14 +1,14 @@
import * as React from "react";
import "isomorphic-fetch";
import { IListDto, ISoftwareDto, ILanguageDto } from "./interfaces";
import { ILanguageDto, IListDto, ISoftwareDto } from "./interfaces";
import "../../utils/loader.css";
import { Home } from "./Home";
interface IState {
languages: ILanguageDto[];
lists: IListDto[];
ruleCount: number;
software: ISoftwareDto[];
languages: ILanguageDto[];
}
export class HomeContainer extends React.Component<{}, IState> {
@ -16,9 +16,9 @@ export class HomeContainer extends React.Component<{}, IState> {
super(props);
this.state = {
lists: [],
languages: [],
ruleCount: 0,
software: [],
languages: []
software: []
};
}

2
src/FilterLists.Web/ClientApp/modules/home/components/Tagline.tsx
View file

@ -1,8 +1,8 @@
import * as React from "react";
interface IProps {
ruleCount: number,
listCount: number;
ruleCount: number,
}
export const Tagline = (props: IProps) => {

2
src/FilterLists.Web/ClientApp/modules/home/components/detailsExpander/infoCard/InfoCard.tsx
View file

@ -30,7 +30,7 @@ export const InfoCard = (props: IProps) => {
<Tags tags={props.tags}/>
<div className="d-md-none">
{props.syntax.supportedSoftware.map(
(s: ISyntaxSupportedSoftwareDto, i: any) =>
(s: ISyntaxSupportedSoftwareDto, i: number) =>
<a href={s.homeUrl} title={`View ${s.name}'s homepage.`} key={i}>
<SoftwareIcon id={s.id} key={i}/>
</a>)}

4
src/FilterLists.Web/ClientApp/modules/home/components/detailsExpander/infoCard/Languages.tsx
View file

@ -10,11 +10,11 @@ export const Languages = (props: IProps) => {
? <li className="list-group-item">
<p className="m-0">Languages:</p>
<ul>
{props.languages.map((language: any) => <li>{language}</li>)}
{props.languages.map((language: string) => <li>{language}</li>)}
</ul>
</li>
: <li className="list-group-item">
<p>Language: {props.languages.map((language: any) => language)}</p>
<p>Language: {props.languages.map((language: string) => language)}</p>
</li>
: null;
};

2
src/FilterLists.Web/ClientApp/modules/home/components/detailsExpander/infoCard/Tag.tsx
View file

@ -1,6 +1,6 @@
import * as React from "react";
import { IListTagDto } from "../IFilterListDetailsDto";
import { getContrast } from "../../../../../utils/GetContrast";
import { getContrast } from "../../../../../utils";
export const Tag = (props: IListTagDto) => {
const style = {

17
src/FilterLists.Web/ClientApp/modules/home/components/listsTable/ListsTable.tsx
View file

@ -3,9 +3,9 @@ import { IListDto, ISoftwareDto, ILanguageDto } from "../../interfaces";
import ReactTable from "react-table"
import "react-table/react-table.css"
import "./listsTable.css";
import * as moment from "moment";
import { SoftwareIcon } from "../softwareIcon";
import { getContrast } from "../../../../utils/GetContrast";
import { getContrast } from "../../../../utils";
import * as moment from "moment";
import { DetailsExpander } from "../../components";
export interface IColumnVisibility {
@ -14,9 +14,9 @@ export interface IColumnVisibility {
}
interface IProps {
languages: ILanguageDto[];
lists: IListDto[];
software: ISoftwareDto[];
languages: ILanguageDto[];
columnVisibility: IColumnVisibility[];
pageSize: number;
}
@ -49,10 +49,11 @@ export const ListsTable = (props: IProps) => {
style={{ width: "100%" }}
value={filter ? filter.value : "any"}>
<option value="any">Any</option>
{props.software.map((s: any, i) => <option value={s.id} key={i}>{s.name}</option>)}
{props.software.map(
(s: ISoftwareDto, i: number) => <option value={s.id} key={i}>{s.name}</option>)}
</select>,
sortable: false,
Cell: (c: any) => c.value.map((s: number, i: any) => <SoftwareIcon id={s} key={i}/>),
Cell: (c: any) => c.value.map((s: number, i: number) => <SoftwareIcon id={s} key={i}/>),
width: 155,
headerClassName: "d-none d-md-block",
className: "d-none d-md-block",
@ -68,7 +69,7 @@ export const ListsTable = (props: IProps) => {
sortable: false,
Cell: (c: any) =>
<div className="fl-tag-container">
{c.value.map((e: any, i: any) =>
{c.value.map((e: any, i: number) =>
<span className="badge"
style={{
backgroundColor: `#${e.colorHex}`,
@ -97,13 +98,13 @@ export const ListsTable = (props: IProps) => {
style={{ width: "100%" }}
value={filter ? filter.value : "any"}>
<option value="any">Any</option>
{props.languages.map((l: any, i) =>
{props.languages.map((l: ILanguageDto, i: number) =>
<option value={l.iso6391} key={i}>{l.name}</option>)}
</select>,
sortable: false,
Cell: (c: any) =>
<div className="fl-tag-container">
{c.value.map((e: any, i: any) =>
{c.value.map((e: ILanguageDto, i: number) =>
<span className="badge badge-secondary"
title={e.name}
key={i}>

30
src/FilterLists.Web/ClientApp/modules/home/components/softwareIcon/SoftwareIcon.tsx
View file

@ -1,18 +1,20 @@
import * as React from "react";
import img1 from "./imgs/01-uBlock-Origin.svg";
import img2 from "./imgs/02-Adblock-Plus.svg";
import img3 from "./imgs/03-AdGuard.png";
import img4 from "./imgs/04-DNS66.png";
import img5 from "./imgs/05-Nano-Adblocker.png";
import img6 from "./imgs/06-AdBlock.png";
import img7 from "./imgs/07-AdAway.png";
import img8 from "./imgs/08-Personal-Blocklist.png";
import img10 from "./imgs/10-Redirector.png";
import img13 from "./imgs/13-MinerBlock.svg";
import img14 from "./imgs/14-Pi-hole.png";
import img15 from "./imgs/15-uBlock.svg";
import img16 from "./imgs/16-Internet-Explorer-TPL.png";
import img18 from "./imgs/18-FireHOL.png";
import {
img1,
img2,
img3,
img4,
img5,
img6,
img7,
img8,
img10,
img13,
img14,
img15,
img16,
img18
} from "./imgs";
interface IProps {
id: number;

31
src/FilterLists.Web/ClientApp/modules/home/components/softwareIcon/imgs/index.ts Normal file
View file

@ -0,0 +1,31 @@
import img1 from "./01-uBlock-Origin.svg";
import img2 from "./02-Adblock-Plus.svg";
import img3 from "./03-AdGuard.png";
import img4 from "./04-DNS66.png";
import img5 from "./05-Nano-Adblocker.png";
import img6 from "./06-AdBlock.png";
import img7 from "./07-AdAway.png";
import img8 from "./08-Personal-Blocklist.png";
import img10 from "./10-Redirector.png";
import img13 from "./13-MinerBlock.svg";
import img14 from "./14-Pi-hole.png";
import img15 from "./15-uBlock.svg";
import img16 from "./16-Internet-Explorer-TPL.png";
import img18 from "./18-FireHOL.png";
export {
img1,
img2,
img3,
img4,
img5,
img6,
img7,
img8,
img10,
img13,
img14,
img15,
img16,
img18
};

5
src/FilterLists.Web/ClientApp/utils/index.ts Normal file
View file

@ -0,0 +1,5 @@
import { getContrast } from "./GetContrast";
export {
getContrast
};