import { IS_FILE_SERVING_ENABLED } from "#env/env-vars";
import { createArchiveFileURL } from "#lib/urls";
import { createBlockComponent } from "#components/meta";
import { Details } from "#components/details";
import { FormRouter } from "#components/forms";
import { FormSectionText } from "#components/forms/sections";
import { KemonoLink } from "#components/links";
import {
  DescriptionList,
  DescriptionSection,
  List,
  ListItem,
} from "#components/lists";
import {
  Overview,
  OverviewHeader,
  OverviewBody,
  IOverviewProps,
} from "#components/overviews";
import { IArchiveFile } from "./types";

interface IProps extends IOverviewProps {
  archiveFile: IArchiveFile;
}

export const ArchiveFileOverview = createBlockComponent(undefined, Component);

function Component({ id, archiveFile, ...props }: IProps) {
  const { file, file_list, password } = archiveFile;
  const { hash } = file;
  const formID = `${id}-update`;

  return (
    <Overview id={id} {...props}>
      <OverviewHeader>
        {/* TODO: replace with a heading component */}
        <h2>{file.hash}</h2>
        {password ? (
          <DescriptionList>
            <DescriptionSection
              dKey="Password"
              dValue={password}
              isValuePreformatted
            />
          </DescriptionList> ? (
            // empty string means it needs password because reasons
            password === ""
          ) : (
            <div>
              <p>Archive needs a password, but none was provided.</p>
              <Details summary="Provide password">
                <FormRouter
                  action={`/file/${hash}`}
                  method="PATCH"
                  submitButton={() => "Send"}
                >
                  <FormSectionText
                    id={`${formID}-password`}
                    name="password"
                    label="Password"
                  />
                </FormRouter>
              </Details>
            </div>
          )
        ) : undefined}
      </OverviewHeader>

      <OverviewBody>
        {file_list.length === 0 ? (
          <>Archive is empty or missing password.</>
        ) : (
          <List isOrdered>
            {file_list.map((filename, index) => (
              <FileItem
                key={`${filename}-${index}`}
                name={filename}
                archiveHash={file.hash}
                archiveExtension={file.ext}
              />
            ))}
          </List>
        )}
      </OverviewBody>
    </Overview>
  );
}

interface IFileItemProps {
  name: string;
  archiveHash: string;
  archiveExtension: string;
  password?: string;
}

function FileItem({
  name,
  archiveHash,
  archiveExtension,
  password,
}: IFileItemProps) {
  return (
    <ListItem>
      {!IS_FILE_SERVING_ENABLED ? (
        name
      ) : (
        <KemonoLink
          url={String(
            createArchiveFileURL(archiveHash, archiveExtension, name, password)
          )}
        >
          {name}
        </KemonoLink>
      )}
    </ListItem>
  );
}
