title: Typescript Redux - Typing of initialState with CreateSlice
body: <p>I have used CreateSlice to create my reducer/actions like in the code below:</p>
  <pre><code>import { createSlice, PayloadAction } from '@reduxjs/toolkit';
  import { Modal } from 'antd';
  
  export interface ModalState {
    modalProps: React.ComponentProps&lt;typeof Modal&gt;;
    visible: boolean;
    modalContent: string;
  }
  
  export interface ModalInfos {
    modalProps: React.ComponentProps&lt;typeof Modal&gt;;
    modalContent: string;
  }
  
  const initialState = {
    modalProps: {},
    visible: false,
    modalContent: '',
  };
  
  const modal = createSlice({
    name: 'modal',
    initialState,
    reducers: {
      openModal(state, action: PayloadAction&lt;ModalInfos&gt;) {
        state.modalProps = action.payload.modalProps;
        state.modalContent = action.payload.modalContent;
        state.visible = true;
      },
      closeModal(state) {
        state.visible = false;
      },
    },
  });
  
  export const { openModal, closeModal } = modal.actions;
  
  export default modal.reducer;
  </code></pre>
  <p>I did not type my initialstate (so I am not using my ModalState interface), but when I try to do that:</p>
  <pre><code>const initialState: ModalState = {
    modalProps: {},
    visible: false,
    modalContent: '',
  };
  </code></pre>
  <p>I then get a strange error message on the following line:</p>
  <pre><code>state.modalProps = action.payload.modalProps;
  </code></pre>
  <p>The message is:</p>
  <pre><code>    Type 'PropsWithChildren&lt;ModalProps&gt;' is not assignable to type 'WritableDraft&lt;PropsWithChildren&lt;ModalProps&gt;&gt;'.
    Types of property 'okButtonProps' are incompatible.
      Type 'Partial&lt;{ href: string; target?: string | undefined; onClick?: ((event: MouseEvent&lt;HTMLElement, MouseEvent&gt;) =&gt; void) | undefined; } &amp; BaseButtonProps &amp; Pick&lt;...&gt; &amp; { ...; } &amp; Pick&lt;...&gt;&gt; | undefined' is not assignable to type 'WritableDraft&lt;Partial&lt;{ href: string; target?: string | undefined; onClick?: ((event: MouseEvent&lt;HTMLElement, MouseEvent&gt;) =&gt; void) | undefined; } &amp; BaseButtonProps &amp; Pick&lt;...&gt; &amp; { ...; } &amp; Pick&lt;...&gt;&gt;&gt; | undefined'.
        Type 'Partial&lt;{ href: string; target?: string | undefined; onClick?: ((event: MouseEvent&lt;HTMLElement, MouseEvent&gt;) =&gt; void) | undefined; } &amp; BaseButtonProps &amp; Pick&lt;...&gt; &amp; { ...; } &amp; Pick&lt;...&gt;&gt;' is not assignable to type 'WritableDraft&lt;Partial&lt;{ href: string; target?: string | undefined; onClick?: ((event: MouseEvent&lt;HTMLElement, MouseEvent&gt;) =&gt; void) | undefined; } &amp; BaseButtonProps &amp; Pick&lt;...&gt; &amp; { ...; } &amp; Pick&lt;...&gt;&gt;&gt;'.
          Types of property 'defaultValue' are incompatible.
            Type 'string | number | readonly string[] | undefined' is not assignable to type 'string | number | string[] | undefined'.
              Type 'readonly string[]' is not assignable to type 'string | number | string[] | undefined'.
                The type 'readonly string[]' is 'readonly' and cannot be assigned to the mutable type 'string[]'.ts(2322)
  </code></pre>
  <p>Is it OK not to assign a type to my initalState ? If not, the types of &quot;state.modalProps&quot; and &quot;action.payload.modalProps&quot; are in my opinion identical, so I am not sure how to fix that...</p>