feat(basic): hide answer area when there are not answer and note

.changeset/calm-rocks-jump.md

@@ -0,0 +1,5 @@
+---
+'anki-templates': patch
+---
+
+feat(basic): hide answer area when there are not answer and note (没有答案和备注时隐藏答案区域)

src/components/card-shell.tsx

@@ -103,7 +103,7 @@ export const CardShell: FC<Props> = ({
           />
           {questionExtra}
         </Block>
-        {back ? (
+        {back && answer ? (
           <Block name={t('answer')} id={prefNoScroll ? undefined : 'answer'}>
             {answer}
           </Block>

src/entries/basic.tsx

@@ -1,27 +1,32 @@
 import { AnkiField } from '@/components/field';
 import { CardShell } from '../components/card-shell';
 import { t } from '@/utils/locale';
-import { useField } from '@/hooks/use-field';
 import clsx from 'clsx';
+import { isFieldEmpty } from '@/utils/field';
+import { FIELD_ID } from '@/utils/const';
 
 export default () => {
-  const note = useField('note');
+  const hasNote = !isFieldEmpty(FIELD_ID('note'));
+  const hasAnswer = !isFieldEmpty(FIELD_ID('answer'));
+
   return (
     <CardShell
       title={t('question')}
       answer={
-        <>
-          <AnkiField name="answer" className="prose dark:prose-invert" />
-          {note ? (
-            <>
-              <hr className="my-4" />
+        hasAnswer || hasNote ? (
+          <>
+            {hasAnswer ? (
+              <AnkiField name="answer" className="prose dark:prose-invert" />
+            ) : null}
+            {hasAnswer && hasNote ? <hr className="my-4" /> : null}
+            {hasNote ? (
               <AnkiField
                 name="note"
                 className={clsx('prose prose-sm mt-3', 'dark:prose-invert')}
               />
-            </>
-          ) : null}
-        </>
+            ) : null}
+          </>
+        ) : null
       }
     />
   );