Skip to content

Commit

Permalink
Much much better manage page
Browse files Browse the repository at this point in the history
LeoColomb authored Mar 1, 2023

Verified

This commit was created on GitHub.com and signed with GitHub’s verified signature.
1 parent 29233aa commit efcf50f
Showing 7 changed files with 81 additions and 106 deletions.
31 changes: 31 additions & 0 deletions pages/app/components/Milestone.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
import { IntlDate } from '~/components/IntlDate'

export const Milestone = ({
name,
date,
}: {
name: string
date: Date | string | undefined
}) => {
return (
(date && (
<div
style={{
display: 'flex',
flexDirection: 'column',
}}
>
<strong>
<IntlDate date={new Date(date)} />
</strong>
<small
style={{
textTransform: 'uppercase',
}}
>
{name}d
</small>
</div>
)) || <></>
)
}
78 changes: 42 additions & 36 deletions pages/app/components/Rule.tsx
Original file line number Diff line number Diff line change
@@ -1,41 +1,47 @@
import { Form } from '@remix-run/react'
import { IntlDate } from '~/components/IntlDate'
import { Milestone } from './Milestone.js'

export const Rule = ({ rule }: { rule: Rule }) => {
return (
<tr>
<th scope="row">{rule.matchers[0].value}</th>
<td>
<kbd>
{rule.enabled
? rule.actions[0].type === 'worker'
? 'Deprecated'
: 'Active'
: 'Expired'}
</kbd>
</td>
<td>
<IntlDate date={new Date(rule.data?.expire)} />
</td>
<td>
{/* <Form method="delete">
<input type="text" name="zone" hidden value={rule.zone.id} />
<input type="text" name="rule" hidden value={rule.tag} />
<button type="submit" role="button" className="secondary">
🗑️
</button>
</Form> */}
</td>
</tr>
<details>
<summary
style={{
display: 'flex',
alignItems: 'center',
width: '100%',
}}
>
<header
style={{
display: 'flex',
flexGrow: '1',
alignItems: 'center',
justifyContent: 'space-between',
}}
>
{rule.matchers[0].value}
<code>
{rule.enabled
? rule.actions[0].type === 'worker'
? '⏲️ Deprecated'
: '📨 Active'
: '🗃️ Expired'}
</code>
</header>
</summary>

<article className="grid">
<Milestone name="📨 Activate" date={rule.data?.activate} />
<Milestone name="🗃️ Expire" date={rule.data?.expire} />
<Milestone name="⏲️ Deprecate" date={rule.data?.deprecate} />
<Milestone name="🗑️ Remove" date={rule.data?.remove} />
</article>
{/* <Form method="delete">
<input type="text" name="zone" hidden value={rule.zone.id} readOnly />
<input type="text" name="rule" hidden value={rule.tag} readOnly />
<button type="submit" role="button" className="secondary">
🗑️
</button>
</Form> */}
</details>
)
}

// <article className="text-blue-600 underline">
// <div className="grid">
// <h4>{rule.matchers[0].value}</h4>
// <IntlDate date={new Date(rule.data?.expire)} />
// <button type="button" className="secondary">
// 🗑️
// </button>
// </div>
// </article>
54 changes: 0 additions & 54 deletions pages/app/components/RulesList.tsx

This file was deleted.

2 changes: 1 addition & 1 deletion pages/app/components/Setting.tsx
Original file line number Diff line number Diff line change
@@ -50,7 +50,7 @@ export const Setting = ({
}
>
{(valueResolved) => {
setValue(valueResolved)
setValue(valueResolved || setting.value)
return (
<input
type="text"
1 change: 1 addition & 0 deletions pages/app/models/rule.server.ts
Original file line number Diff line number Diff line change
@@ -46,6 +46,7 @@ export async function createRule(
],
name: JSON.stringify({
dispoflare: true,
activate: new Date(),
expire,
remove,
}),
20 changes: 5 additions & 15 deletions pages/app/routes/manage.tsx
Original file line number Diff line number Diff line change
@@ -45,21 +45,11 @@ export default function Manage() {
}
>
{(rules: Rule[]) => (
<table role="grid">
<thead>
<tr>
<th scope="col">Rule address</th>
<th scope="col">Status</th>
<th scope="col">Expire on</th>
<th scope="col"></th>
</tr>
</thead>
<tbody>
{rules.map((rule) => (
<Rule rule={rule} key={rule.tag} />
))}
</tbody>
</table>
<div className="">
{rules.map((rule) => (
<Rule rule={rule} key={rule.tag} />
))}
</div>
)}
</Await>
</Suspense>
1 change: 1 addition & 0 deletions sdk/api.d.ts
Original file line number Diff line number Diff line change
@@ -35,6 +35,7 @@ type Rule = {

type DispoflareData = {
dispoflare: true
activate: Date | string
expire: Date | string
remove: Date | string | undefined
deprecate: Date | string | undefined

0 comments on commit efcf50f

Please sign in to comment.